|
|
|
@ -0,0 +1,345 @@
|
|
|
|
|
<template>
|
|
|
|
|
<div class="dealWayPanel">
|
|
|
|
|
<div class="flexSpaceBetween">
|
|
|
|
|
<div class="tableOperator flex-item-center">
|
|
|
|
|
<div class="addBtn flex-center mr4" @click="add">
|
|
|
|
|
<div class="plusIcon mr4"></div>
|
|
|
|
|
<div>新增模板</div>
|
|
|
|
|
</div>
|
|
|
|
|
<el-popconfirm
|
|
|
|
|
icon="el-icon-info"
|
|
|
|
|
icon-color="red"
|
|
|
|
|
title="确定删除当前选择项目吗?"
|
|
|
|
|
@confirm="del(item)"
|
|
|
|
|
>
|
|
|
|
|
<div v-if="delArr.length" slot="reference" class="delBtn">删除</div>
|
|
|
|
|
</el-popconfirm>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="searchWrap"></div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="dealWayTableWrap">
|
|
|
|
|
<div class="dealWayTable">
|
|
|
|
|
<el-row :gutter="20">
|
|
|
|
|
<el-col
|
|
|
|
|
class="mb16"
|
|
|
|
|
:span="8"
|
|
|
|
|
v-for="item in dataSource"
|
|
|
|
|
:key="item.id"
|
|
|
|
|
>
|
|
|
|
|
<div class="dealWayThead">
|
|
|
|
|
<div class="nameWrap">
|
|
|
|
|
<div
|
|
|
|
|
class="checkIcon"
|
|
|
|
|
:class="{ checkIconActive: delArr.includes(item.id) }"
|
|
|
|
|
@click="selectDel(item)"
|
|
|
|
|
></div>
|
|
|
|
|
<div class="">{{ item.cmy }}</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="dealWayTbody">
|
|
|
|
|
<div class="line">
|
|
|
|
|
<div class="item">
|
|
|
|
|
<div class="label">处置方式:</div>
|
|
|
|
|
<div class="value">{{ item.way }}</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="line">
|
|
|
|
|
<div class="item">
|
|
|
|
|
<div class="label">处置流程:</div>
|
|
|
|
|
<div class="value">{{ item.nr }}</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="line mt20">
|
|
|
|
|
<div class="item">
|
|
|
|
|
<div class="label">任务单:</div>
|
|
|
|
|
<div class="value">
|
|
|
|
|
<div
|
|
|
|
|
class="icon"
|
|
|
|
|
:style="{ backgroundImage: `url(${item.taskI})` }"
|
|
|
|
|
></div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="item">
|
|
|
|
|
<div class="label">行政处罚:</div>
|
|
|
|
|
<div class="value">
|
|
|
|
|
<div
|
|
|
|
|
class="icon"
|
|
|
|
|
:style="{ backgroundImage: `url(${item.cfaI})` }"
|
|
|
|
|
></div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</el-col>
|
|
|
|
|
</el-row>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="tableWrap">
|
|
|
|
|
<gMainTable
|
|
|
|
|
ref="gMainTable"
|
|
|
|
|
:tableData="dataSource"
|
|
|
|
|
:columns="columns"
|
|
|
|
|
rowKey="id"
|
|
|
|
|
:pagination="ipagination"
|
|
|
|
|
@pageSizeChange="handlePageSizeChange"
|
|
|
|
|
@currentPageChange="handleCurrentPageChange"
|
|
|
|
|
>
|
|
|
|
|
</gMainTable>
|
|
|
|
|
</div>
|
|
|
|
|
<FormDialog
|
|
|
|
|
labelPosition="top"
|
|
|
|
|
ref="formDialog"
|
|
|
|
|
:formItems="formItems"
|
|
|
|
|
width="800px"
|
|
|
|
|
@formSubmit="formSubmit"
|
|
|
|
|
>
|
|
|
|
|
</FormDialog>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
<script>
|
|
|
|
|
import { tableListMixins } from "@/loveflow/mixins/tableListMixins";
|
|
|
|
|
import { commonMixins } from "@/loveflow/mixins/commonMixins";
|
|
|
|
|
export default {
|
|
|
|
|
mixins: [tableListMixins, commonMixins],
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
disableMixinCreated: true,
|
|
|
|
|
columns: [
|
|
|
|
|
{
|
|
|
|
|
prop: "id",
|
|
|
|
|
label: "序号",
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
formItems: [
|
|
|
|
|
{
|
|
|
|
|
type: "select",
|
|
|
|
|
itemAttrs: {
|
|
|
|
|
label: "请选择消息类型",
|
|
|
|
|
span: 12,
|
|
|
|
|
rules: this.$rules.requiredItem,
|
|
|
|
|
},
|
|
|
|
|
attrs: {
|
|
|
|
|
model: "type",
|
|
|
|
|
value: "",
|
|
|
|
|
option: [],
|
|
|
|
|
style: {
|
|
|
|
|
width: "100%",
|
|
|
|
|
paddingRight: "16px",
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
type: "select",
|
|
|
|
|
itemAttrs: {
|
|
|
|
|
label: "请选择风险项",
|
|
|
|
|
span: 12,
|
|
|
|
|
rules: this.$rules.requiredItem,
|
|
|
|
|
},
|
|
|
|
|
attrs: {
|
|
|
|
|
model: "risk",
|
|
|
|
|
value: "",
|
|
|
|
|
option: [],
|
|
|
|
|
style: {
|
|
|
|
|
width: "100%",
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
type: "select",
|
|
|
|
|
itemAttrs: {
|
|
|
|
|
label: "请选择要素异常明细",
|
|
|
|
|
span: 12,
|
|
|
|
|
rules: this.$rules.requiredItem,
|
|
|
|
|
},
|
|
|
|
|
attrs: {
|
|
|
|
|
model: "ys",
|
|
|
|
|
value: "",
|
|
|
|
|
option: [],
|
|
|
|
|
style: {
|
|
|
|
|
width: "100%",
|
|
|
|
|
paddingRight: "16px",
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
type: "checkGroup",
|
|
|
|
|
itemAttrs: {
|
|
|
|
|
label: "语音推送对象",
|
|
|
|
|
span: 24,
|
|
|
|
|
rules: this.$rules.requiredItem,
|
|
|
|
|
},
|
|
|
|
|
attrs: {
|
|
|
|
|
model: "obj",
|
|
|
|
|
value: [],
|
|
|
|
|
option: [],
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
type: "textarea",
|
|
|
|
|
itemAttrs: {
|
|
|
|
|
label: "请输入语音内容",
|
|
|
|
|
span: 24,
|
|
|
|
|
rules: this.$rules.requiredItem,
|
|
|
|
|
},
|
|
|
|
|
attrs: {
|
|
|
|
|
model: "nr",
|
|
|
|
|
rows: 2,
|
|
|
|
|
value: "",
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
delArr: [],
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
mounted() {
|
|
|
|
|
this.setFindItem("formItems", "type").attrs.option = this.infoTypeList;
|
|
|
|
|
this.setFindItem("formItems", "risk").attrs.option = this.riskList;
|
|
|
|
|
this.setFindItem("formItems", "ys").attrs.option = this.elementList;
|
|
|
|
|
this.setFindItem("formItems", "obj").attrs.option = this.pushObjList;
|
|
|
|
|
},
|
|
|
|
|
created() {
|
|
|
|
|
for (let i = 0; i < 20; i++) {
|
|
|
|
|
this.dataSource.push({
|
|
|
|
|
cmy: "宁波镇海兴达化工有限公司" + i,
|
|
|
|
|
id: i,
|
|
|
|
|
way: "企业提醒",
|
|
|
|
|
nr: "您好!X年X月X日,贵单位的XXXXXXXX证书将过期,需及时处置。",
|
|
|
|
|
taskI: require("@/assets/images/team/taskb.png"),
|
|
|
|
|
cfaI: require("@/assets/images/team/cfab.png"),
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
add() {
|
|
|
|
|
this.$refs.formDialog.openDialog("other", {}, "推送规则设置");
|
|
|
|
|
},
|
|
|
|
|
edit(obj) {
|
|
|
|
|
this.$refs.formDialog.openDialog("other", obj, "编辑推送规则设置");
|
|
|
|
|
},
|
|
|
|
|
selectDel(obj) {
|
|
|
|
|
let id = obj.id;
|
|
|
|
|
if (this.delArr.includes(id)) {
|
|
|
|
|
this.delArr = this.delArr.filter((item) => item != id);
|
|
|
|
|
} else {
|
|
|
|
|
this.delArr.push(id);
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
del(item) {
|
|
|
|
|
this.$message({
|
|
|
|
|
message: item.nr,
|
|
|
|
|
type: "success",
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
formSubmit(obj) {
|
|
|
|
|
console.log(obj);
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
};
|
|
|
|
|
</script>
|
|
|
|
|
<style lang="scss">
|
|
|
|
|
@import "@/loveflow/assets/index.scss";
|
|
|
|
|
.dealWayPanel {
|
|
|
|
|
height: 100%;
|
|
|
|
|
overflow-y: hidden;
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
.delBtn {
|
|
|
|
|
padding: vw(8) vw(18);
|
|
|
|
|
font-size: vw(14);
|
|
|
|
|
color: #ffffff;
|
|
|
|
|
background: url("~@/assets/images/base/addbtn.png") no-repeat center center;
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.dealWayTableWrap {
|
|
|
|
|
height: calc(100% - 90px);
|
|
|
|
|
.dealWayTable {
|
|
|
|
|
height: 100%;
|
|
|
|
|
overflow-y: scroll;
|
|
|
|
|
&::-webkit-scrollbar {
|
|
|
|
|
display: none;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.dealWayThead {
|
|
|
|
|
padding-top: vw(10);
|
|
|
|
|
margin-left: -10px;
|
|
|
|
|
padding-left: 24px;
|
|
|
|
|
height: vw(46);
|
|
|
|
|
background: url("~@/assets/images/team/chead.png") no-repeat center
|
|
|
|
|
center;
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
font-size: vw(16);
|
|
|
|
|
color: #edf4ff;
|
|
|
|
|
.nameWrap {
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
}
|
|
|
|
|
.checkIcon {
|
|
|
|
|
margin-right: 6px;
|
|
|
|
|
width: vw(18);
|
|
|
|
|
height: vw(18);
|
|
|
|
|
border: solid 1px #edf4ff;
|
|
|
|
|
border-radius: 2px;
|
|
|
|
|
&.checkIconActive {
|
|
|
|
|
width: vw(18);
|
|
|
|
|
height: vw(18);
|
|
|
|
|
background: url("~@/assets/images/base/check.png") no-repeat center
|
|
|
|
|
center;
|
|
|
|
|
background-size: vw(32) vw(32);
|
|
|
|
|
}
|
|
|
|
|
&:hover {
|
|
|
|
|
opacity: 0.8;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.dealWayTbody {
|
|
|
|
|
margin-top: -10px;
|
|
|
|
|
padding: vw(16);
|
|
|
|
|
height: vw(200);
|
|
|
|
|
background: url("~@/assets/images/team/cbody.png") no-repeat center
|
|
|
|
|
center;
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
overflow-y: scroll;
|
|
|
|
|
&::-webkit-scrollbar {
|
|
|
|
|
display: none;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.line {
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
.item {
|
|
|
|
|
flex: 1;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
margin-bottom: vw(16);
|
|
|
|
|
.label {
|
|
|
|
|
width: vw(70);
|
|
|
|
|
font-size: vw(14);
|
|
|
|
|
color: #d0deee;
|
|
|
|
|
}
|
|
|
|
|
.value {
|
|
|
|
|
flex: 1;
|
|
|
|
|
font-size: vw(14);
|
|
|
|
|
color: #ffffff;
|
|
|
|
|
display: flex;
|
|
|
|
|
.icon {
|
|
|
|
|
width: vw(36);
|
|
|
|
|
height: vw(36);
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
background-position: center center;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.el-table {
|
|
|
|
|
display: none;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|