149 lines
5.1 KiB
Vue
149 lines
5.1 KiB
Vue
|
<template>
|
||
|
|
<div class="app-container">
|
||
|
|
<el-form label-width="100px">
|
||
|
|
<el-row>
|
||
|
|
<el-col :span="6">
|
||
|
|
<el-form-item label="相关方名称">
|
||
|
|
<el-input v-model="XGF_NAME" placeholder="相关方名称"/>
|
||
|
|
</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
<el-col :span="6">
|
||
|
|
<el-form-item label="申请时间">
|
||
|
|
<el-date-picker
|
||
|
|
v-model="dates"
|
||
|
|
type="daterange"
|
||
|
|
range-separator="至"
|
||
|
|
start-placeholder="开始日期"
|
||
|
|
end-placeholder="结束日期"
|
||
|
|
value-format="yyyy-MM-dd"
|
||
|
|
style="width: 100%;"
|
||
|
|
/>
|
||
|
|
</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
<el-col :span="6">
|
||
|
|
<el-form-item label="申请状态">
|
||
|
|
<el-select v-model="AUDIT_STATUS" placeholder="请选择申请状态" clearable >
|
||
|
|
<el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value" />
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
<el-col :span="4">
|
||
|
|
<el-form-item label-width="10px">
|
||
|
|
<el-button v-waves class="filter-item" type="primary" icon="el-icon-search" @click="getQuery">
|
||
|
|
搜索
|
||
|
|
</el-button>
|
||
|
|
<el-button v-waves class="filter-item" type="success" icon="el-icon-refresh" @click="goKeyReset">
|
||
|
|
重置
|
||
|
|
</el-button>
|
||
|
|
</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
</el-row>
|
||
|
|
</el-form>
|
||
|
|
<el-table ref="multipleTable" :data="varList" :header-cell-style="{'font-weight': 'bold','color': '#000'}" tooltip-effect="dark" border fit highlight-current-row>
|
||
|
|
<el-table-column type="selection" width="55" align="center" />
|
||
|
|
<el-table-column type="index" label="序号" width="50" align="center" />
|
||
|
|
<el-table-column prop="RELEVANT_UNIT_NAME" label="相关方" />
|
||
|
|
<el-table-column prop="CREATTIME" label="申请时间" />
|
||
|
|
<el-table-column prop="CREATOR" label="申请人员" />
|
||
|
|
<el-table-column prop="NAME" label="姓名" />
|
||
|
|
<el-table-column prop="DEPARTMENT_NAME" label="部门" />
|
||
|
|
<el-table-column prop="AUDIT_STATUS" label="申请状态" >
|
||
|
|
<template slot-scope="{row}">
|
||
|
|
<span v-if="row.AUDIT_STATUS === 0">申请中</span>
|
||
|
|
<span v-if="row.AUDIT_STATUS === 1">申请通过</span>
|
||
|
|
<span v-if="row.AUDIT_STATUS === -1">申请打回</span>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column prop="START_TIME" label="服务开始时间" />
|
||
|
|
<el-table-column prop="END_TIME" label="服务结束时间" />
|
||
|
|
<el-table-column label="操作" align="center" width="200">
|
||
|
|
<template slot-scope="{row}">
|
||
|
|
<el-button v-if="row.AUDIT_STATUS === 0" type="success" icon="el-icon-edit" size="mini" @click="handleAudit(row.STOPSERVERLOG_ID,row.SERVICE_COMPANY_USER_MAP_ID)">审核</el-button>
|
||
|
|
<el-button type="success" icon="el-icon-edit" size="mini" @click="handleShow(row.USER_ID)">查看</el-button>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
</el-table>
|
||
|
|
<div class="page-btn-group">
|
||
|
|
<div/>
|
||
|
|
<pagination :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit" @pagination="getList" />
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<users ref="users"/>
|
||
|
|
<audit ref="audit" @finish="getQuery"/>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import Pagination from '@/components/Pagination' // 通过 el-pagination二次打包
|
||
|
|
import { requestFN } from '@/utils/request'
|
||
|
|
import waves from '@/directive/waves' // waves directive
|
||
|
|
import audit from './audit'
|
||
|
|
import users from './users'
|
||
|
|
export default {
|
||
|
|
components: { Pagination, audit, users },
|
||
|
|
directives: { waves },
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
listQuery: {
|
||
|
|
page: 1,
|
||
|
|
limit: 20
|
||
|
|
},
|
||
|
|
total: 0,
|
||
|
|
varList: [],
|
||
|
|
XGF_NAME: '',
|
||
|
|
dates: [],
|
||
|
|
statusList: [{ value: 0, label: '申请中' }, { value: 1, label: '申请通过' }, { value: -1, label: '申请打回' }],
|
||
|
|
AUDIT_STATUS: ''
|
||
|
|
}
|
||
|
|
},
|
||
|
|
created() {
|
||
|
|
this.getList()
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
getQuery() {
|
||
|
|
this.$refs.multipleTable.clearSelection()
|
||
|
|
this.listQuery = {
|
||
|
|
page: 1,
|
||
|
|
limit: 20
|
||
|
|
}
|
||
|
|
this.getList()
|
||
|
|
},
|
||
|
|
goKeyReset() {
|
||
|
|
this.date = []
|
||
|
|
this.XGF_NAME = ''
|
||
|
|
this.AUDIT_STATUS = ''
|
||
|
|
this.dates = ''
|
||
|
|
this.getQuery()
|
||
|
|
},
|
||
|
|
getList() {
|
||
|
|
this.listLoading = true
|
||
|
|
requestFN(
|
||
|
|
'/stopServer/list?showCount=' + this.listQuery.limit + '¤tPage=' + this.listQuery.page,
|
||
|
|
{
|
||
|
|
XGF_NAME: this.XGF_NAME,
|
||
|
|
STARTTIME: this.dates[0],
|
||
|
|
ENDTIME: this.dates[1],
|
||
|
|
AUDIT_STATUS: this.AUDIT_STATUS
|
||
|
|
}
|
||
|
|
).then((data) => {
|
||
|
|
this.listLoading = false
|
||
|
|
this.varList = data.varList
|
||
|
|
this.total = data.page.totalResult
|
||
|
|
})
|
||
|
|
.catch((e) => {
|
||
|
|
this.listLoading = false
|
||
|
|
})
|
||
|
|
},
|
||
|
|
|
||
|
|
handleAudit(STOPSERVERLOG_ID, SERVICE_COMPANY_USER_MAP_ID) {
|
||
|
|
this.$refs.audit.init({ STOPSERVERLOG_ID, SERVICE_COMPANY_USER_MAP_ID })
|
||
|
|
},
|
||
|
|
|
||
|
|
handleShow(USER_ID) {
|
||
|
|
this.$refs.users.init(USER_ID)
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|