311 lines
		
	
	
		
			8.3 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			311 lines
		
	
	
		
			8.3 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
| <template>
 | |
|   <ai-list class="AppDispatchManagement">
 | |
|     <template slot="title">
 | |
|       <ai-title title="公文流转" isShowBottomBorder></ai-title>
 | |
|     </template>
 | |
|     <template slot="content">
 | |
|       <ai-search-bar>
 | |
|         <template slot="left">
 | |
|           <ai-select
 | |
|               v-model="searchObj.documentType"
 | |
|               placeholder="选择公文类型"
 | |
|               clearable
 | |
|               @change="(page.current = 1), getList()"
 | |
|               :selectList="dict.getDict('officialDocumentName')"
 | |
|           ></ai-select>
 | |
|           <ai-select
 | |
|               v-model="searchObj.confidentialityLevel"
 | |
|               placeholder="选择保密等级"
 | |
|               clearable
 | |
|               @change="(page.current = 1), getList()"
 | |
|               :selectList="dict.getDict('officialDocumentConfidentialityLevel')"
 | |
|           ></ai-select>
 | |
|           <ai-select
 | |
|               v-model="searchObj.status"
 | |
|               placeholder="选择流转状态"
 | |
|               clearable
 | |
|               @change="(page.current = 1), getList()"
 | |
|               :selectList="dict.getDict('documentStatus')"
 | |
|           ></ai-select>
 | |
|           <ai-select
 | |
|               v-model="searchObj.readType"
 | |
|               placeholder="选择阅示类型"
 | |
|               clearable
 | |
|               @change="(page.current = 1), getList()"
 | |
|               :selectList="dict.getDict('officialDocumentReadType')"
 | |
|           ></ai-select>
 | |
| 
 | |
|           <!-- <el-row class="dateRange" type="flex" align="middle">
 | |
|             <span class="dateLabel">操作时间</span>
 | |
|             <el-date-picker
 | |
|               size="small"
 | |
|               v-model="searchObj.createTimeStart"
 | |
|               placeholder="开始日期"
 | |
|               @change="page.current = 1, getList()"
 | |
|               value-format="yyyy-MM-dd" />
 | |
|             <el-date-picker
 | |
|               size="small"
 | |
|               v-model="searchObj.createTimeEnd"
 | |
|               placeholder="结束日期"
 | |
|               @change="page.current = 1, getList()"
 | |
|               value-format="yyyy-MM-dd" />
 | |
|           </el-row> -->
 | |
|         </template>
 | |
|         <template slot="right">
 | |
|           <el-input placeholder="输入公文名称/编号"
 | |
|                     v-model="searchObj.name"
 | |
|                     size="small"
 | |
|                     @change="(page.current = 1), getList()"
 | |
|                     clearable
 | |
|                     prefix-icon="iconfont iconSearch"/>
 | |
|         </template>
 | |
|       </ai-search-bar>
 | |
|       <ai-search-bar class="mt10">
 | |
|         <template slot="left">
 | |
|           <el-button type="primary" icon="iconfont iconAdd" @click="toAdd({})"
 | |
|           >添加
 | |
|           </el-button
 | |
|           >
 | |
|         </template>
 | |
|       </ai-search-bar>
 | |
|       <ai-table
 | |
|           :tableData="tableData"
 | |
|           :col-configs="colConfigs"
 | |
|           :total="page.total"
 | |
|           ref="aitableex"
 | |
|           :current.sync="page.current"
 | |
|           row-key="id"
 | |
|           default-expand-all
 | |
|           :tree-props="{ children: 'merchandiseList' }"
 | |
|           :size.sync="page.size"
 | |
|           @getList="getList"
 | |
|           @selection-change="handleSelectionChange"
 | |
|       >
 | |
|         <el-table-column slot="selection" type="selection" width="55"></el-table-column>
 | |
|         <el-table-column slot="options" label="操作" align="center" width="200">
 | |
