281 lines
7.3 KiB
Vue
281 lines
7.3 KiB
Vue
<template>
|
|
<div class="root">
|
|
<div class="search-area">
|
|
<el-form :modal="searchForm" :inline="true" class="label-input-form">
|
|
<el-form-item label="核查清单名称" class="search-item">
|
|
<el-input
|
|
v-model="searchForm.checkListName"
|
|
placeholder="请输入"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="标准编号/政策文号" class="search-item">
|
|
<el-input
|
|
v-model="searchForm.lawCode"
|
|
placeholder="请输入"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="标准名称/政策名称" class="search-item">
|
|
<el-input
|
|
v-model="searchForm.lawName"
|
|
placeholder="请输入"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item class="search-item btn-box">
|
|
<el-button
|
|
v-btn-permission="'23e01cb6ac6bfcedd39537f236a769e5'"
|
|
type="primary"
|
|
class="common-button-primary"
|
|
size="small"
|
|
@click="onSearch"
|
|
>
|
|
查询
|
|
</el-button>
|
|
</el-form-item>
|
|
<el-form-item class="search-item btn-box">
|
|
<el-button
|
|
v-btn-permission="'41945d15f5cb658665ef4916f62354a2'"
|
|
class="common-button-default"
|
|
size="small"
|
|
@click="onClear"
|
|
>
|
|
清空
|
|
</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
</div>
|
|
<div class="action-bar">
|
|
<el-button
|
|
v-btn-permission="'226bcb0d4d1b5767183d51186f24c57a'"
|
|
type="primary"
|
|
size="mini"
|
|
@click="add"
|
|
>
|
|
<i class="el-icon-plus" />新增
|
|
</el-button>
|
|
<el-button
|
|
v-btn-permission="''"
|
|
size="mini"
|
|
>
|
|
模板下载
|
|
</el-button>
|
|
<el-button
|
|
v-btn-permission="''"
|
|
size="mini"
|
|
>
|
|
导入
|
|
</el-button>
|
|
<el-button
|
|
v-btn-permission="''"
|
|
size="mini"
|
|
>
|
|
导出
|
|
</el-button>
|
|
<el-button
|
|
v-btn-permission="'bdc3bb8549669702642f86aa4323c568'"
|
|
size="mini"
|
|
>
|
|
批量删除
|
|
</el-button>
|
|
<el-button
|
|
v-btn-permission="''"
|
|
size="mini"
|
|
>
|
|
流程下发
|
|
</el-button>
|
|
</div>
|
|
<div class="container">
|
|
<el-table
|
|
ref="selection"
|
|
:data="data"
|
|
tooltip-effect="dark"
|
|
style="width:100%;height: calc(100% - 57px)"
|
|
height="string"
|
|
border
|
|
class="drag-table"
|
|
:header-cell-style="{background: '#e8e8e8', color: '#333333', fontSize: '16px', fontWeight: 'bold', height: '48px', padding: 0}"
|
|
:cell-style="{padding: 0}"
|
|
@sort-change="sortChange"
|
|
@selection-change="selectionChange"
|
|
>
|
|
<el-table-column
|
|
type="selection"
|
|
width="55"
|
|
align="center"
|
|
/>
|
|
<el-table-column
|
|
type="index"
|
|
width="55"
|
|
label="序号"
|
|
align="center"
|
|
>
|
|
<template slot-scope="{scope, column, $index}">
|
|
{{ ($index + 1) + (searchForm.page - 1) * searchForm.pageSize }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="checkListName"
|
|
label="核查清单名称"
|
|
align="center"
|
|
sortable="custom"
|
|
>
|
|
<template slot-scope="{row, column, $index}">
|
|
<a class="table-jump" style="color: #2d8cf0" @click="handlePreview(row.id)">{{ row.checkListName }}</a>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="createUserId"
|
|
label="创建人"
|
|
align="center"
|
|
sortable="custom"
|
|
/>
|
|
<el-table-column
|
|
prop="modifyTime"
|
|
label="更新时间"
|
|
align="center"
|
|
sortable="custom"
|
|
/>
|
|
<el-table-column
|
|
prop="processIssuanceTime"
|
|
label="流程下发时间"
|
|
align="center"
|
|
sortable="custom"
|
|
/>
|
|
<el-table-column
|
|
prop="processCompleteTime"
|
|
label="流程完成时间"
|
|
align="center"
|
|
sortable="custom"
|
|
/>
|
|
<el-table-column
|
|
prop="processNum"
|
|
label="流程编号"
|
|
align="center"
|
|
sortable="custom"
|
|
>
|
|
<template slot-scope="{row, column, $index}">
|
|
<a class="table-jump" style="color: #2d8cf0" @click="handlePreview(row.id)">{{ row.processNum }}</a>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="processStatus"
|
|
label="流程状态"
|
|
align="center"
|
|
sortable="custom"
|
|
/>
|
|
</el-table>
|
|
<pagination :page="searchForm.page" :total="searchForm.total" @pageChange="pageChange" @pageSizeChange="pageSizeChange" />
|
|
<loading :loading="loading">数据获取中...</loading>
|
|
</div>
|
|
<addModel ref="addModel" />
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import addModel from './addModel'
|
|
export default {
|
|
name: 'StandardTrackingList',
|
|
components: {
|
|
addModel
|
|
},
|
|
data () {
|
|
const searchForm = {
|
|
checkListName: '',
|
|
lawCode: '',
|
|
lawName: '',
|
|
page: 1,
|
|
pageSize: this.$store.getters.userInfo.configContent,
|
|
total: 0,
|
|
}
|
|
return {
|
|
searchForm,
|
|
initSearchForm: JSON.parse(JSON.stringify(searchForm)),
|
|
loading: false,
|
|
url: {
|
|
page: 'standardTrackingCheckList/page',
|
|
save: 'standardTrackingCheckList/save',
|
|
remove: 'standardTrackingCheckList/remove',
|
|
getById: 'standardTrackingCheckList/getById',
|
|
update: 'standardTrackingCheckList/update',
|
|
exportTrackingChecklist: 'standardTrackingCheckList/exportTrackingChecklist',
|
|
exportTemplateFile: 'standardTrackingCheckList/exportTemplateFile',
|
|
},
|
|
data: [],
|
|
selectedList: [],
|
|
}
|
|
},
|
|
created () {
|
|
this.getData()
|
|
},
|
|
methods: {
|
|
getData () {
|
|
const config = {
|
|
_this: this,
|
|
loading: 'loading'
|
|
}
|
|
this.$http._getData(this.url.page, this.searchForm, config).then(res => {
|
|
if(res.ok) {
|
|
this.data = res.data
|
|
}
|
|
})
|
|
},
|
|
pageChange (page) {
|
|
this.searchForm.page = page
|
|
this.getData()
|
|
},
|
|
pageSizeChange (pageSize) {
|
|
this.searchForm.pageSize = pageSize
|
|
this.getData()
|
|
},
|
|
onSearch () {
|
|
this.getData()
|
|
},
|
|
onClear () {
|
|
this.searchForm = JSON.parse(JSON.stringify(this.initSearchForm))
|
|
this.getData()
|
|
},
|
|
selectionChange (data) {
|
|
this.selectedList = []
|
|
for (let i = 0; i < data.length; i++) {
|
|
this.selectedList.push(data[i].id)
|
|
}
|
|
},
|
|
sortChange ({ column, prop, order }) {
|
|
this.searchForm.sortField = prop
|
|
this.searchForm.sortMode = 'asc'
|
|
if (order === 'descending') {
|
|
this.searchForm.sortMode = 'desc'
|
|
}
|
|
if (!order) {
|
|
this.searchForm.sortField = ''
|
|
this.searchForm.sortMode = ''
|
|
}
|
|
this.getData()
|
|
},
|
|
add () {
|
|
this.$refs.addModel.add()
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
.root{
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
.search-area {
|
|
.search-item /deep/ .el-button--small {
|
|
padding: 8px 15px !important;
|
|
height: 30px !important;
|
|
}
|
|
}
|
|
.action-bar /deep/ .el-button{
|
|
height: 32px !important;
|
|
}
|
|
.container {
|
|
flex: 1;
|
|
}
|
|
</style>
|