|
@@ -1,124 +1,296 @@
|
|
|
<template>
|
|
|
- <div class="page-header-index-wide">
|
|
|
- <a-row :gutter="24">
|
|
|
- <a-col :sm="24" :md="24" :xl="24" :style="{ marginBottom: '24px' }">
|
|
|
- <a-card title="我的待办" :bordered="false">
|
|
|
- <a-row :gutter="24">
|
|
|
- <a-col :sm="24" :md="24" :xl="24" :style="{ marginBottom: '24px' }">
|
|
|
- <a-table
|
|
|
- :scroll="scroll"
|
|
|
- bordered
|
|
|
- :loading="loading"
|
|
|
- rowKey="id"
|
|
|
- :dataSource="data"
|
|
|
- :pagination="ipagination"
|
|
|
- @change="handleTableChange"
|
|
|
- ref="table"
|
|
|
- size="small"
|
|
|
- >
|
|
|
- <a-table-column title="#" :width="50">
|
|
|
- <template slot-scope="t,r,i">
|
|
|
- <span>{{i+1}}</span>
|
|
|
- </template>
|
|
|
- </a-table-column>
|
|
|
- <a-table-column title="任务名称" data-index="name" :width="150" align="center">
|
|
|
- <template slot-scope="t">
|
|
|
- <span>{{t}}</span>
|
|
|
- </template>
|
|
|
- </a-table-column>
|
|
|
- <a-table-column title="所属流程" data-index="processName" :width="150" align="center">
|
|
|
- <template slot-scope="t">
|
|
|
- <span>{{t}}</span>
|
|
|
- </template>
|
|
|
- </a-table-column>
|
|
|
- <a-table-column title="委托代办人" data-index="owner" align="center" :width="150">
|
|
|
- <template slot-scope="t">
|
|
|
- <span>{{t}}</span>
|
|
|
- </template>
|
|
|
- </a-table-column>
|
|
|
- <a-table-column title="流程发起人" data-index="applyer" :width="150" align="center">
|
|
|
- <template slot-scope="t">
|
|
|
- <span>{{t}}</span>
|
|
|
- </template>
|
|
|
- </a-table-column>
|
|
|
- <a-table-column
|
|
|
- title="优先级"
|
|
|
- data-index="priority"
|
|
|
- :width="110"
|
|
|
- align="center"
|
|
|
- key="so"
|
|
|
- :sorter="(a,b)=>a.priority - b.priority"
|
|
|
- >
|
|
|
- <template slot-scope="t">
|
|
|
- <span v-if="t==0" style="color: green;">普通</span>
|
|
|
- <span v-else-if="t==1" style="color: orange;">重要</span>
|
|
|
- <span v-else-if="t==2" style="color: red;">紧急</span>
|
|
|
- <span v-else style="color: #999;">无</span>
|
|
|
- </template>
|
|
|
- </a-table-column>
|
|
|
- <a-table-column
|
|
|
- title="状态"
|
|
|
- data-index="isSuspended"
|
|
|
- :width="100"
|
|
|
- align="center"
|
|
|
- key="z"
|
|
|
- :sorter="(a,b)=>Boolean(a.isSuspended)?0:1 - Boolean(b.isSuspended)?0:1"
|
|
|
- >
|
|
|
- <template slot-scope="t">
|
|
|
- <span v-if="!Boolean(t)" style="color: green;">已激活</span>
|
|
|
- <span v-if="Boolean(t)" style="color: orange;">已挂起</span>
|
|
|
- </template>
|
|
|
- </a-table-column>
|
|
|
- <a-table-column title="创建时间" data-index="createTime" :width="200" align="center">
|
|
|
- <template slot-scope="t">
|
|
|
- <span>{{t}}</span>
|
|
|
- </template>
|
|
|
- </a-table-column>
|
|
|
- <a-table-column title="操作" data-index align="center" :width="100">
|
|
|
- <!-- <template slot-scope="t,r,i">
|
|
|
- <a href="javascript:void(0);" @click="detail(r)" style="color: blue">申请详情</a>
|
|
|
+ <div id="home">
|
|
|
+ <!-- 第一行 -->
|
|
|
+ <a-row type="flex" class="topRow">
|
|
|
+ <!-- 用户信息 -->
|
|
|
+ <a-col :span="4" :order="1" class="user colItem">
|
|
|
+ <a-tabs default-active-key="1">
|
|
|
+ <a-tab-pane key="1" tab="我的">
|
|
|
+ <div class="userImg" style="float:left">
|
|
|
+ <img src="../../assets/user.jpg" alt="" width="100px" />
|
|
|
+ </div>
|
|
|
+ <div class="userInfo" style="float:left">
|
|
|
+ <span class="department">{{ userInfo.realname }}</span>
|
|
|
+ <span>账号:{{ userInfo.username }}</span>
|
|
|
+ <span class="telphone">Tel:{{ userInfo.telphone }}</span>
|
|
|
+ </div>
|
|
|
+ </a-tab-pane>
|
|
|
+ </a-tabs>
|
|
|
+ </a-col>
|
|
|
+
|
|
|
+ <!-- 消息 -->
|
|
|
+ <a-col :span="4" :order="2" class="messages colItem">
|
|
|
+ <a-tabs default-active-key="1">
|
|
|
+ <a-tab-pane key="1" tab="消息" class="msgBox">
|
|
|
+ <div class="wait fl">
|
|
|
+ <span> {{ todoList.length }}</span>
|
|
|
+ <p>我的待办</p>
|
|
|
+ </div>
|
|
|
+ <div class="sysMsg fr">
|
|
|
+ <span>{{ msgTotal }}</span>
|
|
|
+ <p>系统消息</p>
|
|
|
+ </div>
|
|
|
+ </a-tab-pane>
|
|
|
+ </a-tabs>
|
|
|
+ </a-col>
|
|
|
+
|
|
|
+ <!-- OA工作台按钮 -->
|
|
|
+ <a-col :span="8" :order="3" class="oaBtn colItem">
|
|
|
+ <a-tabs default-active-key="1">
|
|
|
+ <a-tab-pane key="1" tab="OA工作台">
|
|
|
+ <div class="oaButton">
|
|
|
+ <a class="oaItem" v-for="(item, index) in activeKeyAll" :key="index.id" @click.prevent="aClick(item)">
|
|
|
+ <span>
|
|
|
+ <img :src="item.iconAddress" />
|
|
|
+ </span>
|
|
|
+ <p>{{ item.name }}</p>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </a-tab-pane>
|
|
|
+ </a-tabs>
|
|
|
+ </a-col>
|
|
|
+
|
|
|
+ <!-- 日历 -->
|
|
|
+ <a-col :span="7" :order="4" class="date colItem">
|
|
|
+ <div>
|
|
|
+ <a-calendar :fullscreen="false" />
|
|
|
+ </div>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+
|
|
|
+ <!-- 新闻类 -->
|
|
|
+ <a-row type="flex" class="news">
|
|
|
+ <!-- 企业公告 -->
|
|
|
+ <a-col :span="9" :order="1" class="notice">
|
|
|
+ <a-tabs default-active-key="1">
|
|
|
+ <a-tab-pane key="1" tab="企业公告">
|
|
|
+ <div class="contain">
|
|
|
+ <ul>
|
|
|
+ <li class="fl">
|
|
|
+ <a href="https://m.thepaper.cn/baijiahao_14855630">
|
|
|
+ <span class="department fl">[人事]</span>
|
|
|
+ <span class="info fl">王健林称万达高管全部换乘红旗汽车</span>
|
|
|
+ <span class="time fr">2021-10-11</span>
|
|
|
+ <span class="person fr">王健林</span>
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+
|
|
|
+ <li class="fl">
|
|
|
+ <a href="https://baijiahao.baidu.com/s?id=1713375072968520817&wfr=spider&for=pc">
|
|
|
+ <span class="department fl">[运动]</span>
|
|
|
+ <span class="info fl">德国成为首支晋级卡塔尔世界杯球队</span>
|
|
|
+ <span class="time fr">2021-10-12</span>
|
|
|
+ <span class="person fr">卡塔尔</span>
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+
|
|
|
+ <li class="fl">
|
|
|
+ <a href="https://news.sina.cn/kx/2021-10-12/detail-iktzscyx9169344.d.html">
|
|
|
+ <span class="department fl">[财务]</span>
|
|
|
+ <span class="info fl">浙江女子围观宰鸭后确诊鹦鹉热</span>
|
|
|
+ <span class="time fr">2021-10-11</span>
|
|
|
+ <span class="person fr">鹦鹉</span>
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+
|
|
|
+ <li class="fl">
|
|
|
+ <a href="https://baijiahao.baidu.com/s?id=1713366904170468936&wfr=spider&for=pc">
|
|
|
+ <span class="department fl">[人事]</span>
|
|
|
+ <span class="info fl">李铁:有没有自己的球迷是巨大区别</span>
|
|
|
+ <span class="time fr">2021-10-11</span>
|
|
|
+ <span class="person fr">李铁</span>
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+
|
|
|
+ <li class="fl">
|
|
|
+ <a href="https://haokan.baidu.com/v?pd=wisenatural&vid=15789314381003157969">
|
|
|
+ <span class="department fl">[人事]</span>
|
|
|
+ <span class="info fl">今年为什么会出现南旱北涝</span>
|
|
|
+ <span class="time fr">2021-10-11</span>
|
|
|
+ <span class="person fr">某某</span>
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </a-tab-pane>
|
|
|
+ </a-tabs>
|
|
|
+ </a-col>
|
|
|
+
|
|
|
+ <!-- 我的计划 -->
|
|
|
+ <a-col :span="7" :order="2" class="plan">
|
|
|
+ <a-tabs default-active-key="1">
|
|
|
+ <a-tab-pane key="1" tab="我的计划">
|
|
|
+ <!-- 数据显示 -->
|
|
|
+ <div class="total">
|
|
|
+ <div class="left fl">
|
|
|
+ <span>上月我的计划:<strong>0</strong>份</span>
|
|
|
+ <span>我的计划:<strong>1</strong>份</span>
|
|
|
+ <span>已阅计划:<strong>1</strong>份</span>
|
|
|
+ </div>
|
|
|
+ <div class="right fr">
|
|
|
+ <span>上月他人计划:<strong>0</strong>份</span>
|
|
|
+ <span>他人计划:<strong>2</strong>份</span>
|
|
|
+ <span>已回计划:<strong>0</strong>份</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="tabsLinks">
|
|
|
+ <a href="">我的计划</a>
|
|
|
+ <a-divider type="vertical" />
|
|
|
+ <a href="">计划管理</a>
|
|
|
<a-divider type="vertical" />
|
|
|
- <span v-if="Boolean(r.isSuspended)" style="cursor: no-drop;color: #999999;" title="流程已被挂起,无法操作!">
|
|
|
- 通过 <a-divider type="vertical" />
|
|
|
- 驳回 <a-divider type="vertical" />
|
|
|
- 委托 <a-divider type="vertical" />
|
|
|
- </span>
|
|
|
- <span v-else>
|
|
|
- <a href="javascript:void(0);" @click="passTask(r)" style="color: green">通过</a>
|
|
|
- <a-divider type="vertical" />
|
|
|
- <a href="javascript:void(0);" @click="backTask(r)" style="color: orange">驳回</a>
|
|
|
- <a-divider type="vertical" />
|
|
|
- <a href="javascript:void(0);" @click="delegateTask(r)" style="color: #00A0E9">委托</a>
|
|
|
- <a-divider type="vertical" />
|
|
|
- </span>
|
|
|
- <a href="javascript:void(0);" @click="history(r)" style="color: #217dbb">历史</a>
|
|
|
- </template>-->
|
|
|
- <template slot-scope="t,r,i">
|
|
|
- <a href="javascript:void(0);" @click="toDealWith()" style="color: blue">去处理</a>
|
|
|
- </template>
|
|
|
- </a-table-column>
|
|
|
- </a-table>
|
|
|
- </a-col>
|
|
|
- </a-row>
|
|
|
- </a-card>
|
|
|
+ <a href="">计划模块</a>
|
|
|
+ </div>
|
|
|
+ </a-tab-pane>
|
|
|
+ </a-tabs>
|
|
|
+ </a-col>
|
|
|
+
|
|
|
+ <!-- 友情链接 -->
|
|
|
+ <a-col :span="7" :order="3" class="link">
|
|
|
+ <a-tabs default-active-key="1">
|
|
|
+ <a-tab-pane key="1" tab="友情链接">
|
|
|
+ <div class="linkBtn">
|
|
|
+ <button><a href="https://www.yonyou.com/">用友</a></button>
|
|
|
+ <button><a href="https://hc.yonyou.com/product.php?id=5">U8</a></button>
|
|
|
+ <button><a href="http://www.dakabg.com/">哒咔办公</a></button>
|
|
|
+ <button><a href="https://www.dingtalk.com/?lwfrom=2017120202091367000000111&source=1001">钉钉</a></button>
|
|
|
+ <button><a href="https://www.11467.com/qiye/38026153.htm">品医</a></button>
|
|
|
+ <button><a href="https://www.antgroup.com/">蚂蚁集团</a></button>
|
|
|
+ </div>
|
|
|
+ </a-tab-pane>
|
|
|
+ </a-tabs>
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
+
|
|
|
+ <!-- 我的待办表 -->
|
|
|
+ <a-row :gutter="24" class="todoTable">
|
|
|
+ <a-col :sm="24" :md="24" :xl="24" :style="{ marginBottom: '24px' }" class="tableInfo">
|
|
|
+ <a-tabs default-active-key="1">
|
|
|
+ <a-tab-pane key="1" tab="我的待办">
|
|
|
+ <a-table
|
|
|
+ :scroll="scroll"
|
|
|
+ bordered
|
|
|
+ :loading="loading"
|
|
|
+ rowKey="id"
|
|
|
+ :dataSource="todoList"
|
|
|
+ :pagination="ipagination"
|
|
|
+ @change="handleTableChange"
|
|
|
+ ref="table"
|
|
|
+ size="small"
|
|
|
+ >
|
|
|
+ <a-table-column title="#" :width="50">
|
|
|
+ <template slot-scope="t, r, i">
|
|
|
+ <span>{{ i + 1 }}</span>
|
|
|
+ </template>
|
|
|
+ </a-table-column>
|
|
|
+ <a-table-column title="任务名称" data-index="name" :width="150" align="center">
|
|
|
+ <template slot-scope="t">
|
|
|
+ <span>{{ t }}</span>
|
|
|
+ </template>
|
|
|
+ </a-table-column>
|
|
|
+ <a-table-column title="所属流程" data-index="processName" :width="150" align="center">
|
|
|
+ <template slot-scope="t">
|
|
|
+ <span>{{ t }}</span>
|
|
|
+ </template>
|
|
|
+ </a-table-column>
|
|
|
+ <a-table-column title="委托代办人" data-index="owner" align="center" :width="150">
|
|
|
+ <template slot-scope="t">
|
|
|
+ <span>{{ t }}</span>
|
|
|
+ </template>
|
|
|
+ </a-table-column>
|
|
|
+ <a-table-column title="流程发起人" data-index="applyer" :width="150" align="center">
|
|
|
+ <template slot-scope="t">
|
|
|
+ <span>{{ t }}</span>
|
|
|
+ </template>
|
|
|
+ </a-table-column>
|
|
|
+ <a-table-column
|
|
|
+ title="优先级"
|
|
|
+ data-index="priority"
|
|
|
+ :width="110"
|
|
|
+ align="center"
|
|
|
+ key="so"
|
|
|
+ :sorter="(a, b) => a.priority - b.priority"
|
|
|
+ >
|
|
|
+ <template slot-scope="t">
|
|
|
+ <span v-if="t == 0" style="color: green;">普通</span>
|
|
|
+ <span v-else-if="t == 1" style="color: orange;">重要</span>
|
|
|
+ <span v-else-if="t == 2" style="color: red;">紧急</span>
|
|
|
+ <span v-else style="color: #999;">无</span>
|
|
|
+ </template>
|
|
|
+ </a-table-column>
|
|
|
+ <a-table-column
|
|
|
+ title="状态"
|
|
|
+ data-index="isSuspended"
|
|
|
+ :width="100"
|
|
|
+ align="center"
|
|
|
+ key="z"
|
|
|
+ :sorter="(a, b) => (Boolean(a.isSuspended) ? 0 : 1 - Boolean(b.isSuspended) ? 0 : 1)"
|
|
|
+ >
|
|
|
+ <template slot-scope="t">
|
|
|
+ <span v-if="!Boolean(t)" style="color: green;">已激活</span>
|
|
|
+ <span v-if="Boolean(t)" style="color: orange;">已挂起</span>
|
|
|
+ </template>
|
|
|
+ </a-table-column>
|
|
|
+ <a-table-column title="创建时间" data-index="createTime" :width="200" align="center">
|
|
|
+ <template slot-scope="t">
|
|
|
+ <span>{{ t }}</span>
|
|
|
+ </template>
|
|
|
+ </a-table-column>
|
|
|
+ <a-table-column title="操作" data-index align="center" :width="100">
|
|
|
+ <template slot-scope="t, r, i">
|
|
|
+ <a href="javascript:void(0);" @click="toDealWith()" style="color: blue">去处理</a>
|
|
|
+ </template>
|
|
|
+ </a-table-column>
|
|
|
+ </a-table>
|
|
|
+ </a-tab-pane>
|
|
|
+ </a-tabs>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <!-- 按钮弹框 -->
|
|
|
+ <a-modal v-model="lcModal.visible" :title="lcModal.Title" :footer="null" :maskClosable="false">
|
|
|
+ <component
|
|
|
+ :disabled="lcModal.disabled"
|
|
|
+ v-if="lcModal.visible"
|
|
|
+ :is="lcModal.formComponent"
|
|
|
+ :processData="lcModal.processData"
|
|
|
+ :isNew="lcModal.isNew"
|
|
|
+ @afterSubmit="afterSub"
|
|
|
+ @close=";(lcModal.visible = false), (lcModal.disabled = false)"
|
|
|
+ >
|
|
|
+ </component>
|
|
|
+ </a-modal>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
|
|
-import { activitiMixin } from '@/views/activiti/mixins/activitiMixin'
|
|
|
-import JSelectUserByDep from '@/components/jeecgbiz/JSelectUserByDep'
|
|
|
+import { mapGetters } from 'vuex'
|
|
|
+import { getAction } from '@/api/manage'
|
|
|
export default {
|
|
|
- name: 'MyToDo',
|
|
|
+ name: 'Home',
|
|
|
data() {
|
|
|
return {
|
|
|
+ userInfo: this.$store.getters.userInfo,
|
|
|
+ todoList: [],
|
|
|
+ activeKeyAll: [],
|
|
|
+ msg1Count: '0',
|
|
|
+ msg2Count: '0',
|
|
|
+ url: {
|
|
|
+ listCementByUser: '/sys/annountCement/listByUser'
|
|
|
+ },
|
|
|
+ //按钮弹框
|
|
|
+ lcModal: {
|
|
|
+ title: '',
|
|
|
+ visible: false,
|
|
|
+ disabled: false,
|
|
|
+ formComponent: null,
|
|
|
+ isNew: false
|
|
|
+ },
|
|
|
+ //
|
|
|
data: [], // 表单数据
|
|
|
total: 0, // 表单数据总数
|
|
|
ipagination: {
|
|
|
current: 1,
|
|
|
- pageSize: 5,
|
|
|
+ pageSize: 3,
|
|
|
pageSizeOptions: ['10', '20', '30'],
|
|
|
showTotal: (total, range) => {
|
|
|
return range[0] + '-' + range[1] + ' 共' + total + '条'
|
|
@@ -131,11 +303,16 @@ export default {
|
|
|
},
|
|
|
created() {
|
|
|
this.getDataList()
|
|
|
+ this.getActiveKeyAll()
|
|
|
},
|
|
|
computed: {
|
|
|
+ // 系统消息计算
|
|
|
+ msgTotal() {
|
|
|
+ return parseInt(this.msg1Count) + parseInt(this.msg2Count)
|
|
|
+ },
|
|
|
scroll: function() {
|
|
|
var width = window.innerWidth
|
|
|
- //ant-table
|
|
|
+ // ant-table
|
|
|
let $antTable = window.document.getElementsByClassName('ant-table')
|
|
|
if ($antTable[0]) {
|
|
|
width = $antTable[0].clientWidth
|
|
@@ -152,30 +329,412 @@ export default {
|
|
|
return innerHeight
|
|
|
}
|
|
|
},
|
|
|
+ mounted() {
|
|
|
+ this.loadData()
|
|
|
+ },
|
|
|
methods: {
|
|
|
+ loadData() {
|
|
|
+ try {
|
|
|
+ // 获取系统消息
|
|
|
+ getAction(this.url.listCementByUser)
|
|
|
+ .then(res => {
|
|
|
+ if (res.success) {
|
|
|
+ this.msg1Count = res.result.anntMsgTotal
|
|
|
+ this.msg2Count = res.result.sysMsgTotal
|
|
|
+ console.log(this.msg2Count)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(error => {
|
|
|
+ console.log('系统消息通知异常', error) // 这行打印permissionName is undefined
|
|
|
+ this.stopTimer = true
|
|
|
+ console.log('清理timer')
|
|
|
+ })
|
|
|
+ } catch (err) {
|
|
|
+ this.stopTimer = true
|
|
|
+ console.log('通知异常', err)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ ...mapGetters(['nickname', 'avatar', 'userInfo']),
|
|
|
+
|
|
|
+ // 代办数据
|
|
|
getDataList() {
|
|
|
this.loading = true
|
|
|
this.postFormAction('/actTask/todoList', {}).then(res => {
|
|
|
this.loading = false
|
|
|
if (res.success) {
|
|
|
- this.data = res.result || []
|
|
|
+ this.todoList = res.result || []
|
|
|
+ console.log('首页 我的待办数字:', this.todoList.length)
|
|
|
this.total = this.data.leading
|
|
|
+ console.log(this.data)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 获取 OA 按钮
|
|
|
+ getActiveKeyAll() {
|
|
|
+ this.postFormAction('/activiti_process/listData', { status: 1, roles: true }).then(res => {
|
|
|
+ this.activeKeyAll = []
|
|
|
+ if (res.success) {
|
|
|
+ var result = res.result || []
|
|
|
+ if (result.length > 0) {
|
|
|
+ this.activeKeyAll = result
|
|
|
+ // this.activeKeyAll.push.apply(this.activeKeyAll,result);
|
|
|
+ // console.log(this.activeKeyAll)
|
|
|
+ console.log('OA 4个按钮被渲染')
|
|
|
+ }
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
+
|
|
|
+ //OA图标点击事件
|
|
|
+ aClick(v) {
|
|
|
+ //点击的该项按钮
|
|
|
+ console.log(v)
|
|
|
+ // this.$refs.modal.add("1")
|
|
|
+ if (!v.routeName) {
|
|
|
+ this.$message.warning('该流程信息未配置表单,请联系开发人员!')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (v.routeName.indexOf('外部表单') != -1) {
|
|
|
+ alert('调用其他项目页面')
|
|
|
+ } else if (v.routeName.indexOf('自定义') != -1) {
|
|
|
+ this.lcModal.disabled = false
|
|
|
+ let com = { component: () => import(`@/views/activiti/form/demoForm2`) }
|
|
|
+ this.lcModal.formComponent = com.component
|
|
|
+ this.lcModal.title = '发起流程:' + v.name
|
|
|
+ this.lcModal.isNew = true
|
|
|
+ this.lcModal.processData = v
|
|
|
+ this.lcModal.visible = true
|
|
|
+ } else {
|
|
|
+ this.lcModal.disabled = false
|
|
|
+ this.lcModal.formComponent = this.getFormComponent(v.routeName).component
|
|
|
+ this.lcModal.title = '发起流程:' + v.name
|
|
|
+ this.lcModal.isNew = true
|
|
|
+ this.lcModal.processData = v
|
|
|
+ this.lcModal.visible = true
|
|
|
+ }
|
|
|
+ console.log('发起', v)
|
|
|
+ // this.getDataList()
|
|
|
+ },
|
|
|
+ //提交后
|
|
|
+ afterSub(formData) {
|
|
|
+ this.lcModal.visible = false
|
|
|
+ },
|
|
|
+
|
|
|
+ // 分页、排序、筛选变化时触发
|
|
|
handleTableChange(pagination, filters, sorter) {
|
|
|
- //分页、排序、筛选变化时触发
|
|
|
if (Object.keys(sorter).length > 0) {
|
|
|
this.isorter.column = sorter.field
|
|
|
- this.isorter.order = 'ascend' == sorter.order ? 'asc' : 'desc'
|
|
|
+ this.isorter.order = sorter.order == 'ascend' ? 'asc' : 'desc'
|
|
|
}
|
|
|
this.ipagination = pagination
|
|
|
// this.loadData();
|
|
|
},
|
|
|
- //去处理按钮
|
|
|
+
|
|
|
+ // 去处理按钮
|
|
|
toDealWith() {
|
|
|
this.$router.push({ path: '/activiti/todoManage' })
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-</script>
|
|
|
+</script>
|
|
|
+<style lang="less" scoped>
|
|
|
+ul {
|
|
|
+ list-style: none;
|
|
|
+}
|
|
|
+a {
|
|
|
+ text-decoration: none;
|
|
|
+}
|
|
|
+.fl {
|
|
|
+ float: left;
|
|
|
+}
|
|
|
+.fr {
|
|
|
+ float: right;
|
|
|
+}
|
|
|
+/deep/ .ant-row-flex {
|
|
|
+ background-color: white;
|
|
|
+}
|
|
|
+
|
|
|
+// 年月选择消失
|
|
|
+/deep/ .ant-fullcalendar-header {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+// 线消息
|
|
|
+/deep/ .ant-fullcalendar {
|
|
|
+ border-top: none;
|
|
|
+}
|
|
|
+/deep/ .ant-fullcalendar-calendar-body {
|
|
|
+ border-radius: 8px;
|
|
|
+ // background-color: orange;
|
|
|
+ background: url('../../assets/date01.jpg');
|
|
|
+ background-size: cover;
|
|
|
+ background-position: center;
|
|
|
+ opacity: 0.8;
|
|
|
+ -webkit-font-smoothing: antialiased;
|
|
|
+}
|
|
|
+/deep/ .ant-fullcalendar-calendar-body {
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+/deep/ .ant-fullcalendar {
|
|
|
+ font-weight: 700;
|
|
|
+}
|
|
|
+/deep/ .ant-fullcalendar-column-header {
|
|
|
+ padding-top: 10px;
|
|
|
+}
|
|
|
+/deep/ .ant-fullcalendar table {
|
|
|
+ height: 237px;
|
|
|
+}
|
|
|
+/deep/ .ant-card-head {
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+/deep/ .ant-card-head-title {
|
|
|
+ // background-color: red;
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+/deep/ .ant-card-body {
|
|
|
+ // background-color: blue;
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+/deep/ .ant-tabs-nav .ant-tabs-tab-active {
|
|
|
+ color: #fa6b5c;
|
|
|
+ font-size: 16px;
|
|
|
+}
|
|
|
+/deep/ .ant-tabs-ink-bar {
|
|
|
+ height: 4px;
|
|
|
+ background: #fa6b5c;
|
|
|
+ padding: 0 4px;
|
|
|
+}
|
|
|
+/deep/ .ant-tabs-bar {
|
|
|
+ margin-bottom: 30px;
|
|
|
+}
|
|
|
+#home {
|
|
|
+ .topRow {
|
|
|
+ background-color: #f0f2f5;
|
|
|
+ height: 280px;
|
|
|
+ margin-bottom: 30px;
|
|
|
+ .colItem {
|
|
|
+ height: 280px;
|
|
|
+ }
|
|
|
+ .user {
|
|
|
+ padding: 20px;
|
|
|
+ margin-right: 24px;
|
|
|
+ background-color: white;
|
|
|
+ .userImg {
|
|
|
+ margin: 0 20px 0 20px;
|
|
|
+ img {
|
|
|
+ border-radius: 6px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 用户信息
|
|
|
+ .userInfo {
|
|
|
+ font-size: 14px;
|
|
|
+ background-color: white;
|
|
|
+ // 用户
|
|
|
+ span {
|
|
|
+ display: block;
|
|
|
+ line-height: 40px;
|
|
|
+ }
|
|
|
+ .department {
|
|
|
+ font-size: 14px;
|
|
|
+ color: rgb(71, 70, 70);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 消息
|
|
|
+ .messages {
|
|
|
+ padding: 20px;
|
|
|
+ background-color: white;
|
|
|
+ margin-right: 20px;
|
|
|
+ .msgBox {
|
|
|
+ padding: 0 20px;
|
|
|
+ span {
|
|
|
+ font-size: 38px;
|
|
|
+ color: #fa6b5c;
|
|
|
+ text-shadow: 2px 2px 1px rgb(94, 94, 94);
|
|
|
+ }
|
|
|
+ p {
|
|
|
+ margin-top: 10px;
|
|
|
+ font-size: 16px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 工作台按钮
|
|
|
+ .oaBtn {
|
|
|
+ background-color: white;
|
|
|
+ padding: 20px;
|
|
|
+ margin-right: 20px;
|
|
|
+ .oaButton {
|
|
|
+ display: flex;
|
|
|
+ flex-flow: row wrap;
|
|
|
+ text-align: center;
|
|
|
+ .oaItem {
|
|
|
+ line-height: 0px;
|
|
|
+ width: 25%;
|
|
|
+ margin-bottom: 4px;
|
|
|
+ // 图
|
|
|
+ span {
|
|
|
+ border: transparent;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ img {
|
|
|
+ width: 34px;
|
|
|
+ height: 34px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // 文字
|
|
|
+ p {
|
|
|
+ margin-top: 14px;
|
|
|
+ font-size: 14px;
|
|
|
+ color: rgb(128, 127, 127);
|
|
|
+ font-weight: 400;
|
|
|
+ letter-spacing: 1px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .date {
|
|
|
+ padding: 20px;
|
|
|
+ background-color: white;
|
|
|
+ }
|
|
|
+ // 右分割线
|
|
|
+ /deep/ .ant-divider {
|
|
|
+ height: 240px;
|
|
|
+ width: 2px;
|
|
|
+ background-color: #eaeaea;
|
|
|
+ float: right;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .news {
|
|
|
+ background-color: #f0f2f5;
|
|
|
+ margin-bottom: 30px;
|
|
|
+ .notice {
|
|
|
+ background-color: white;
|
|
|
+ padding: 20px;
|
|
|
+ margin-right: 32px;
|
|
|
+ .contain {
|
|
|
+ ul {
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+ padding-left: 20px;
|
|
|
+ width: 100%;
|
|
|
+ li {
|
|
|
+ width: 100%;
|
|
|
+ display: inline-block;
|
|
|
+ // background-color: #fa6b5c;
|
|
|
+ line-height: 40px;
|
|
|
+ a {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #444;
|
|
|
+ .department {
|
|
|
+ margin-right: 12px;
|
|
|
+ }
|
|
|
+ .info {
|
|
|
+ // margin-right:12px;
|
|
|
+ }
|
|
|
+ .person {
|
|
|
+ color: #333;
|
|
|
+ }
|
|
|
+ .time {
|
|
|
+ color: rgb(164, 164, 164);
|
|
|
+ margin: 0 12px 0 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ a:hover {
|
|
|
+ color: #1890ff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 我的计划
|
|
|
+ .plan {
|
|
|
+ padding: 20px;
|
|
|
+ background-color: white;
|
|
|
+ margin-right: 32px;
|
|
|
+ .total {
|
|
|
+ height: 160px;
|
|
|
+ // background-color: #e7c1bd;
|
|
|
+ border-bottom: 1px dashed #ccc;
|
|
|
+ span {
|
|
|
+ display: block;
|
|
|
+ line-height: 40px;
|
|
|
+ strong {
|
|
|
+ text-decoration: underline;
|
|
|
+ margin-right: 6px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .left {
|
|
|
+ margin: 0 0 0 30px;
|
|
|
+ }
|
|
|
+ .right {
|
|
|
+ margin: 0 30px 0 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .tabsLinks {
|
|
|
+ height: 50px;
|
|
|
+ margin: 30px 0 0 20px;
|
|
|
+ // background-color: rgb(138, 191, 226);
|
|
|
+ a {
|
|
|
+ color: rgb(23, 119, 184);
|
|
|
+ margin: 0 6px;
|
|
|
+ }
|
|
|
+ a:hover {
|
|
|
+ color: #fa6b5c;
|
|
|
+ }
|
|
|
+ /deep/ .ant-divider,
|
|
|
+ .ant-divider-vertical {
|
|
|
+ width: 2px;
|
|
|
+ background-color: rgb(200, 200, 200);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 友情链接
|
|
|
+ .link {
|
|
|
+ padding: 20px;
|
|
|
+ background-color: white;
|
|
|
+ .linkBtn {
|
|
|
+ padding: 10px 30px;
|
|
|
+ display: flex;
|
|
|
+ flex-flow: row wrap;
|
|
|
+ text-align: center;
|
|
|
+ button {
|
|
|
+ width: calc((100% - 2px) / 4);
|
|
|
+ border-radius: 4px;
|
|
|
+ border: none;
|
|
|
+ display: flex;
|
|
|
+ margin: 10px 8px;
|
|
|
+ justify-content: space-around;
|
|
|
+ align-items: center;
|
|
|
+ background-color: rgba(102, 155, 188, 0.8);
|
|
|
+ letter-spacing: 1px;
|
|
|
+ padding: 6px 10px;
|
|
|
+ a {
|
|
|
+ color: white;
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ button:hover {
|
|
|
+ background-color: #003049;
|
|
|
+ color: white;
|
|
|
+ box-shadow: 1px 1px 3px #333;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .todoTable {
|
|
|
+ background-color: #f0f2f5;
|
|
|
+ padding: 20px;
|
|
|
+ .tableInfo {
|
|
|
+ background-color: white;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|