|           <template slot-scope="{ row }">
 | |
|             <el-button v-if="row.status != 0" type="text" @click="goDetail(row)">详情</el-button>
 | |
|             <el-button v-if="row.status == 0" type="text" @click="toAdd(row)">编辑</el-button>
 | |
|             <el-button type="text" @click="del(row)">删除</el-button>
 | |
|           </template>
 | |
|         </el-table-column>
 | |
|       </ai-table>
 | |
|     </template>
 | |
|   </ai-list>
 | |
| </template>
 | |
| 
 | |
| <script>
 | |
| export default {
 | |
|   name: "management",
 | |
|   props: {
 | |
|     instance: Function,
 | |
|     dict: Object,
 | |
|     permissions: Function,
 | |
|     areaId: String,
 | |
|   },
 | |
|   data() {
 | |
|     return {
 | |
|       searchObj: {
 | |
|         documentType: '',
 | |
|         confidentialityLevel: '',
 | |
|         readType: '',
 | |
|         createTimeStart: null,
 | |
|         createTimeEnd: null,
 | |
|         name: '',
 | |
|       },
 | |
|       page: {
 | |
|         size: 10,
 | |
|         current: 1,
 | |
|         total: 0,
 | |
|       },
 | |
|       tableData: [],
 | |
|       shopList: [],
 | |
|       ids: [],
 | |
|     };
 | |
|   },
 | |
|   computed: {
 | |
|     colConfigs() {
 | |
|       return [
 | |
|         {slot: "selection", label: "", align: "center"},
 | |
|         {
 | |
|           prop: "documentCode",
 | |
|           label: "公文编号",
 | |
|           width: 120,
 | |
|           align: "center",
 | |
|         },
 | |
|         {
 | |
|           prop: "documentName",
 | |
|           label: "公文名称",
 | |
|         },
 | |
|         {
 | |
|           prop: "documentType",
 | |
|           label: "公文类型",
 | |
|           width: 120,
 | |
|           align: "center",
 | |
|           formart: (documentType) =>
 | |
|               this.$dict.getLabel("officialDocumentName", documentType),
 | |
|         },
 | |
|         {
 | |
|           prop: "readType",
 | |
|           label: "阅示类型",
 | |
|           width: 120,
 | |
|           align: "center",
 | |
|           formart: (readType) =>
 | |
|               this.$dict.getLabel("officialDocumentReadType", readType),
 | |
|         },
 | |
|         {
 | |
|           prop: "confidentialityLevel",
 | |
|           label: "保密等级",
 | |
|           width: 120,
 | |
|           align: "center",
 | |
|           formart: (confidentialityLevel) =>
 | |
|               this.$dict.getLabel("officialDocumentConfidentialityLevel", confidentialityLevel),
 | |
|         },
 | |
|         {
 | |
|           prop: "flowUserName",
 | |
|           label: "当前流转对象",
 | |
|           width: 180,
 | |
|           align: "center",
 | |
|         },
 | |
|         {
 | |
|           prop: "status",
 | |
|           label: "流转状态",
 | |
|           width: 120,
 | |
|           align: "center",
 | |
|           render: (h, {row}) => {
 | |
|             return h('span', {style: {color: this.dict.getColor('documentStatus', row.status)}}, this.dict.getLabel('documentStatus', row.status))
 | |
|           },
 | |
|         },
 | |
|         {
 | |
|           prop: "createTime",
 | |
|           label: "操作时间",
 | |
|           width: 180,
 | |
|           align: "center",
 | |
|         },
 | |
|         {
 | |
|           prop: "createUserName",
 | |
|           label: "操作人",
 | |
|           width: 120,
 | |
|           align: "center",
 | |
|         },
 | |
|         {slot: "options", label: "操作"},
 | |
|       ];
 | |
|     },
 | |
|   },
 | |
|   mounted() {
 | |
|     this.dict.load('officialDocumentName', 'officialDocumentConfidentialityLevel', 'officialDocumentReadType', 'documentStatus').then(() => {
 | |
|       this.$nextTick(() => this.getList())
 | |
|     })
 | |
|   },
 | |
|   methods: {
 | |
|     changeTime() {
 | |
|       this.page.current = 1
 | |
|       this.getList()
 | |
|     },
 | |
|     getList() {
 | |
|       this.instance.post(`/app/appofficialdocumentinfo/list`, null, {
 | |
|         params: {
 | |
|           ...this.searchObj,
 | |
|           ...this.page
 | |
|         },
 | |
|       }).then((res) => {
 | |
|         if (res.code == 0) {
 | |
|           this.tableData = res.data.records;
 | |
|           this.tableData.map((item) => {
 | |
|             if (item.createTime) {
 | |
|               item.createTime = item.createTime.substring(0, 10)
 | |
|             } else {
 | |
|               item.createTime = '-'
 | |
|             }
 | |
|           })
 | |
|           this.page.total = res.data.total;
 | |
|         }
 | |
|       });
 | |
|     },
 | |
|     reset() {
 | |
|       Object.keys(this.searchObj).forEach((e) => {
 | |
|         this.searchObj[e] = "";
 | |
|       });
 | |
|       this.searchObj.createTimeStart = null;
 | |
|       this.searchObj.createTimeEnd = null;
 | |
|       this.getList();
 | |
|     },
 | |
|     toAdd(params) {
 | |
|       this.$emit('change', {
 | |
|         type: 'add',
 | |
|         params: params
 | |
|       })
 | |
|     },
 | |
|     goDetail(row) {
 | |
|       this.$emit('change', {
 | |
|         type: 'detail',
 | |
|         params: {
 | |
|           ...row
 | |
|         }
 | |
|       })
 | |
|     },
 | |
|     del(item) {
 | |
|       this.$confirm("删除后不可恢复,是否要删除该公文?", {
 | |
|         type: 'error'
 | |
|       }).then(() => {
 | |
|         this.instance
 | |
|         .post(`/app/appofficialdocumentinfo/delete?ids=${item.id}`)
 | |
|         .then((res) => {
 | |
|           if (res.code == 0) {
 | |
|             this.$message.success("删除成功!");
 | |
|             this.getList();
 | |
|           }
 | |
|         });
 | |
|       });
 | |
|     },
 | |
|     handleSelectionChange(val) {
 | |
|       this.ids = [];
 | |
|       val.forEach(e => {
 | |
|         this.ids.push(e.id)
 | |
|       })
 | |
|     }
 | |
|   },
 | |
| };
 | |
