清单流程

This commit is contained in:
宋伟佳
2021-06-30 15:52:19 +08:00
parent 78a69f90ec
commit bf0e995977
6 changed files with 706 additions and 16 deletions
@@ -0,0 +1,659 @@
<!--标准清单发布/更新流程-->
<template>
<div class="bzqdfb-step1">
<ProcessHeader toggle>
<template slot="proName">标准清单发布/更新流程</template>
<template slot="proNode">申请人发起流程</template>
</ProcessHeader>
<div class="headerTabs">
<div class="headerTabsItem" :class="active === '1' ? 'active' : ''" @click="handleTabs('1')">基础信息</div>
<div class="headerTabsItem" :class="active === '2' ? 'active' : ''" @click="handleTabs('2')">审批历史</div>
</div>
<div class="content" v-if="active == '1'">
<div style="flex: auto; overflow: auto">
<process-title>
<template slot="title">基础信息</template>
</process-title>
<el-form
:model="listForm"
class="label-input-form prc-content-border"
label-width="150px"
>
<el-row :gutter="24">
<el-col :span="24">
<el-form-item label="选择清单" prop="orgName" class="add-form-item form-item-disabled">
<el-radio-group v-model="radio" @change="selectionList">
<el-radio label="country">国家/地区清单</el-radio>
<el-radio label="project">项目清单</el-radio>
<el-radio label="other">其他清单</el-radio>
</el-radio-group>
<el-button size="mini" type="primary" style="margin-left: 40px;" @click="choiceShow">带入</el-button>
</el-form-item>
<el-form-item label="清单名称" prop="orgName" class="add-form-item form-item-disabled">
<el-input
v-model="listForm.orgName"
placeholder="请输入清单名称"
clearable
></el-input>
</el-form-item>
<el-form-item label="适用区域" prop="account" class="add-form-item form-item-disabled">
<el-select v-model="listForm.country">
<el-option v-for="opt in countryOptions" :value="opt.value === undefined ? '' :opt.value"
:key="opt.value" :label="opt.label">{{ opt.label }}
</el-option>
</el-select>
</el-form-item>
<el-form-item label="清单说明" prop="mobilePhone" class="add-form-item form-item-disabled">
<el-input
v-model="listForm.mobilePhone"
placeholder="请输入清单说明"
clearable
></el-input>
</el-form-item>
<el-form-item label="附件" prop="email" class="add-form-item form-item-disabled">
<el-button size="mini" type="primary">点击上传</el-button>
</el-form-item>
<el-form-item label="会签" prop="type" class="add-form-item form-item-disabled">
<el-radio-group v-model="listForm.type">
<el-radio label="1"></el-radio>
<el-radio label="2"></el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
</el-form>
<process-title>
<template slot="title">填写信息</template>
</process-title>
<div class="tableTitle">
清单列表
<div class="tableButton">
<el-button plain class="common-button-primary" size="mini" @click="addList">添加</el-button>
<el-button plain class="common-button-primary" size="mini" @click="deleteList">批量删除</el-button>
</div>
</div>
<el-table
:data="data"
border
style="width: 100%"
:header-cell-style="{background: '#e8e8e8', color: '#333333', fontSize: '16px',
fontWeight: 'bold', height: '48px'}">
<el-table-column
type="selection"
width="55"
align="center">
</el-table-column>
<el-table-column
prop="content"
label="标准号"
>
</el-table-column>
<el-table-column
prop="deptName"
label="中文名称"
>
</el-table-column>
<el-table-column
prop="deptName"
label="英文名称"
>
</el-table-column>
<el-table-column
prop="deptName"
label="发布日期"
>
</el-table-column>
<el-table-column
prop="deptName"
label="新车型实施日期"
>
</el-table-column>
<el-table-column
prop="deptName"
label="在产车实施日期"
>
</el-table-column>
<el-table-column
prop="deptName"
label="适用车型"
>
</el-table-column>
<el-table-column
prop="deptName"
label="文本状态"
>
</el-table-column>
</el-table>
</div>
<ProcessFooter
show-save
show-submit
:submitLoading="isSubmit"
:saveLoading="saveLoading"
@save="handleSave"
@submit="handleSubmit"
>
</ProcessFooter>
</div>
<div class="content" v-if="active == '2'">
<div class="block" style="padding-top: 20px;">
<el-timeline>
<el-timeline-item timestamp="发起流程" placement="top" :color="user1 ? '#66b1ff' : ''">
<el-card>
<h4>标准/政策法规工程师</h4>
<div style="margin-top: 10px;">
<el-input v-model="user1" placeholder="请输入"></el-input>
</div>
</el-card>
</el-timeline-item>
<el-timeline-item timestamp="选择责任人进行会签" placement="top" :color="user2 ? '#66b1ff' : ''">
<el-card>
<h4>责任人</h4>
<div style="margin-top: 10px;">
<el-input v-model="user2" placeholder="请输入">
</el-input>
</div>
</el-card>
</el-timeline-item>
<el-timeline-item timestamp="根据会签内容进行修订" placement="top" :color="user3 ? '#66b1ff' : ''">
<el-card>
<h4>责任人</h4>
<div style="margin-top: 10px;">
<el-input v-model="user3" placeholder="请输入"></el-input>
</div>
</el-card>
</el-timeline-item>
<el-timeline-item timestamp="审核" placement="top" :color="user5 ? '#66b1ff' : ''">
<el-card>
<h4>业务经理</h4>
<div style="margin-top: 10px;">
<el-input v-model="user5" placeholder="请输入"></el-input>
</div>
</el-card>
</el-timeline-item>
</el-timeline>
</div>
</div>
<!-- 选择标准抽屉-->
<el-drawer
title="选择清单"
:visible.sync="ListModel"
size="900px"
custom-class="demo-drawer"
>
<el-table
v-if="radio === 'country'"
:data="sarAccessListDatas"
tooltip-effect="dark"
style="width: 100%"
border
height="100%"
:header-cell-style="{background: '#f5f1f1', color: '#333333', fontSize: '16px',
fontWeight: 'bold', height: '48px'}"
@selection-change="selectOne"
ref="selection"
>
<el-table-column
type="selection"
width="55"
align="center">
</el-table-column>
<el-table-column
prop="countryArea"
label="国家/地区"
align="center">
</el-table-column>
<el-table-column
prop="detailedListName"
label="清单名称"
align="center"
>
<template slot-scope="scope">
<a class="table-jump" @click.stop="showTable(scope.row)">{{ scope.row.detailedListName }}</a>
</template>
</el-table-column>
<el-table-column
prop="detailedListState"
label="清单状态"
align="center">
<template slot-scope="scope">
<span v-if="scope.row.detailedListState === '1'">未发布</span>
<span v-if="scope.row.detailedListState === '2'">已发布</span>
</template>
</el-table-column>
<el-table-column
prop="detailedListVision"
label="清单版本"
align="center">
<template slot-scope="scope">
<span
v-if="scope.row.detailedListVision != null && scope.row.detailedListVision !== ''">{{ scope.row.detailedListVision
}}</span>
</template>
</el-table-column>
<el-table-column
prop="applicationScope"
label="适用领域"
align="center">
<template slot-scope="scope">
<span
v-if="scope.row.applicationScope != null && scope.row.applicationScope !== ''">{{ scope.row.applicationScope
}}</span>
</template>
</el-table-column>
<el-table-column
prop="updateTime"
label="更新时间"
sortable
align="center">
<template slot-scope="scope">
<div>
{{ scope.row.updateTime ? $moment(scope.row.updateTime).format("YYYY-MM-DD hh:mm:ss") : scope.row.updateTime
}}
</div>
</template>
</el-table-column>
<el-table-column
prop="updatePeople"
label="更新人"
align="center">
</el-table-column>
</el-table>
<el-table
v-if="radio === 'project'"
:data="sarAccessListDatas"
tooltip-effect="dark"
style="width: 100%"
border
height="100%"
:header-cell-style="{background: '#f5f1f1', color: '#333333', fontSize: '16px',
fontWeight: 'bold', height: '48px'}"
@selection-change="selectOne"
ref="selection"
>
<el-table-column
type="selection"
width="55"
align="center">
</el-table-column>
<el-table-column
prop="projectName"
label="项目名称"
align="center">
</el-table-column>
<el-table-column
prop="detailedListName"
label="清单名称"
align="center"
>
<template slot-scope="scope">
<a class="table-jump" @click.stop="showTable(scope.row)">{{ scope.row.detailedListName }}</a>
</template>
</el-table-column>
<el-table-column
prop="detailedListState"
label="清单状态"
align="center">
<template slot-scope="scope">
<span v-if="scope.row.detailedListState === '1'">未发布</span>
<span v-if="scope.row.detailedListState === '2'">已发布</span>
</template>
</el-table-column>
<el-table-column
prop="detailedListVision"
label="清单版本"
align="center">
<template slot-scope="scope">
<span
v-if="scope.row.detailedListVision != null && scope.row.detailedListVision !== ''">{{ scope.row.detailedListVision
}}</span>
</template>
</el-table-column>
<el-table-column
prop="applicationScope"
label="适用领域"
align="center">
<template slot-scope="scope">
<span
v-if="scope.row.applicationScope != null && scope.row.applicationScope !== ''">{{ scope.row.applicationScope
}}</span>
</template>
</el-table-column>
<el-table-column
prop="updateTime"
label="更新时间"
sortable
align="center">
<template slot-scope="scope">
<div>
{{ scope.row.updateTime ? $moment(scope.row.updateTime).format("YYYY-MM-DD hh:mm:ss") : scope.row.updateTime
}}
</div>
</template>
</el-table-column>
<el-table-column
prop="updatePeople"
label="更新人"
align="center">
</el-table-column>
</el-table>
<el-table
v-if="radio === 'other'"
:data="sarAccessListDatas"
tooltip-effect="dark"
style="width: 100%"
border
height="100%"
:header-cell-style="{background: '#f5f1f1', color: '#333333', fontSize: '16px',
fontWeight: 'bold', height: '48px'}"
@selection-change="selectOne"
ref="selection"
>
<el-table-column
type="selection"
width="55"
align="center">
</el-table-column>
<el-table-column
prop="detailedList"
label="清单类别"
align="center">
</el-table-column>
<el-table-column
prop="detailedListName"
label="清单名称"
align="center"
>
<template slot-scope="scope">
<a class="table-jump" @click.stop="showTable(scope.row)">{{ scope.row.detailedListName }}</a>
</template>
</el-table-column>
<el-table-column
prop="detailedListState"
label="清单状态"
align="center">
<template slot-scope="scope">
<span v-if="scope.row.detailedListState === '1'">未发布</span>
<span v-if="scope.row.detailedListState === '2'">已发布</span>
</template>
</el-table-column>
<el-table-column
prop="detailedListVision"
label="清单版本"
align="center">
<template slot-scope="scope">
<span
v-if="scope.row.detailedListVision != null && scope.row.detailedListVision !== ''">{{ scope.row.detailedListVision
}}</span>
</template>
</el-table-column>
<el-table-column
prop="applicationScope"
label="适用领域"
align="center">
<template slot-scope="scope">
<span
v-if="scope.row.applicationScope != null && scope.row.applicationScope !== ''">{{ scope.row.applicationScope
}}</span>
</template>
</el-table-column>
<el-table-column
prop="updateTime"
label="更新时间"
sortable
align="center">
<template slot-scope="scope">
<div>
{{ scope.row.updateTime ? $moment(scope.row.updateTime).format("YYYY-MM-DD hh:mm:ss") : scope.row.updateTime
}}
</div>
</template>
</el-table-column>
<el-table-column
prop="updatePeople"
label="更新人"
align="center">
</el-table-column>
</el-table>
<div class="demo-drawer-footer">
<el-button size="mini" @click="closeDrawer">取消</el-button>
<el-button type="primary" size="mini" @click="OkDrawer">确定</el-button>
</div>
</el-drawer>
<!-- 添加标准抽屉-->
<el-drawer
title="添加标准"
:visible.sync="standModel"
size="900px"
custom-class="demo-drawer"
>
<el-table
:data="standardData"
tooltip-effect="dark"
style="width: 100%"
border
height="100%"
:header-cell-style="{background: '#f5f1f1', color: '#333333', fontSize: '16px',
fontWeight: 'bold', height: '48px'}"
@selection-change="selectOne"
>
<el-table-column
type="selection"
width="55"
align="center">
</el-table-column>
<el-table-column
prop="content"
label="标准号"
>
</el-table-column>
<el-table-column
prop="deptName"
label="中文名称"
>
</el-table-column>
<el-table-column
prop="deptName"
label="英文名称"
>
</el-table-column>
<el-table-column
prop="deptName"
label="发布日期"
>
</el-table-column>
<el-table-column
prop="deptName"
label="新车型实施日期"
>
</el-table-column>
<el-table-column
prop="deptName"
label="在产车实施日期"
>
</el-table-column>
<el-table-column
prop="deptName"
label="适用车型"
>
</el-table-column>
<el-table-column
prop="deptName"
label="文本状态"
>
</el-table-column>
</el-table>
</el-drawer>
</div>
</template>
<script>
import ProcessHeader from "../../components/ProcessHeader";
import ProcessFooter from "../../components/ProcessFooter";
import ProcessTitle from "../../components/ProcessTitle";
export default {
name: "bzqdfbStep1",
components: {
ProcessHeader,
ProcessFooter,
ProcessTitle
},
data() {
return {
data: [],
sarAccessListDatas: [], //国家地区清单表格
standardData: [], //添加标准数据
ListModel: false, //选择清单抽屉状态
standModel: false, // 选择标准抽屉状态
active: "1",
isSubmit: false,
saveLoading: false,
radio: "country",
tabValue: "listOfCountries",
selectedList: [],
listForm: {},
choiceForm: {}, //选择标准清单列表
countryOptions: [], //适用区域下拉框数据
user1: "",
user2: "",
user3: "",
user4: "",
user5: ""
};
},
methods: {
//tab发生变化
handleTabs(name) {
this.active = name;
},
choiceShow() {
this.ListModel = true;
},
selectionList (type) {
console.log(type);
},
//点击新增事件
addList() {
this.standModel = true
},
// 点击批量删除事件
deleteList() {
this.$confirm('您确认删除这些数据?', '提示', {
confirmButtonText: '确认',
confirmButtonClass:'common-button-primary',
cancelButtonText: '取消',
type:'warning',
}).then (() => {
}).catch (() => {
})
},
//保存事件
handleSave() {
},
//提交事件
handleSubmit() {
},
//选择标准取消事件
closeDrawer() {
},
//选择标准确定事件
OkDrawer() {
},
selectOne(data) {
this.selectedList = [];
for (let i = 0; i < data.length; i++) {
this.selectedList.push(data[i].id);
}
}
},
mounted() {
//从数据查询下拉框数据
this.$http.get("sys/dictype/getDicTypeListCode", "", {
_this: this
}, res => {
this.countryOptions = res.data.COUNTRY;
});
}
};
</script>
<style lang="less" scoped>
@import '~@/assets/styles/style';
.bzqdfb-step1 {
/deep/ .el-drawer__container {
.prc-content-border {
border: none;
padding: 0 20px 0;
}
}
.choiceBtn {
.el-button--primary {
width: 150px;
}
}
position: relative;
height: 100%;
.headerTabs {
height: 52px;
display: flex;
align-items: center;
position: absolute;
top: 0;
right: 10px;
.headerTabsItem {
border: 1px solid #c1c1c1;
padding: 0 5px;
height: 30px;
line-height: 30px;
cursor: pointer;
}
.active {
border: 1px solid #E6A23C;
color: #fff;
background: #E6A23C;
}
}
.content {
display: flex;
flex-direction: column;
justify-content: space-between;
height: calc(~'100% - 55px');
overflow: auto;
.tableTitle {
margin-bottom: 10px;
height: 30px;
line-height: 30px;
position: relative;
font-size: 13px;
font-weight: bold;
.tableButton {
position: absolute;
right: 0;
top: 0;
}
.accessStandardsAndRegulations {
height: 100%;
}
}
}
}
</style>
@@ -0,0 +1,13 @@
<!--标准-->
<template>
</template>
<script>
export default {
name: "bzqdfbStep2"
};
</script>
<style scoped>
</style>
@@ -9,6 +9,7 @@
<div class="process-name" @click="handleCreateProcess('3')">标准征求意见流程</div>
<div class="process-name" @click="handleCreateProcess('4')">标准需求(翻译)申请流程</div>
<div class="process-name" @click="handleCreateProcess('5')">标准发放申请流程</div>
<div class="process-name" @click="handleCreateProcess('6')">标准清单发布/更新流程</div>
</div>
</div>
<div v-if="zcgllc">
@@ -77,6 +78,10 @@ export default {
// 标准发放申请流程
break
case '6':
//标准清单发布流程
this.$router.push({
name:'bzqdfbStep1'
})
break
case '7':
break
@@ -1512,7 +1512,6 @@ export default {
_this: this,
loading: 'dataLoading'
}, res => {
console.log(res.data.list);
res.data.list[0].list.map(item => {
item.newPutTextTime = null
item.prodPutTextTime = null
+11 -15
View File
@@ -192,7 +192,7 @@ export default {
resultLoading: false,
total: 0,
page: 1,
zqazqazqa:[],
searchData: [],
pageAll: 1,
totalAll: 0,
Allitems: [], // 选中全部返回数据
@@ -242,12 +242,11 @@ export default {
]
}
];
res.data.forEach((info) => {
_this.searchOptions.push(info);
let resdata = JSON.parse(JSON.stringify(_this.searchOptions));
let data = resdata.slice(0, 6);
_this.searchOptions =data;
});
_this.searchData = res.data;
for (let i = 0; i < res.data.length; i++) {
if (_this.searchOptions.length >= 6) break;
_this.searchOptions.push(res.data[i]);
}
}, e => {
});
},
@@ -268,13 +267,17 @@ export default {
this.AllCheck = true;
//点击全部显示分页
this.AllPage = true;
this.searchOptions = [condition];
this.searchOptions = [condition]
this.searchCondition.selectIndex = ["All"];
this.searchSarByInputKey();
} else {
this.AllPage = false;
this.Allitems = [];
this.AllCheck = false;
for (let i = 0; i < this.searchData.length; i++) {
if (this.searchOptions.length >= 6) break;
this.searchOptions.push(this.searchData[i]);
}
}
} else {
this.AllPage = false;
@@ -574,17 +577,10 @@ export default {
.search-condition {
width: 100%;
/*min-height: 200px;*/
min-height: 200px;
position: relative;
//border: 1px solid @borderColor;
border-bottom: 1px solid @borderColor;
margin-top: 15px;
//background-color: hsla(0,0%,100%,.9);
//border-radius: 20px;
padding: 10px;
//overflow: auto;
max-height: 300px;
.condition-btn {
+18
View File
@@ -240,6 +240,24 @@ const routes = [
title: '标准发放申请流程'
}
},
{
path: '/bzqdfbStep1',
name: 'bzqdfbStep1',
component: () => import('@/pages/processCenter/pages/creatProcess/bzqdfb/step1.vue'),
meta: {
requireAuth: true,
title: '标准清单发布/更新流程'
}
},
{
path: '/bzqdfbStep2',
name: 'bzqdfbStep2',
component: () => import('@/pages/processCenter/pages/creatProcess/bzqdfb/step2.vue'),
meta: {
requireAuth: true,
title: '标准清单发布/更新流程'
}
},
{
path: '/bzrkStep1',
name: 'bzrkStep1',