loveflow
6 months ago
|
After Width: | Height: | Size: 284 B |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 21 KiB |
|
After Width: | Height: | Size: 13 KiB |
|
After Width: | Height: | Size: 6.9 KiB |
|
After Width: | Height: | Size: 505 B |
|
After Width: | Height: | Size: 526 B |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 925 B |
|
After Width: | Height: | Size: 777 B |
@ -0,0 +1,53 @@
|
||||
<template>
|
||||
<div class="handleDetailPanel">
|
||||
<div class="riskTrim tlIcon"></div>
|
||||
<div class="handleDetailTitle">{{ title }}</div>
|
||||
<slot></slot>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
default: () => {
|
||||
return "";
|
||||
},
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.handleDetailPanel {
|
||||
padding: 6px 20px;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
background: url("~@/assets/images/team/hdtb.png") no-repeat center center;
|
||||
background-size: 100% 100%;
|
||||
box-sizing: border-box;
|
||||
.riskTrim {
|
||||
position: absolute;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.tlIcon {
|
||||
top: 0;
|
||||
left: 0;
|
||||
background: url("~@/assets/images/team/hdti.png") no-repeat center center;
|
||||
}
|
||||
|
||||
.handleDetailTitle {
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
font-weight: 500;
|
||||
font-size: 16px;
|
||||
color: #ffe6d9;
|
||||
text-shadow: 0px 0px 8px rgba(255, 119, 52, 0.5);
|
||||
border-bottom: solid 1px rgba(91, 116, 140, 0.6);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,181 @@
|
||||
<template>
|
||||
<div class="riskHandleIndexDetailPanel">
|
||||
<tableMain>
|
||||
<div class="riskHandleIndexDetailWrap">
|
||||
<div class="titleWrap">
|
||||
<span
|
||||
class="backBtn"
|
||||
@click="gotoPage('/teamWork/riskHandle/indexMy')"
|
||||
>
|
||||
闭环处置</span
|
||||
>
|
||||
<span class="icon"></span>
|
||||
<span class="dealDetailTitle">处置详情</span>
|
||||
</div>
|
||||
<div class="topHead">
|
||||
<gTab
|
||||
ref="gTabRef"
|
||||
:tabList="tabList"
|
||||
:curTab="curTab"
|
||||
@tabClick="tabChange"
|
||||
></gTab>
|
||||
</div>
|
||||
<div class="btmBody">
|
||||
<component :is="content"></component>
|
||||
</div>
|
||||
</div>
|
||||
</tableMain>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import tableMain from "../components/tableMain.vue";
|
||||
|
||||
import indexDetailForm from "./indexDetailForm.vue";
|
||||
import indexDetailFlow from "./indexDetailFlow.vue";
|
||||
import indexDetailRecord from "./indexDetailRecord.vue";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
tableMain,
|
||||
indexDetailForm,
|
||||
indexDetailFlow,
|
||||
indexDetailRecord,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tabList: [
|
||||
{
|
||||
name: "表单信息",
|
||||
value: "1",
|
||||
},
|
||||
{
|
||||
name: "流程图",
|
||||
value: "2",
|
||||
},
|
||||
{
|
||||
name: "流程记录",
|
||||
value: "3",
|
||||
},
|
||||
],
|
||||
curTab: "1",
|
||||
content: "indexDetailForm",
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
tabChange(val) {
|
||||
if (val == "1") {
|
||||
this.content = indexDetailForm;
|
||||
}
|
||||
if (val == "2") {
|
||||
this.content = indexDetailFlow;
|
||||
}
|
||||
if (val == "3") {
|
||||
this.content = indexDetailRecord;
|
||||
}
|
||||
},
|
||||
gotoPage(val) {
|
||||
this.$router.push({
|
||||
path: val,
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
@import "@/loveflow/assets/index.scss";
|
||||
.riskHandleIndexDetailPanel {
|
||||
padding: 16px;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
color: #ffffff;
|
||||
overflow-y: scroll;
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
.riskHandleIndexDetailWrap {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.titleWrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 46px;
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
color: #ebfff4;
|
||||
letter-spacing: 2px;
|
||||
text-shadow: 0px 0px 9px rgba(21, 255, 195, 0.6);
|
||||
border-bottom: solid 1px rgba(91, 116, 140, 0.6);
|
||||
.backBtn {
|
||||
&:hover {
|
||||
opacity: 0.8;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.icon {
|
||||
margin: 0 2px;
|
||||
width: vw(20);
|
||||
height: vw(20);
|
||||
background: url("~@/assets/images/base/navI.png") no-repeat center
|
||||
center;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.dealDetailTitle {
|
||||
font-weight: 400;
|
||||
font-size: vw(16);
|
||||
color: #ebf7ff;
|
||||
}
|
||||
}
|
||||
.topHead {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
height: 50px;
|
||||
border-bottom: solid 1px rgba(91, 116, 140, 0.6);
|
||||
}
|
||||
.btmBody {
|
||||
padding-top: vw(14);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: calc(100% - 100px);
|
||||
overflow-y: scroll;
|
||||
&::-webkit-scrollbar{
|
||||
display: none;
|
||||
}
|
||||
.failWrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #ff6262;
|
||||
.icon {
|
||||
background-color: #ff6262;
|
||||
}
|
||||
}
|
||||
.ingWrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #4cf993;
|
||||
.icon {
|
||||
background-color: #4cf993;
|
||||
}
|
||||
}
|
||||
.finishWrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #30c4ff;
|
||||
.icon {
|
||||
background-color: #30c4ff;
|
||||
}
|
||||
}
|
||||
.icon {
|
||||
margin-right: 10px;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
.text {
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,3 @@
|
||||
<template>
|
||||
<div class="indexDetailFlowPanel">流程图</div>
|
||||
</template>
|
||||
@ -0,0 +1,262 @@
|
||||
<template>
|
||||
<div class="riskHandleIndexMyPanel">
|
||||
<tableMain>
|
||||
<div class="riskHandleIndexMyWrap">
|
||||
<div class="titleWrap">
|
||||
<div class="backBtn" @click="gotoPage('/teamWork/riskHandle')">
|
||||
<img :src="backIcon" />返回
|
||||
</div>
|
||||
</div>
|
||||
<div class="topHead">
|
||||
<gTab ref="gTabRef" :tabList="tabList" @tabClick="typeChange"></gTab>
|
||||
</div>
|
||||
<div class="btmBody">
|
||||
<div class="flexSpaceBetween">
|
||||
<div class="tableOperator"></div>
|
||||
<div class="searchWrap">
|
||||
<el-form
|
||||
:inline="true"
|
||||
:model="queryParam"
|
||||
class="demo-form-inline"
|
||||
>
|
||||
<el-form-item label="流程状态">
|
||||
<el-select
|
||||
clearable
|
||||
v-model="queryParam.type"
|
||||
placeholder="选择流程状态"
|
||||
>
|
||||
<el-option label="进行中" value="1"></el-option>
|
||||
<el-option label="失败" value="0"></el-option>
|
||||
<el-option label="完成" value="2"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="创建时间">
|
||||
<el-date-picker
|
||||
v-model="queryParam.time"
|
||||
type="datetimerange"
|
||||
range-separator="至"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
>
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="关键词">
|
||||
<el-input
|
||||
v-model="queryParam.key"
|
||||
placeholder="请输入姓名、身份证"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="searchQuery"
|
||||
>查询</el-button
|
||||
>
|
||||
<el-button type="primary" plain @click="searchReset"
|
||||
>重置</el-button
|
||||
>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tableWrap">
|
||||
<gMainTable
|
||||
border
|
||||
stripe
|
||||
ref="gMainTable"
|
||||
:tableData="dataSource"
|
||||
:columns="columns"
|
||||
rowKey="id"
|
||||
:pagination="ipagination"
|
||||
@pageSizeChange="handlePageSizeChange"
|
||||
@currentPageChange="handleCurrentPageChange"
|
||||
>
|
||||
<template v-slot:stateSlot="{ scope }">
|
||||
<div class="failWrap" v-if="scope.row.state == 0">
|
||||
<div class="icon"></div>
|
||||
<div class="text">处理失败</div>
|
||||
</div>
|
||||
<div class="ingWrap" v-if="scope.row.state == 1">
|
||||
<div class="icon"></div>
|
||||
<div class="text">进行中</div>
|
||||
</div>
|
||||
<div class="finishWrap" v-if="scope.row.state == 2">
|
||||
<div class="icon"></div>
|
||||
<div class="text">处置完成</div>
|
||||
</div>
|
||||
</template>
|
||||
<template v-slot:optSlot="{ scope }">
|
||||
<div class="clickText" @click="checkDetail(scope.row)">
|
||||
详情
|
||||
</div>
|
||||
</template>
|
||||
</gMainTable>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</tableMain>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import tableMain from "../components/tableMain.vue";
|
||||
import { tableListMixins } from "@/loveflow/mixins/tableListMixins";
|
||||
export default {
|
||||
components: { tableMain },
|
||||
mixins: [tableListMixins],
|
||||
data() {
|
||||
return {
|
||||
backIcon: require("@/assets/images/topic/left.png"),
|
||||
|
||||
tabList: [
|
||||
{
|
||||
name: "我的流程",
|
||||
value: "1",
|
||||
},
|
||||
{
|
||||
name: "待办任务",
|
||||
value: "2",
|
||||
},
|
||||
{
|
||||
name: "已办任务",
|
||||
value: "3",
|
||||
},
|
||||
{
|
||||
name: "抄送我的",
|
||||
value: "4",
|
||||
},
|
||||
],
|
||||
columns: [
|
||||
{
|
||||
prop: "flow",
|
||||
label: "流程名称",
|
||||
},
|
||||
{
|
||||
prop: "date",
|
||||
label: "创建时间",
|
||||
attrs: {
|
||||
width: 220,
|
||||
},
|
||||
},
|
||||
{
|
||||
prop: "flowType",
|
||||
label: "流程类型",
|
||||
},
|
||||
{
|
||||
slot: "stateSlot",
|
||||
prop: "state",
|
||||
label: "流程状态",
|
||||
},
|
||||
{
|
||||
prop: "node",
|
||||
label: "当前节点",
|
||||
},
|
||||
{
|
||||
prop: "name",
|
||||
label: "未操作者",
|
||||
},
|
||||
{
|
||||
slot: "optSlot",
|
||||
prop: "address",
|
||||
label: "操作",
|
||||
attrs: {
|
||||
width: 80,
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
typeChange(val) {},
|
||||
checkDetail(obj) {},
|
||||
gotoPage(val) {
|
||||
this.$router.push({
|
||||
path: val,
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
@import "@/loveflow/assets/index.scss";
|
||||
.riskHandleIndexMyPanel {
|
||||
padding: 16px;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
color: #ffffff;
|
||||
overflow: hidden;
|
||||
.riskHandleIndexMyWrap {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.titleWrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 46px;
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
color: #ebfff4;
|
||||
letter-spacing: 2px;
|
||||
text-shadow: 0px 0px 9px rgba(21, 255, 195, 0.6);
|
||||
border-bottom: solid 1px rgba(91, 116, 140, 0.6);
|
||||
.backBtn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
img {
|
||||
margin-right: 2px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
&:hover {
|
||||
opacity: 0.8;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
.topHead {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
height: 50px;
|
||||
border-bottom: solid 1px rgba(91, 116, 140, 0.6);
|
||||
}
|
||||
.btmBody {
|
||||
padding-top: vw(14);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: calc(100% - 100px);
|
||||
.failWrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #ff6262;
|
||||
.icon {
|
||||
background-color: #ff6262;
|
||||
}
|
||||
}
|
||||
.ingWrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #4cf993;
|
||||
.icon {
|
||||
background-color: #4cf993;
|
||||
}
|
||||
}
|
||||
.finishWrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #30c4ff;
|
||||
.icon {
|
||||
background-color: #30c4ff;
|
||||
}
|
||||
}
|
||||
.icon {
|
||||
margin-right: 10px;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
.text {
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,50 @@
|
||||
<template>
|
||||
<div class="recordTableWrap">
|
||||
<el-table :data="tableData" style="width: 100%">
|
||||
<template v-for="(item, index) in columns">
|
||||
<el-table-column
|
||||
v-if="item.slot"
|
||||
:key="item.prop + index"
|
||||
:label="item.label"
|
||||
v-bind="item.attrs || {}"
|
||||
>
|
||||
<!-- slot内容 -->
|
||||
<template v-slot="scope">
|
||||
<slot :name="item.slot" :scope="scope" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
v-else
|
||||
:key="item.prop + index"
|
||||
:prop="item.prop"
|
||||
:label="item.label"
|
||||
v-bind="item.attrs || {}"
|
||||
>
|
||||
</el-table-column>
|
||||
</template>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
columns: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
return [];
|
||||
},
|
||||
},
|
||||
tableData: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
return [];
|
||||
},
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
created() {},
|
||||
};
|
||||
</script>
|
||||