| </script>
 | |
| 
 | |
| <style lang="scss" scoped>
 | |
| .AppDispatchManagement {
 | |
|   height: 100%;
 | |
|   overflow: auto;
 | |
|   background: #f3f6f9;
 | |
| 
 | |
|   ::v-deep .el-range-editor--small.el-input__inner {
 | |
|     width: 258px;
 | |
|   }
 | |
| 
 | |
|   ::v-deep .dateRange {
 | |
|     .dateLabel {
 | |
|       height: 32px;
 | |
|       border: 1px solid #D0D4DC;
 | |
|       line-height: 32px;
 | |
|       padding: 0 8px;
 | |
|       background: #F5F5F5;
 | |
|     }
 | |
| 
 | |
|     .el-input__inner {
 | |
|       border-radius: 0;
 | |
|       transform: translateX(-1px);
 | |
|     }
 | |
|   }
 | |
| 
 | |
|   .iconfont {
 | |
|     cursor: pointer;
 | |
|     margin-right: 8px;
 | |
|   }
 | |
| 
 | |
|   .iconCorrect {
 | |
|     color: #53b43b;
 | |
|   }
 | |
| 
 | |
|   .iconReject {
 | |
|     color: #e75555;
 | |
|     padding: 0 8px;
 | |
|   }
 | |
| }
 | |
| </style>
 |