This commit is contained in:
Jane
2024-07-25 13:48:29 +08:00
parent 367d095b31
commit 1eb5dd1085
10 changed files with 1146 additions and 824 deletions

View File

@@ -5,13 +5,16 @@
<el-form label-width="80px">
<div class="search">
<div class="sl">
<el-form-item label="流程标题">
<el-input placeholder="输入流程标题"></el-input>
</el-form-item>
<el-form-item label="流程状态">
<el-select placeholder="请选择">
<el-option label="进行中" value=""></el-option>
<el-option label="已办结" value=""></el-option>
</el-select>
</el-form-item>
<el-form-item label="创建时间">
<el-form-item label="发起时间">
<el-date-picker type="daterange" range-separator="" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
</el-form-item>
</div>
@@ -26,15 +29,14 @@
<el-card>
<el-table :data="tableData1" style="width: 100%" height="529">
<el-table-column prop="prop1" label="申请类型"></el-table-column>
<el-table-column prop="prop2" label="流程状态">
<el-table-column prop="prop2" label="流程标题">使用申请工具名称11</el-table-column>
<el-table-column prop="prop2" label="流程状态" width="150">
<template slot-scope="scope">
<span :class="getClassName(scope.row.prop2)">{{ scope.row.prop2 }}</span>
<span :class="getClassName(scope.row.prop2)"><a @click="drawer2 = true">{{ scope.row.prop2 }}</a></span>
</template>
</el-table-column>
<el-table-column prop="prop3" label="当前环节" width="180"> </el-table-column>
<el-table-column prop="prop4" label="当前环节处理人" width="150"></el-table-column>
<el-table-column prop="prop5" label="创建时间" width="150"></el-table-column>
<el-table-column prop="prop6" label="结束时间" width="150"></el-table-column>
<el-table-column prop="prop5" label="发起时间"></el-table-column>
<el-table-column prop="prop6" label="结束时间"></el-table-column>
<el-table-column label="操作" width="100" >
<el-button type="text" icon="el-icon-info" @click="drawer1 = true">详情</el-button>
</el-table-column>
@@ -44,11 +46,9 @@
<el-drawer :visible.sync="drawer1" :direction="direction" :before-close="handleClose" size="75%">
<template #title>
<span class="title">申请使用</span>
<span>申请使用</span>
<div class="drawer-head-btn">
<el-button @click="drawer2 = true">流程监控</el-button>
<el-button type="primary">提交</el-button>
<el-button>取消</el-button>
</div><!--drawer-head-btn 抽屉顶部按钮区域-->
</template>
<el-tabs v-model="activeName1" @tab-click="handleClick">
@@ -82,40 +82,15 @@
<el-table-column prop="prop5" label="工具类别" ></el-table-column>
</el-table><!--el-table-->
<div class="divide double"></div><!--divide 分隔-->
<div class="tboper">
<div class="tit">审批信息</div>
</div><!--tboper 标题与操作按钮-->
<div class="el-form-border">
<el-form ref="form" label-width="150px">
<el-row>
<el-col :span="24">
<el-form-item label="审批结论">
<el-radio-group v-model="radio1">
<el-radio label="1">通过</el-radio>
<el-radio label="2" >不通过</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="审批理由">
<el-input type="textarea" rows="4" maxlength="1000" placeholder="请输入" show-word-limit></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form><!--el-form-->
</div><!--el-form-border 表单-->
</el-tab-pane><!--el-tab-pane-->
<el-tab-pane label="审批记录" name="second">
<el-table :data="tableData3" style="width: 100%">
<el-table-column prop="prop1" label="环节"></el-table-column>
<el-table-column prop="prop2" label="意见">
<template slot-scope="scope">
<span :class="getClassName(scope.row.prop2)">{{ scope.row.prop2 }}</span>
</template>
</el-table-column>
<el-table-column prop="prop3" label="操作人" width="200"> </el-table-column>
<el-table-column prop="prop4" label="操作人部门" width="200" ></el-table-column>
<el-table-column prop="prop5" label="操作时间" ></el-table-column>
<el-table-column prop="prop4" label="处理人"></el-table-column>
<el-table-column prop="prop3" label="处理环节"> </el-table-column>
<el-table-column prop="prop2" label="接收人"></el-table-column>
<el-table-column prop="prop1" label="接收环节"></el-table-column>
<el-table-column prop="prop7" label="处理时间" ></el-table-column>
<el-table-column prop="prop5" label="审批意见" ></el-table-column>
</el-table><!--el-table-->
</el-tab-pane><!--el-tab-pane-->
</el-tabs><!--el-tabs-->
@@ -123,27 +98,10 @@
<el-drawer :visible.sync="drawer2" :direction="direction" :before-close="handleClose" size="75%">
<template #title>
<span class="title">流程监控</span>
<span>流程监控</span>
</template>
<div class="lctitle">流程标题申请使用工具名称1 流程定义名称申请使用流程</div><!--lctitle-->
<el-tabs v-model="activeName2" @tab-click="handleClick">
<el-tab-pane label="文本监控" name="first">
<el-table :data="tableData4" style="width: 100%">
<el-table-column prop="prop1" label="接受环节"></el-table-column>
<el-table-column prop="prop2" label="接收人"></el-table-column>
<el-table-column prop="prop3" label="发送环节"> </el-table-column>
<el-table-column prop="prop4" label="发送人"></el-table-column>
<el-table-column prop="prop5" label="审批意见" ></el-table-column>
<el-table-column prop="prop6" label="开始时间" ></el-table-column>
<el-table-column prop="prop7" label="结束时间" ></el-table-column>
<el-table-column prop="prop8" label="持续时间" ></el-table-column>
<el-table-column prop="prop9" label="任务状态" ></el-table-column>
</el-table><!--el-table-->
</el-tab-pane><!--el-tab-pane-->
<el-tab-pane label="图形监控" name="second">
<img style="width:auto; max-width: 100%;" src="images/lcjk1.jpg" />
</el-tab-pane><!--el-tab-pane-->
</el-tabs><!--el-tabs-->
<img style="width:auto; max-width: 100%;" src="../../../../public/images/lcjk1.jpg" />
</el-drawer><!--el-drawer 流程监控-抽屉-->
</div><!--app-container-->
@@ -265,26 +223,27 @@
}
],
tableData3: [
{
prop1: '总监批准',
prop2: '不通过',
prop3: '赵宇 ',
prop4: '总裁办',
prop5: '2024/02/09 12:00',
},
{
prop1: '部门领导审核',
prop2: '通过',
prop3: '钱多多',
prop4: '设备部',
prop5: '2024/02/09 12:00',
prop2: '张宇',
prop3: '管理员审核 ',
prop4: '赵定',
prop5: '同意',
prop6: '2024/02/09 12:00',
prop7: '2024/02/09 12:03',
prop8: '耗时0天',
prop9: '已完成',
},
{
prop1: '管理员审核',
prop2: '通过',
prop3: '孙瑶',
prop4: '人力资源部',
prop5: '2024/02/09 12:00',
prop2: '赵定',
prop3: '直接领导审核 ',
prop4: '钱多多',
prop5: '同意',
prop6: '2024/02/09 12:00',
prop7: '2024/02/09 12:03',
prop8: '耗时0天',
prop9: '已完成',
}
],
tableData4: [

View File

@@ -2,10 +2,10 @@
<div class="app-container"><!--从这一层开始嵌入页面-->
<el-card>
<el-form label-width="50px">
<el-form label-width="80px">
<div class="search">
<el-form-item label="关键字">
<el-input placeholder="输入流程标题搜索"></el-input>
<el-form-item label="流程标题">
<el-input placeholder="输入流程标题"></el-input>
</el-form-item>
<el-button type="primary" icon="el-icon-search">搜索</el-button>
<el-button icon="el-icon-refresh-left">重置</el-button>
@@ -18,12 +18,15 @@
<el-tab-pane label="待办(4)" name="first">
<el-table :data="tableData5" style="width: 100%" height="529">
<el-table-column prop="prop1" label="流程类型"></el-table-column>
<el-table-column prop="prop2" label="流程标题"><a @click="drawer1 = true">使用申请工具名称11</a></el-table-column>
<el-table-column prop="prop2" label="流程标题">使用申请工具名称11</el-table-column>
<el-table-column prop="prop3" label="当前环节"></el-table-column>
<el-table-column prop="prop4" label="上一环节"></el-table-column>
<el-table-column prop="prop5" label="上一环节处理人"></el-table-column>
<el-table-column prop="prop6" label="发起人"></el-table-column>
<el-table-column prop="prop7" label="接收时间"></el-table-column>
<el-table-column label="操作" width="100" >
<el-button type="text" icon="el-icon-info" @click="drawer1 = true">详情</el-button>
</el-table-column>
</el-table><!--el-table-->
<el-pagination :current-page="currentPage4" :page-sizes="[100, 200, 300, 400]" :page-size="100" layout="total, sizes, prev, pager, next, jumper" :total="400"></el-pagination>
</el-tab-pane><!--el-tab-pane-->
@@ -31,23 +34,37 @@
<el-table :data="tableData6" style="width: 100%" height="529">
<el-table-column prop="prop1" label="流程类型"></el-table-column>
<el-table-column prop="prop2" label="流程标题"><a>使用申请工具名称1</a></el-table-column>
<el-table-column prop="prop3" label="当前环节"></el-table-column>
<el-table-column prop="prop8" label="流程状态">
<template slot-scope="scope">
<span :class="getClassName(scope.row.prop8)">{{ scope.row.prop8 }}</span>
</template>
</el-table-column>
<el-table-column prop="prop3" label="处理环节"></el-table-column>
<el-table-column prop="prop4" label="上一环节"></el-table-column>
<el-table-column prop="prop5" label="上一环节处理人"></el-table-column>
<el-table-column prop="prop6" label="发起人"></el-table-column>
<el-table-column prop="prop7" label="接收时间"></el-table-column>
<el-table-column label="操作" width="100" >
<el-button type="text" icon="el-icon-info" @click="drawer1 = true">详情</el-button>
</el-table-column>
</el-table><!--el-table-->
<el-pagination :current-page="currentPage4" :page-sizes="[100, 200, 300, 400]" :page-size="100" layout="total, sizes, prev, pager, next, jumper" :total="400"></el-pagination>
</el-tab-pane><!--el-tab-pane-->
<el-tab-pane label="办结(10)" name="third">
<el-table :data="tableData7" style="width: 100%" height="529">
<el-table-column prop="prop1" label="流程类型"></el-table-column>
<el-table-column prop="prop2" label="流程标题"><a>使用申请工具名称1</a></el-table-column>
<el-table-column prop="prop3" label="当前环节"></el-table-column>
<el-table-column prop="prop4" label="上一环节"></el-table-column>
<el-table-column prop="prop5" label="上一环节处理人"></el-table-column>
<el-table-column prop="prop6" label="发起人"></el-table-column>
<el-table-column prop="prop7" label="接收时间"></el-table-column>
<el-table-column prop="prop2" label="流程标题">使用申请工具名称1</el-table-column>
<el-table-column label="流程状态">
<template slot-scope="scope">
<span :class="getClassName(scope.row.prop3)">{{ scope.row.prop3 }}</span>
</template>
</el-table-column>
<el-table-column prop="prop4" label="发起人"></el-table-column>
<el-table-column prop="prop5" label="发起时间"></el-table-column>
<el-table-column prop="prop6" label="接收时间"></el-table-column>
<el-table-column label="操作" width="100" >
<el-button type="text" icon="el-icon-info" @click="drawer1 = true">详情</el-button>
</el-table-column>
</el-table><!--el-table-->
<el-pagination :current-page="currentPage4" :page-sizes="[100, 200, 300, 400]" :page-size="100" layout="total, sizes, prev, pager, next, jumper" :total="400"></el-pagination>
</el-tab-pane><!--el-tab-pane-->
@@ -56,10 +73,10 @@
<el-drawer :visible.sync="drawer1" :direction="direction" :before-close="handleClose" size="75%">
<template #title>
<span class="title">申请使用</span>
<span>申请使用</span>
<div class="drawer-head-btn">
<el-button @click="drawer2 = true">流程监控</el-button>
<el-button type="primary">提交</el-button>
<el-button type="primary" v-if="activeName3 == 'first'">提交</el-button>
<el-button>取消</el-button>
</div><!--drawer-head-btn 抽屉顶部按钮区域-->
</template>
@@ -89,15 +106,15 @@
<el-table :data="tableData2" style="width: 100%">
<el-table-column prop="prop1" label="工具编号"></el-table-column>
<el-table-column prop="prop2" label="工具名称"></el-table-column>
<el-table-column prop="prop3" label="归属单位" width="200"> </el-table-column>
<el-table-column prop="prop4" label="负责人" width="100" ></el-table-column>
<el-table-column prop="prop5" label="工具类别" ></el-table-column>
<el-table-column prop="prop3" label="归属单位"> </el-table-column>
<el-table-column prop="prop4" label="负责人"></el-table-column>
</el-table><!--el-table-->
<div class="divide double"></div><!--divide 分隔-->
<div class="tboper">
<div class="tboper" v-if="activeName3 == 'first'">
<div class="tit">审批信息</div>
</div><!--tboper 标题与操作按钮-->
<div class="el-form-border">
<div class="el-form-border" v-if="activeName3 == 'first'">
<el-form ref="form" label-width="150px">
<el-row>
<el-col :span="24">
@@ -118,16 +135,13 @@
</div><!--el-form-border 表单-->
</el-tab-pane><!--el-tab-pane-->
<el-tab-pane label="审批记录" name="second">
<el-table :data="tableData3" style="width: 100%">
<el-table-column prop="prop1" label="环节"></el-table-column>
<el-table-column prop="prop2" label="意见">
<template slot-scope="scope">
<span :class="getClassName(scope.row.prop2)">{{ scope.row.prop2 }}</span>
</template>
</el-table-column>
<el-table-column prop="prop3" label="操作人" width="200"> </el-table-column>
<el-table-column prop="prop4" label="操作人部门" width="200" ></el-table-column>
<el-table-column prop="prop5" label="操作时间" ></el-table-column>
<el-table :data="tableData4" style="width: 100%">
<el-table-column prop="prop4" label="处理人"></el-table-column>
<el-table-column prop="prop3" label="处理环节"> </el-table-column>
<el-table-column prop="prop2" label="接收人"></el-table-column>
<el-table-column prop="prop1" label="接收环节"></el-table-column>
<el-table-column prop="prop7" label="处理时间" ></el-table-column>
<el-table-column prop="prop5" label="审批意见" ></el-table-column>
</el-table><!--el-table-->
</el-tab-pane><!--el-tab-pane-->
</el-tabs><!--el-tabs-->
@@ -135,27 +149,10 @@
<el-drawer :visible.sync="drawer2" :direction="direction" :before-close="handleClose" size="75%">
<template #title>
<span class="title">流程监控</span>
<span>流程监控</span>
</template>
<div class="lctitle">流程标题申请使用工具名称1 流程定义名称申请使用流程</div><!--lctitle-->
<el-tabs v-model="activeName2" @tab-click="handleClick">
<el-tab-pane label="文本监控" name="first">
<el-table :data="tableData4" style="width: 100%">
<el-table-column prop="prop1" label="接受环节"></el-table-column>
<el-table-column prop="prop2" label="接收人"></el-table-column>
<el-table-column prop="prop3" label="发送环节"> </el-table-column>
<el-table-column prop="prop4" label="发送人"></el-table-column>
<el-table-column prop="prop5" label="审批意见" ></el-table-column>
<el-table-column prop="prop6" label="开始时间" ></el-table-column>
<el-table-column prop="prop7" label="结束时间" ></el-table-column>
<el-table-column prop="prop8" label="持续时间" ></el-table-column>
<el-table-column prop="prop9" label="任务状态" ></el-table-column>
</el-table><!--el-table-->
</el-tab-pane><!--el-tab-pane-->
<el-tab-pane label="图形监控" name="second">
<img style="width:auto; max-width: 100%;" src="images/lcjk1.jpg" />
</el-tab-pane><!--el-tab-pane-->
</el-tabs><!--el-tabs-->
<img style="width:auto; max-width: 100%;" src="../../../../public/images/lcjk1.jpg" />
</el-drawer><!--el-drawer 流程监控-抽屉-->
</div><!--app-container-->
</template>
@@ -170,7 +167,7 @@
activeName1: 'first',
activeName2: 'second',
activeName3: 'first',
radio1: '',
radio1: '1',
tableData1: [
{
prop1: '使用申请',
@@ -360,6 +357,7 @@
tableData6: [
{
prop1: '使用申请',
prop8: '通过',
prop3: '部门经理审核',
prop4: '直接领导审核',
prop5: '张鑫辉',
@@ -368,6 +366,7 @@
},
{
prop1: '使用申请',
prop8: '通过',
prop3: '管理员审核',
prop4: '总监审核',
prop5: '柳青',
@@ -376,6 +375,7 @@
},
{
prop1: '使用申请',
prop8: '通过',
prop3: '总经理审核',
prop4: '直接领导审核',
prop5: '张庆幸',
@@ -384,6 +384,7 @@
},
{
prop1: '使用申请',
prop8: '通过',
prop3: '总监审核',
prop4: '部门经理审核',
prop5: '刘宁',
@@ -392,6 +393,7 @@
},
{
prop1: '使用申请',
prop8: '不通过',
prop3: '部门经理审核',
prop4: '直接领导审核',
prop5: '张鑫辉',
@@ -400,6 +402,7 @@
},
{
prop1: '使用申请',
prop8: '通过',
prop3: '管理员审核',
prop4: '总监审核',
prop5: '柳青',
@@ -408,6 +411,7 @@
},
{
prop1: '使用申请',
prop8: '不通过',
prop3: '总经理审核',
prop4: '直接领导审核',
prop5: '张庆幸',
@@ -416,6 +420,7 @@
},
{
prop1: '使用申请',
prop8: '通过',
prop3: '总监审核',
prop4: '部门经理审核',
prop5: '刘宁',
@@ -424,6 +429,7 @@
},
{
prop1: '使用申请',
prop8: '通过',
prop3: '部门经理审核',
prop4: '直接领导审核',
prop5: '张鑫辉',
@@ -432,6 +438,7 @@
},
{
prop1: '使用申请',
prop8: '通过',
prop3: '管理员审核',
prop4: '总监审核',
prop5: '柳青',
@@ -442,83 +449,73 @@
tableData7: [
{
prop1: '使用申请',
prop3: '部门经理审核',
prop4: '直接领导审核',
prop5: '张鑫辉',
prop6: '张慧玉',
prop7: '2022/10/10 12:00',
prop3: '通过',
prop4: '张鑫辉',
prop5: '2024/02/08 07:00',
prop6: '2024/02/10 12:00',
},
{
prop1: '使用申请',
prop3: '管理员审核',
prop4: '总监审核',
prop5: '柳青',
prop6: '刘青',
prop7: '2022/10/10 12:00',
prop3: '不通过',
prop4: '柳青',
prop5: '2024/02/08 07:00',
prop6: '2024/02/10 12:00',
},
{
prop1: '使用申请',
prop3: '总经理审核',
prop4: '直接领导审核',
prop5: '张庆幸',
prop6: '王慧',
prop7: '2022/10/10 12:00',
prop3: '通过',
prop4: '张庆幸',
prop5: '2024/02/08 07:00',
prop6: '2024/02/10 12:00',
},
{
prop1: '使用申请',
prop3: '总监审核',
prop4: '部门经理审核',
prop5: '刘宁',
prop6: '赵媛',
prop7: '2022/10/10 12:00',
prop3: '通过',
prop4: '刘宁',
prop5: '2024/02/08 07:00',
prop6: '2024/02/10 12:00',
},
{
prop1: '使用申请',
prop3: '部门经理审核',
prop4: '直接领导审核',
prop5: '张鑫辉',
prop6: '张慧玉',
prop7: '2022/10/10 12:00',
prop3: '不通过',
prop4: '张鑫辉',
prop5: '2024/02/08 07:00',
prop6: '2024/02/10 12:00',
},
{
prop1: '使用申请',
prop3: '管理员审核',
prop4: '总监审核',
prop5: '柳青',
prop6: '刘青',
prop7: '2022/10/10 12:00',
prop3: '通过',
prop4: '柳青',
prop5: '2024/02/08 07:00',
prop6: '2024/02/10 12:00',
},
{
prop1: '使用申请',
prop3: '总经理审核',
prop4: '直接领导审核',
prop5: '张庆幸',
prop6: '王慧',
prop7: '2022/10/10 12:00',
prop3: '通过',
prop4: '张庆幸',
prop5: '2024/02/08 07:00',
prop6: '2024/02/10 12:00',
},
{
prop1: '使用申请',
prop3: '总监审核',
prop4: '部门经理审核',
prop5: '刘宁',
prop6: '赵媛',
prop7: '2022/10/10 12:00',
prop3: '通过',
prop4: '刘宁',
prop5: '2024/02/08 07:00',
prop6: '2024/02/10 12:00',
},
{
prop1: '使用申请',
prop3: '部门经理审核',
prop4: '直接领导审核',
prop5: '张鑫辉',
prop6: '张慧玉',
prop7: '2022/10/10 12:00',
prop3: '通过',
prop4: '张鑫辉',
prop5: '2024/02/08 07:00',
prop6: '2024/02/10 12:00',
},
{
prop1: '使用申请',
prop3: '管理员审核',
prop4: '总监审核',
prop5: '柳青',
prop6: '刘青',
prop7: '2022/10/10 12:00',
prop3: '通过',
prop4: '柳青',
prop5: '2024/02/08 07:00',
prop6: '2024/02/10 12:00',
},
],
}

View File

@@ -18,7 +18,11 @@
<el-button type="primary" icon="el-icon-check">全部标记已读</el-button>
</div><!--operate 操作按钮-->
<el-table :data="tableData" style="width: 100%" height="529">
<el-table-column prop="prop1" label="消息内容"></el-table-column>
<el-table-column prop="prop0" label="消息标题">
<template slot-scope="scope">
<el-link type="primary" @click="drawer1 = true">{{ scope.row.prop0 }}</el-link>
</template>
</el-table-column>
<el-table-column prop="prop2" label="接收时间"></el-table-column>
<el-table-column prop="prop3" label="消息状态">
<template slot-scope="scope">
@@ -32,6 +36,15 @@
<el-pagination :current-page="currentPage4" :page-sizes="[100, 200, 300, 400]" :page-size="100" layout="total, sizes, prev, pager, next, jumper" :total="400"></el-pagination>
</el-card><!--el-card-->
<el-dialog :visible.sync="drawer1" :direction="direction" :before-close="handleClose" size="75%">
<template #title>
<span>消息内容</span>
</template>
<div class="lctitle">消息标题网络资源信息名称1 已过期</div><!--lctitle-->
<div>
</div>
</el-dialog><!--el-drawer 流程监控-抽屉-->
</div><!--app-container-->
</template>
@@ -40,29 +53,35 @@
name: 'message',
data() {
return {
drawer1: false,
tableData: [
{
prop0: '网络资源信息名称1 已过期',
prop1: '网络资源信息名称1 已过期',
prop2: '2024/02/09 12:00',
prop3: '未读',
},
{
prop1: '网络资源信息名称2 已过期',
prop0: '网络资源信息名称2 已过期',
prop1: '网络资源信息名称1 已过期',
prop2: '2024/02/09 12:00',
prop3: '已读',
},
{
prop1: '网络资源信息名称3 已过期',
prop0: '网络资源信息名称3 已过期',
prop1: '网络资源信息名称1 已过期',
prop2: '2024/02/09 12:00',
prop3: '未读',
},
{
prop1: '网络资源信息名称4 已过期',
prop0: '网络资源信息名称4 已过期',
prop1: '网络资源信息名称1 已过期',
prop2: '2024/02/09 12:00',
prop3: '已读',
},
{
prop1: '网络资源信息名称5 已过期',
prop0: '网络资源信息名称5 已过期',
prop1: '网络资源信息名称1 已过期',
prop2: '2024/02/09 12:00',
prop3: '未读',
}