Skip to content

T
TF-MOM-WEB
Commit cd0efbeb authored by jingnan's avatar jingnan 👀
Browse files
Options

Merge branch 'dev' of http://94.191.100.41/tfmom/tf-mom-web into dev

parents 51db4ef1 45f1c34f
Show whitespace changes
Inline Side-by-side
Showing with 1508 additions and 0 deletions
applications/architecture-dee/src/layout/home.vue 0 → 100644
View file @ cd0efbeb
<template>
<div :class="classObj" class="app-wrapper">
<!-- <div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside" /> -->
<sidebar class="sidebar-container" />
<div v-if="showNav" :class="{'fixed-header':fixedHeader}">
<navbar />
<div v-if="showTag" class="tag-box">
<tags-view />
</div>
</div>
<div class="main-container">
<div style="min-width: 1280px;width:100%;height:100%;">
<Home />
</div>
</div>
</div>
</template>
<script>
import { Navbar, Sidebar, TagsView, Home } from './components'
import ResizeMixin from './mixin/ResizeHandler'
export default {
name: 'Layout',
components: {
Navbar,
Sidebar,
TagsView,
Home
},
mixins: [ResizeMixin],
props: {
showNav: {
type: Boolean,
default: false
}
},
data: function() {
return {
noSidePage: [],
showTag: false
}
},
computed: {
sidebar() {
return this.$store.state.app.sidebar
},
device() {
return this.$store.state.app.device
},
fixedHeader() {
return this.$store.state.settings.fixedHeader
},
classObj() {
return {
hideSidebar: !this.sidebar.opened || !this.showNav,
openSidebar: this.sidebar.opened && this.showNav,
withoutAnimation: this.sidebar.withoutAnimation,
mobile: this.device === 'mobile'
}
}
},
watch: {
'$route'(route) {
this.showTag = this.$route.query.showTag !== 'false'
// if (this.noSidePage.length && this.noSidePage.includes(route.name)) {
// this.handleClickOutside()
// } else {
// this.handleClickOpenside()
// }
}
},
methods: {
handleClickOutside() {
this.$store.dispatch('app/closeSideBar', { withoutAnimation: false })
},
handleClickOpenside() {
this.$store.dispatch('app/openSideBar', { withoutAnimation: false })
}
}
}
</script>
<style lang="scss" scoped>
@import "~@/styles/mixin.scss";
@import "~@/styles/variables.scss";
.app-wrapper {
@include clearfix;
position: relative;
height: 100%;
width: 100%;
// background:linear-gradient(135deg,rgba(50,74,141,1) 0%,rgba(62,117,121,1) 47%,rgba(75,174,71,1) 100%);
background:#E8EDEF;
&.mobile.openSidebar{
position: fixed;
top: 0;
}
.tag-box{
padding-left: $asideBarWidth;
}
.show-nav{
height: 100%;
&.app-main{
padding: 0
}
}
}
.drawer-bg {
background: #000;
opacity: 0.3;
width: 100%;
top: 0;
height: 100%;
position: absolute;
z-index: 999;
}
.fixed-header {
position: fixed;
top: 0;
right: 0;
z-index: 9;
width: calc(100% - #{$sideBarWidth});
transition: width 0.28s;
}
.hideSidebar .fixed-header {
width: calc(100% - 54px)
}
.mobile .fixed-header {
width: 100%;
}
.main-container {
overflow: auto;
height: calc(100% - #{$asideBarWidth});
box-sizing:border-box;
background:#F1F4F5;
&::-webkit-scrollbar {
height: 12px;
width: 12px;
}
}
</style>
applications/architecture-dee/src/router/index.js
View file @ cd0efbeb
...@@ -140,6 +140,15 @@ export const constantRoutes = [ ...@@ -140,6 +140,15 @@ export const constantRoutes = [
component: () => import('@/views/navigation/index'), component: () => import('@/views/navigation/index'),
hidden: true hidden: true
}, },
{
path: '/home',
name: 'home',
meta: { title: '任务中心', disnav: false },
// component: () => import('../../../dee-task-center/src/views/home/index.vue'),
// component: () => import('@/layout/home.vue'),
redirect: '/dee-task-center/home?title=任务中心',
hidden: true
},
// { // {
// path: '/oldIndex', // path: '/oldIndex',
// name: 'oldNavigation', // name: 'oldNavigation',
......
applications/architecture-dee/src/views/home/index.vue 0 → 100644
View file @ cd0efbeb
<script>
export default {
created() {
// const { path } = params
// console.log('000000', decodeURIComponent(query.fullPath), path)
this.$router.push({ path: '/dee-task-center/workflow/task-center/home-index' })
},
render: function(h) {
return h() // avoid warning message
}
}
</script>
applications/dee-task-center/src/views/home/compontents/apply-app.vue 0 → 100644
View file @ cd0efbeb
/**
* @Description: 应用APP
* @author xioln
* @date 2023-11-27
* @FilePath: applications/dee-task-center/src/views/home/compontents/apply-app.vue
*/
<template>
<div class="apply-app">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>应用APP</span>
</div>
<div class="text item div-card">
<div v-for="(item, i) in cardList" :key="i" class="card" @click="handClick(item)">
<div class="icon">
<img :src="item.icon" alt="Icon">
</div>
<div class="title">
{{ item.title }}
</div>
</div>
</div>
</el-card>
</div>
</template>
<script>
export default {
components: {},
data() {
return {
cardList: [
{
icon: '/icons/home/cangku_kucun.png',
title: '库房管理',
route: {
path: '/page/86a5fa19-e245-4732-aff6-c48b18e2b5c7?title=采购入库&menuRootAppId=1626781924331'
}
},
{
icon: '/icons/home/计划管理与执行.png',
title: '计划管理与执行',
route: {
path: '/dee-mes/inspection-dispatch?title=检验派工&menuRootAppId=1626785745213'
}
},
{
icon: '/icons/home/质量单据.png',
title: '质量单据'
},
{
icon: '/icons/home/物料配套管理.png',
title: '物料配套管理',
route: {
path: '/page/f535277f-b636-437b-a88b-bf42b2087f5e?title=缺件明细维护&menuRootAppId=1626789048727'
}
},
{
icon: '/icons/home/不合格品.png',
title: '线边库管理',
route: {
path: '/page/0b6a7a64-8480-4f95-a24a-c9a480a90c10?title=工具台账管理&menuRootAppId=1626788064518'
}
},
{
icon: '/icons/home/报表中心.png',
title: '报表中心',
route: {
path: '/page/fb9de1be-089d-44e6-9482-6afe2ebf61ad?title=台账流水&menuRootAppId=1626788424160'
}
},
{
icon: '/icons/home/实物构型管理.png',
title: '实物构型管理'
},
{
icon: '/icons/home/基础数据管理.png',
title: '基础数据管理',
route: {
path: '/page/6f1343ab-3376-4bf1-8cd6-b1f8031e9a6f?title=库房库位定义&menuRootAppId=1626781744425'
}
},
{
icon: '/icons/home/系统管理.png',
title: '系统管理',
route: {
path: '/systemHome?title=systemHome'
}
},
{
icon: '/icons/home/看板.png',
title: '看板',
route: {
path: '/dee-task-center/workflow/task-center/home?title=我的任务&showMenu=false'
}
},
{
icon: '/icons/home/单架次MBOM.png',
title: '单架次MBOM',
route: {
path: '/page/262fe280-0436-4920-a549-4c4aade22f10?title=指令标识维护&menuRootAppId=1626782294437'
}
}
]
}
},
computed: {},
watch: {},
created() {
// 初始化数据
},
methods: {
handClick(val) {
if (!val.route) {
this.$utils.showMessageWarning('暂无页面')
return
}
this.$router.push(val.route)
}
}
}
</script>
<style lang='scss'>
.apply-app {
height: 100%;
.box-card {
height: 100%;
.el-card__body {
height: calc(100% - 90px);
}
}
.div-card {
height: 80px;
// 下面是重点
display: grid;
grid-template-columns: repeat(auto-fill, calc((100% - 60px) / 4)); // 自动填充一行的卡片个数
justify-content: space-between; // 卡片两端对齐，与flex的该属于一致
grid-gap: 20px;
// padding-bottom: 10px;
.card {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
flex-wrap: wrap;
width: calc(100%);
height: calc(100%);
font-size: 12px;
border-radius: 4px;
cursor: pointer;
transition: box-shadow 0.3s ease;
border: 1px solid #C7C7C7;
padding: 5px;
// .icon{
// img{
// width: 30px;
// }
// }
.title {
text-align: center;
width: calc(100% - 10px);
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
}
.card:hover {
box-shadow: 0 0 10px rgba(224, 220, 220, 0.7);
}
.card:active {
box-shadow: 0 0 5px rgba(185, 184, 184, 0.5);
transform: scale(0.95);
}
}
}</style>
applications/dee-task-center/src/views/home/compontents/my-task.vue 0 → 100644
View file @ cd0efbeb
<template>
<div class="my-task">
<div class="task-header">
<dee-form
ref="AddForm"
:form="searchForm"
:form-data="searchFormData"
form-btn-position="center"
:inline="true"
style="width: calc(100% - 80px);"
/>
<div class="refresh">
<i class="el-icon-refresh" style="margin-right:10px" title="刷新" @click="refresh" />
<span @click="jumpList">更多<i class="el-icon-arrow-right" title="更多" /></span>
</div>
</div>
<el-scrollbar class="task-content">
<div v-for="(item, index) in taskList" :key="index" :class="['task-item', {'active-item': clickTask && clickTask.id === item.id,'unClaimed-type':item.unClaimedFlag}]" @click="goInfo(item)">
<div class="task-item-label">
<div class="ti-label">
<div class="flex-start">
<span class="task-status" :style="{color: textColor[item.status] || '#2A75CE'}">【{{ item.status }}】</span>
<!-- <img src="/images/doc.png" alt> -->
<!-- <img :src="showIcon(item.businessObject)" alt> -->
<!-- {{ $utils.getFlowName(item.workItemName) }} -->
<span class="task-name">{{ item.name }}</span>
</div>
<div class="task-item-time">
{{ item.time }}
</div>
</div>
<div class="task-item-info">
<div class="task-left">
<!-- <span :title="item.theme" class="theme">{{ item.theme }}</span> -->
<span class="title">
<span v-for="(attr, i) in item.showTitle" :key="`attr_${i}`">
{{ attr.title }}
</span>
</span>
<span v-if="item.expireTimeInMillis && item.expireTimeInMillis > 0" class="due-text">超期</span>
</div>
</div>
<div v-if="item.proxyUserName" class="task-item-time">
代理人：{{ item.proxyUserName }}
</div>
</div>
</div>
<div v-if="!initShowFont" class="more-bar">
<span v-if="taskList.length < pagination.total" class="more" @click="getMoreTaskData">加载更多</span>
<span v-else>已全部加载！</span>
</div>
</el-scrollbar>
</div>
</template>
<script>
import { showIcon } from '@/utils/util'
import { getTemps } from '@/api/workflow/userSettings.js'
import { getUnfinishedTask, getFinishedTask } from '@/api/workflow/taskCenter.js'
import { getAllApplication } from '@/api/workflow/config'
import _get from 'lodash.get'
import { post } from '@/utils/http'
export default {
name: 'MyTask',
data() {
return {
statusColor: {
'审批中': '#C3A146',
'签审中': '#C3A146',
'启动': '#C3A146',
'提交审阅': '#0460C7',
'待发放': '#C3A146',
'已解决': '#3B8B41',
'已审阅': '#3B8B41',
'已发放': '#3B8B41'
},
dict: {},
stateDictName: 'ObjStatus',
isShowMoreFont: true,
initShowFont: false,
taskList: [],
pagination: {
currentPage: 1,
pageSize: 10,
pageSizes: [5],
total: 0
},
search: '',
pageCount: 0,
clickNum: 1,
textColor: {
// '编制': '#4BAE47',
// '审批': '#FFA200',
// '待发放': '#67ADFE',
驳回: '#DD3B3B',
// '提交审阅': '#FFA200',
// '启动': '#4BAE47',
// '审批中': '#FFA200',
// '工作中': '#4BAE47',
// '待审阅': '#FFA200',
// '审阅中': '#67ADFE',
// '初始化构型层': '#FFA200',
// '修改中': '#FFA200',
默认: '#2A75CE'
},
searchForm: {},
searchFormData: [
{
split: 2,
data: [
{
key: 'appId',
title: '',
component: {
name: 'el-select',
options: []
},
handler: {
change: (val) => {
this.pagination.currentPage = 1
if (val) {
const findItem = this.$utils.findFormProp(this.searchFormData, 'appId').component.options.find(r => r.value === val)
this.getTemp(findItem.data.innerName)
} else {
this.processDefKey = []
this.getTasks(1, this.type)
}
}
}
}
// {
// key: 'receiveTimeRange',
// title: '',
// component: {
// name: 'el-date-picker',
// type: 'daterange',
// clearable: true,
// format: 'yyyy-MM-dd',
// startPlaceholder: '开始时间',
// endPlaceholder: '结束时间'
// },
// handler: {
// change: (val) => {
// this.pagination.currentPage = 1
// this.getTasks(1)
// }
// }
// }
]
}
],
clickTask: null,
processDefKey: [],
type: '我的待办'
}
},
created() {
},
mounted: function() {
this.getAllApplication()
if (Object.keys(this.dict).length === 0) {
this.getDict(true)
} else {
this.getTasks(1, this.type)
}
},
methods: {
getAllApplication() {
getAllApplication({
}).then(res => {
this.$utils.findFormProp(this.searchFormData, 'appId').component.options = res.items.content.filter(x => !x.isDisable).map(r => {
return {
label: r.name,
value: r.id,
data: r
}
})
})
},
getTemp(appName) {
getTemps(this.searchForm.appId, this.searchForm.appId, 1, 9999, { 'enable': true, 'appName': appName }, true).then(res => {
if (res.items && res.items.content.length) {
this.processDefKey = res.items.content.map(r => r.procDefKey)
this.getTasks(1, this.type)
} else {
this.taskList = []
}
})
},
showTitleParams(propForm, titleParams, title) {
if (!propForm) return [{ title }]
if (!titleParams) return [{ title }]
return titleParams.map(attr => {
let title = _get(propForm, attr.attr) || ''
if (attr.placeholder) {
title = attr.placeholder.replace(/\$\*/, title)
}
if (attr.connector) {
title += attr.connector
}
if (attr.dictTypeCode) {
let dictTitleList = this.dict[attr.dictTypeCode]
const oldStateDictName = this.stateDictName
this.stateDictName = attr.dictTypeCode
if (!dictTitleList) {
this.stateDictName = oldStateDictName
dictTitleList = this.dict[attr.dictTypeCode]
}
const _title = dictTitleList.find(dic => dic.value === title)
title = (_title && _title.label) || ''
}
return {
style: attr.style,
title: title
}
})
},
async getDict(flag) {
const list = await this.$utils.getDicListByCode(this.stateDictName)
this.$set(this.dict, this.stateDictName, list)
flag && this.getTasks(1, this.type)
},
getStateDisplayName(item) {
if (!item.bizExtInfo || !item.bizExtInfo.bizObjectState) {
return ''
}
const code = item.bizExtInfo.bizObjectState
return this.$utils.getParamsFromLists(this.dict[this.stateDictName], 'value', code, 'label') || code
},
// 获取待办任务列表
getTasks(page, type) {
console.log(type)
const params = {
'page': page || this.pagination.currentPage,
'size': this.pagination.pageSize
}
params.assignee = localStorage.getItem('userId')
if (this.searchForm.receiveTimeRange && this.searchForm.receiveTimeRange.length) {
params.receiveTime1 = this.searchForm.receiveTimeRange[0] + ' 00:00:00'
params.receiveTime2 = this.searchForm.receiveTimeRange[1] + ' 23:59:59'
}
const str = this.processDefKey && this.processDefKey.length ? this.processDefKey.map(x => `processDefKey=${x}`).join('&') + '&' : ''
this.type = type
if (type === '我的待办') {
getUnfinishedTask(str + this.$utils.filterParams(params)).then(res => {
if (params.page === 1) {
this.taskList = []
}
this.addData(res)
})
}
if (type === '已办任务') {
getFinishedTask(str + this.$utils.filterParams(params)).then(res => {
if (params.page === 1) {
this.taskList = []
}
this.addData(res)
})
}
if (type === '我的请求') {
post(`/workflow/inst?page=${params.page}&size=${params.size}`, { 'startedUserId': localStorage.getItem('userId'), 'checkOwnerSignAddFlag': true }).then(res => {
if (params.page === 1) {
this.taskList = []
}
this.addData(res)
})
}
},
addData(res) {
res.items.content.forEach((item) => {
let showTitle = []
if (item.bizExtInfo && item.bizExtInfo.bizAttrValues &&
item.bizExtInfo && item.bizExtInfo.bizConfig) {
const bizConfig = JSON.parse(item.bizExtInfo.bizConfig)
showTitle = this.showTitleParams(item.bizExtInfo.bizAttrValues, bizConfig[0].pending, (item.bizExtInfo && item.bizExtInfo.taskTitle) || '')
} else {
showTitle = [{ title: (item.bizExtInfo && item.bizExtInfo.taskTitle) || (item.bizExtInfo && item.bizExtInfo.processTitle) || '' }]
}
this.taskList.push({
id: item.id,
processInstanceId: item.processInstanceId,
name: item.aliasName || item.name,
showTitle,
theme: '',
// theme: theme,
title: item.bizExtInfo && item.bizExtInfo.taskTitle ? item.bizExtInfo.taskTitle : item.name,
time: item.startTime,
status: this.getStateDisplayName(item),
proxyUserName: item.proxyUserName || '',
expireTimeInMillis: item.expireTimeInMillis,
unClaimedFlag: item.unClaimedFlag
})
})
// this.goInfo(this.taskList.length ? this.taskList[0] : null)
this.pagination.total = res.items.totalElements
},
showIcon(row) {
return showIcon(row)
},
jumpList() {
this.$router.push({
path: '/dee-task-center/workflow/task-center/task',
query: { title: '任务查询' }
})
},
goInfo(item) {
this.clickTask = item
// this.$emit('getTaskDetail', item ? { id: item.id, processInstanceId: item.processInstanceId, title: item.title } : null)
this.$router.push({
path: `/task-detail-${item.id}`,
query: { id: item.id, insId: item.processInstanceId, title: item.title, showMenu: false }
})
},
getMoreTaskData() {
if (this.clickNum !== this.pageCount) {
this.pagination.currentPage += 1
this.getTasks(this.pagination.currentPage, this.type)
this.clickNum += 1
}
},
refresh() {
console.log(123123123)
this.getTasks(1, this.type)
}
}
}
</script>
<style lang="scss" >
.my-task {
height: 100%;
background-color: #ffffff;
padding: 10px;
box-sizing: border-box;
// border: 1px solid #D9D9D9;
position: relative;
.task-header{
display: flex;
justify-content: flex-start;
.dee-form2{
.el-form-item{
margin-bottom:10px;
}
}
}
.refresh{
position: absolute;
right: 9px;
top: 20px;
z-index: 10;
span{
font-size:12px;
color: #999999;
cursor: pointer;
}
i{
cursor: pointer;
font-weight: 400;
color: #999999;
}
i:hover {
color: rgb(42, 117, 206);
}
}
.el-icon-refresh{
margin-left:16px;
color: #999999;
}
.task-content {
padding-bottom: 10px;
font-size: 12px;
color: #212121;
overflow: hidden;
height: calc(100% - 50px);
width: 100%;
box-sizing: border-box;
.active-item{
background: #DEEDF4!important;
}
.unClaimed-type{
border-left: 3px solid #E79460!important;
}
.task-item {
// padding: 0px 8px;
cursor: pointer;
// transition: transform 0.3s ease-in-out,
// box-shadow 0.3s cubic-bezier(0.47, 0, 0.745, 0.715),
// border 0.3s linear 0.1s;
height: 90px;
box-sizing: border-box;
background: #FBFDFF;
border-radius: 2px;
border: 1px solid rgba(200, 212, 220, 0.88);
border-left: 3px solid #76B0D7;
margin-bottom: 12px;
padding: 20px 22px 0 18px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
&:hover {
// box-shadow: 0 2px 5px rgba(51, 51, 51, 0.25);
// -webkit-transform: translateY(-2px);
// -moz-transform: translateY(-2px);
// transform: translateY(-2px);
background-color: rgba(245,247,250,1);
}
.task-item-time {
font-size: 12px;
color: #737373;
text-align: right;
margin-top: 6px;
}
.title {
// max-width: calc(-60px + 100%);
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
margin-right: 10px;
}
.due-text{
color: red;
margin-left: 10px;
}
.ti-label {
display: flex;
justify-content: space-between;
margin-bottom: 10px;
img {
height: 18px;
width: 16px;
margin-right: 8px;
}
.task-status{
font-size: 14px;
}
.task-name{
font-weight: 900;
font-size: 14px;
}
}
.task-item-info {
width: 100%;
overflow: hidden;
.task-left {
width: calc(100% - 156px);
display: inline-flex;
justify-content: flex-start;
align-items: baseline;
color: #626262;
font-size:12px;
}
.theme {
box-flex: 1;
display: inline-block;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
max-width: calc(100% - 100px);
}
.state {
color: #363636;
padding: 0px 6px;
// transform: scale(0.8);
}
.state.cancel {
color: #fe2929;
}
}
}
}
.mt20{
display: inline-block;
margin-top: 20px;
}
.more-bar {
margin: 10px auto;
text-align: center;
font-size: 12px;
color: #999;
}
.more {
margin: auto;
margin-top: 20px;
color: #2f90e2;
height: 26px;
line-height: 26px;
padding: 0 20px;
background: rgba(231, 242, 255, 1);
border-radius: 13px;
display: inline-block;
cursor: pointer;
}
}
</style>
applications/dee-task-center/src/views/home/compontents/personal-assistant.vue 0 → 100644
View file @ cd0efbeb
/**
* @Description: 个人助手
* @author xioln
* @date 2023-11-27
* @FilePath: applications/dee-task-center/src/views/home/compontents/apply-app.vue
*/
<template>
<div class="apply-app">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>个人助手</span>
</div>
<div class="text item div-card">
<div v-for="(item, i) in cardList" :key="i" class="card" @click="handClick(item.title)">
<div class="icon">
<img :src="item.icon" alt="Icon">
</div>
<div class="title">
{{ item.title }}
</div>
</div>
</div>
</el-card>
</div>
</template>
<script>
export default {
components: {},
data() {
return {
cardList: [
{
icon: '/icons/home/质量单据.png',
title: '标准规范'
},
{
icon: '/icons/home/质量单据.png',
title: '帮助手册'
}
]
}
},
computed: {},
watch: {},
created() {
// 初始化数据
},
methods: {
}
}
</script>
<style lang='scss'>
.apply-app {
height: 100%;
.box-card {
height: 100%;
.el-card__body {
height: calc(100% - 90px);
}
}
.div-card {
height: 80px;
// 下面是重点
display: grid;
grid-template-columns: repeat(auto-fill, calc((100% - 60px) / 4)); // 自动填充一行的卡片个数
justify-content: space-between; // 卡片两端对齐，与flex的该属于一致
grid-gap: 20px;
// padding-bottom: 10px;
.card {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
flex-wrap: wrap;
width: calc(100%);
height: calc(100%);
font-size: 12px;
border-radius: 4px;
cursor: pointer;
transition: box-shadow 0.3s ease;
border: 1px solid #C7C7C7;
padding: 5px;
// .icon{
// img{
// width: 30px;
// }
// }
.title {
text-align: center;
width: calc(100% - 10px);
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
}
.card:hover {
box-shadow: 0 0 10px rgba(224, 220, 220, 0.7);
}
.card:active {
box-shadow: 0 0 5px rgba(185, 184, 184, 0.5);
transform: scale(0.95);
}
}
}</style>
applications/dee-task-center/src/views/home/index.vue 0 → 100644
View file @ cd0efbeb
/**
* @Description: 主页
* @author xioln
* @date 2023-11-23
* @FilePath: applications/dee-task-center/src/views/home/index.vue
*/
<template>
<div class="home-container">
<dee-fold-pane :min-percent="30" :default-percent="35" split="vertical" class="detail-pane">
<template slot="paneL">
<!-- 左侧 -->
<div class="Left-pane">
<div v-for="(item, i) in cardList" :key="i" class="card" @click="handClick(item.title)">
<div class="icon">
<img :src="item.icon" alt="Icon">
</div>
<div class="title">
{{ item.title }}
</div>
</div>
</div>
<div class="task">
<dee-tab
ref="deetab"
class="dee-tab"
:tabs="tabs"
@tabClick="tabClick"
>
<div :slot="activeTitle" style="height: 100%;">
<MyTask ref="myTask" />
</div>
<div slot="批量签审" style="height: 100%;">
<module-task-list ref="moduleTaskList" @goModuleTaskDetail="getTaskDetail" />
</div>
</dee-tab>
</div>
</template>
<template slot="paneR">
<div class="right-pane">
<dee-fold-pane :min-percent="30" :default-percent="60" split="vertical" class="detail-pane">
<template slot="paneL">
<!-- 中间 -->
<div class="right-centerPane-top" />
<div class="right-centerPane-bottom" />
</template>
<template slot="paneR">
<!-- 右侧 -->
<div class="right-pane-top">
<apply-app />
</div>
<div class="right-pane-bottom">
<personal-assistant />
</div>
</template>
</dee-fold-pane>
</div>
</template>
</dee-fold-pane>
</div>
</template>
<script>
import MyTask from './compontents/my-task.vue'
import ModuleTaskList from '../workflow/task-center/myPlanTask/moduleTaskListNew'
import ApplyApp from './compontents/apply-app.vue'
import PersonalAssistant from './compontents/personal-assistant.vue'
export default {
components: { MyTask, ModuleTaskList, ApplyApp, PersonalAssistant },
data() {
return {
cardList: [
{
icon: '/icons/home/我的待办.png',
title: '我的待办'
},
{
icon: '/icons/home/已办任务.png',
title: '已办任务'
},
{
icon: '/icons/home/我的请求.png',
title: '我的请求'
}
],
activeTitle: '我的待办'
}
},
computed: {
tabs() {
return this.activeTitle === '我的待办' ? [
{ id: this.activeTitle, name: this.activeTitle },
{ id: '批量签审', name: '批量签审' }
] : [{ id: this.activeTitle, name: this.activeTitle }]
}
},
watch: {},
created() {
// 初始化数据
},
mounted() {
this.$nextTick(() => {
this.$refs.myTask.getTasks(1, '我的待办')
})
},
methods: {
tabClick() {
this.$nextTick(() => {
this.$refs.myTask.getTasks(1, this.activeTitle)
})
},
handClick(title) {
this.activeTitle = title
this.$nextTick(() => {
this.$refs.myTask.getTasks(1, this.activeTitle)
})
},
getTaskDetail(data) {
this.id = data && data.id ? data.id : ''
this.processInstanceId = data && data.processInstanceId ? data.processInstanceId : ''
this.$router.push({
path: `/task-detail-${this.id}`,
query: { id: this.id, insId: this.processInstanceId, title: this.title, showMenu: false }
})
}
}
}
</script>
<style lang='scss'>
.home-container {
height: 100%;
box-sizing: border-box;
background-color: #fff;
// border: 1px solid #d9d9d9;
.right-pane {
height: 100%;
background-color: #F1F4F5 !important;
// border: 1px solid #d9d9d9;
box-sizing: border-box;
.splitter-pane-resizer.horizontal {
opacity: 1;
background-color: #F1F4F5;
height: 8px;
border-bottom: 1px solid #e0e0e0;
border-top: 1px solid #e0e0e0;
}
}
.Left-pane {
height: 80px;
// 下面是重点
display: grid;
grid-template-columns: repeat(auto-fill, calc((100% - 40px) / 3)); // 自动填充一行的卡片个数
justify-content: space-between; // 卡片两端对齐，与flex的该属于一致
padding-bottom: 15px;
.card {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
flex-wrap: wrap;
width: calc(100% - 20px);
height: 100%;
font-size: 14px;
border-radius: 4px;
cursor: pointer;
transition: box-shadow 0.3s ease;
margin: 10px;
}
.card:hover {
box-shadow: 0 0 10px rgba(224, 220, 220, 0.7);
}
.card:active {
box-shadow: 0 0 5px rgba(185, 184, 184, 0.5);
transform: scale(0.95);
}
}
.task {
height: calc(100% - 55px);
box-sizing: border-box;
position: relative;
.dee-tab{
height: 100%;
}
}
.right-pane-top{
height: 60%;
}
.right-pane-bottom{
margin-top: 8px;
height: calc(40% - 9px);
}
.right-centerPane-top{
height: 50%;
background: #fff;
border-radius: 4px;
}
.right-centerPane-bottom{
margin-top: 8px;
height: calc(50% - 9px);
background: #fff;
border-radius: 4px;
}
}
</style>
applications/dee-task-center/src/views/workflow/task-center/myPlanTask/moduleTaskListNew.vue 0 → 100644
View file @ cd0efbeb
<template>
<div class="module-task-list">
<div class="task-header">
<div class="refresh">
<i class="el-icon-refresh" style="margin-right:10px" title="刷新" @click="loadData(true)" />
</div>
</div>
<el-scrollbar v-dee-loading="loading" class="task-content">
<div v-for="(item, index) in taskList" :key="index" :class="['task-item', {'active-item': clickTask && clickTask.taskType === item.taskType }]" @click="goInfo(item)">
<div class="task-item-label">
<div class="ti-label">
<div class="flex-start">
<span v-if="item.taskType" class="task-status" :style="{color: '#2A75CE'}">【{{ item.taskType }}】</span>
<!-- <span class="task-name">{{ item.taskType }}</span> -->
</div>
<div class="task-item-num">
{{ item.taskCount }}
</div>
</div>
</div>
</div>
</el-scrollbar>
</div>
</template>
<script>
import { getMyTodoList } from '@/api/workflow/taskCenter'
export default {
name: 'ModuleTaskList',
data() {
return {
loading: false,
taskList: [],
clickTask: null
}
},
created() {
},
mounted() {
this.loadData()
},
methods: {
loadData(hasFlag) {
this.loading = true
getMyTodoList().then(res => {
const that = this
that.taskList = res.items || []
that.loading = false
// if (!hasFlag) {
// this.goInfo(that.taskList.length ? that.taskList[0] : null)
// }
})
},
goInfo(item) {
this.clickTask = item
// this.$emit('goModuleTaskDetail', item)
this.$router.push({
path: '/dee-task-center/taskList?title=批量签审',
query: {
router: item.router,
taskCount: item.taskCount,
taskKey: item.taskKey,
taskType: item.taskType
}
})
}
}
}
</script>
<style lang="scss" >
.module-task-list {
height: 100%;
background-color: #ffffff;
padding: 10px;
box-sizing: border-box;
// border: 1px solid #D9D9D9;
position: relative;
.task-header{
height: 30px;
}
.refresh{
position: absolute;
right: 9px;
top: 20px;
z-index: 10;
span{
font-size:12px;
color: #999999;
cursor: pointer;
}
i{
cursor: pointer;
font-weight: 400;
color: #999999;
}
i:hover {
color: rgb(42, 117, 206);
}
}
.el-icon-refresh{
margin-left:16px;
color: #999999;
}
.task-content {
// padding-bottom: 10px;
font-size: 12px;
color: #212121;
overflow: hidden;
height: calc(100% - 30px);
width: 100%;
box-sizing: border-box;
.active-item{
background: #DEEDF4!important;
}
.task-item {
cursor: pointer;
height: 90px;
box-sizing: border-box;
background: #FBFDFF;
border-radius: 2px;
border: 1px solid rgba(200, 212, 220, 0.88);
border-left: 3px solid #76B0D7;
margin-bottom: 12px;
padding: 20px 22px 0 18px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
&:hover {
background-color: rgba(245,247,250,1);
}
.task-item-num {
text-align: right;
margin-top: 6px;
font-weight: 900;
font-size: 14px;
color:rgb(42, 117, 206);
}
.title {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
margin-right: 10px;
}
.due-text{
color: red;
margin-left: 10px;
}
.ti-label {
display: flex;
justify-content: space-between;
margin-bottom: 10px;
img {
height: 18px;
width: 16px;
margin-right: 8px;
}
.task-status{
font-size: 14px;
}
.task-name{
font-weight: 900;
font-size: 14px;
}
}
.task-item-info {
width: 100%;
overflow: hidden;
.task-left {
width: calc(100% - 156px);
display: inline-flex;
justify-content: flex-start;
align-items: baseline;
color: #626262;
font-size:12px;
}
.theme {
box-flex: 1;
display: inline-block;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
max-width: calc(100% - 100px);
}
.state {
color: #363636;
padding: 0px 6px;
}
.state.cancel {
color: #fe2929;
}
}
}
}
.mt20{
display: inline-block;
margin-top: 20px;
}
.more-bar {
margin: 10px auto;
text-align: center;
font-size: 12px;
color: #999;
}
.more {
margin: auto;
margin-top: 20px;
color: #2f90e2;
height: 26px;
line-height: 26px;
padding: 0 20px;
background: rgba(231, 242, 255, 1);
border-radius: 13px;
display: inline-block;
cursor: pointer;
}
}
</style>
applications/dee-task-center/src/views/workflow/task-center/myPlanTask/taskList.vue
View file @ cd0efbeb
...@@ -50,6 +50,7 @@ export default { ...@@ -50,6 +50,7 @@ export default {
immediate: true, immediate: true,
deep: true, deep: true,
handler() { handler() {
console.log(this.selectData)
this.componentKey += 1 this.componentKey += 1
} }
} }
......
applications/dee-task-center/src/views/workflow/task-center/myPlanTask/taskListDetail.vue 0 → 100644
View file @ cd0efbeb
<template>
<div class="MyPlanTaskPage">
<div class="TaskComponentView" :class="{'height_class':heightClass}">
<compnent :is="$route.query.router" :key="componentKey" :select-data="$route.query" :sub-type="subType" :def-state="state" />
</div>
</div>
</template>
<script>
export default {
components: {
WarehouseApply: () => import('./warehouseApply'), // 验收入库申请
WarehouseExamine: () => import('./warehouseExamine'), // 验收入库审核
JobResponseInExperiment: () => import('./jobResponseInExperiment'), // 理化试验入库响应
WarehouseInTest: () => import('./warehouseInTest'), // 检验入库响应
OutStorageExpireApply: () => import('./outStorageExpireApply'), // 三期出库申请
OutStorageRecallApply: () => import('./outStorageRecallApply'), // 返厂出库申请
WarehouseConfirm: () => import('./warehouseConfirm'), // 验收入库确认
OutStorageExpireConfirm: () => import('./outStorageExpireConfirm'), // 三期出库确认
OutStorageRecallConfirm: () => import('./outStorageRecallConfirm'), // 返厂出库确认
OutStorageOutApply: () => import('./outStorageOutApply'), // 供外出库申请
OutStorageOutExamine: () => import('./outStorageOutExamine'), // 供外出库审核
OutStorageOutApproval: () => import('./outStorageOutApproval'), // 供外出库批准
OutStorageOutConfirm: () => import('./outStorageOutConfirm'), // 供外出库确认
InStorageMatchBackApply: () => import('./inStorageMatchBackApply'), // 配套退库申请
InStorageMatchBackExamin: () => import('./inStorageMatchBackExamine'), // 配套退库审核
InStorageMatchBackConfirm: () => import('./inStorageMatchBackConfirm'), // 配套退库确认
InStorageUseOutBackApply: () => import('./inStorageUseOutBackApply'), // 领用/供外退库申请
InStorageUseOutBackExamine: () => import('./inStorageUseOutBackExamine'), // 领用/供外退库审核
InStorageUseOutBackConfirm: () => import('./inStorageUseOutBackConfirm') // 领用/供外退库确认
},
data() {
return {
tabPosition: '',
subType: '计划',
state: '',
loadComponents: true,
heightClass: false,
componentKey: 0
}
},
watch: {
'$route.query': {
immediate: true,
deep: true,
handler(v) {
this.componentKey += 1
}
}
},
created() {
},
mounted() {
},
methods: {
}
}
</script>
<style lang="scss">
.MyPlanTaskPage {
// padding: 10px 0;
box-sizing: border-box;
height: 100%;
overflow: hidden;
.height_class {
height: calc(100% - 56px) !important;
}
.el-radio-button .el-radio-button__inner {
padding-left: 10px;
padding-right: 10px;
}
.TaskComponentView {
height: calc(100% - 40px);
box-sizing: border-box;
overflow: hidden;
}
.TodoListTable{
height: 100%;
box-sizing: border-box;
overflow: hidden;
}
.el-pagination{
text-align: right;
}
.TodoListView .splitter-pane:first-child {
padding-bottom: 0 !important;
}
.TodoListView .splitter-pane.splitter-paneR {
padding-top: 10px !important;
}
.splitter-pane-resizer{
&.horizontal{
opacity: 1;
background-color: transparent;
border: 0;
text-align: center;
&::after{
content: "";
display: inline-block;
width: 35px;
height: 2px;
border: 1px solid #8f9192;
border-left: 0;
border-right: 0;
z-index: 5;
}
&:hover{
&::after{
border-color:#3b5485;
}
}
}
}
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment