|
@@ -0,0 +1,266 @@
|
|
|
|
+<template>
|
|
|
|
+ <a-card :bordered="false">
|
|
|
|
+ <div class="table-page-search-wrapper">
|
|
|
|
+ <a-form layout="inline">
|
|
|
|
+ <a-row :gutter="48">
|
|
|
|
+ <a-col :span="6">
|
|
|
|
+ <a-form-item label="考评项目名称">
|
|
|
|
+ <a-input allowClear v-model.trim="queryParam.name" placeholder="请输入企业名称" />
|
|
|
|
+ </a-form-item>
|
|
|
|
+ </a-col>
|
|
|
|
+ <a-col :span="6">
|
|
|
|
+ <a-form-item label="启用状态">
|
|
|
|
+ <v-select ref="status" allowClear placeholder="状态" v-model="queryParam.status" code="CHECK_ENABLE_STATE"></v-select>
|
|
|
|
+ </a-form-item>
|
|
|
|
+ </a-col>
|
|
|
|
+ <a-col :span="6">
|
|
|
|
+ <a-button type="primary" style="margin-right: 10px;" @click="$refs.table.refresh(true)">查询</a-button>
|
|
|
|
+ <a-button type="" @click="reset">重置</a-button>
|
|
|
|
+ </a-col>
|
|
|
|
+ </a-row>
|
|
|
|
+ </a-form>
|
|
|
|
+ </div>
|
|
|
|
+ <a-divider />
|
|
|
|
+ <div class="table-operator">
|
|
|
|
+ <a-button type="primary" icon="plus" @click="openModal">新建</a-button>
|
|
|
|
+ </div>
|
|
|
|
+ <s-table
|
|
|
|
+ ref="table"
|
|
|
|
+ size="default"
|
|
|
|
+ :rowKey="(record) => record.id"
|
|
|
|
+ :columns="columns"
|
|
|
|
+ :data="loadData"
|
|
|
|
+ bordered>
|
|
|
|
+ <!-- 操作 -->
|
|
|
|
+ <template slot="action" slot-scope="text, record">
|
|
|
|
+ <a-icon type="edit" class="actionBtn blue" v-if="record.status == '0'" @click="openModal(record)" />
|
|
|
|
+ <a-icon type="delete" class="actionBtn red" v-if="record.status == '0'" @click="delect(record)" />
|
|
|
|
+ <a-icon type="setting" class="actionBtn orange" @click="handleSet(record)" />
|
|
|
|
+ </template>
|
|
|
|
+ <!-- 启用禁用 -->
|
|
|
|
+ <template slot="enable" slot-scope="text, row">
|
|
|
|
+ <a-switch checkedChildren="已启用" unCheckedChildren="已禁用" v-model="row.status" @change="changeFlagHandle(text, row)"/>
|
|
|
|
+ </template>
|
|
|
|
+ </s-table>
|
|
|
|
+ <!-- 新增/编辑 弹窗 -->
|
|
|
|
+ <add-evaModal :itemId="itemId" :visible="openAddModal" @refresh="$refs.table.refresh()" @close="openAddModal=false"></add-evaModal>
|
|
|
|
+ <!-- 设置弹窗 -->
|
|
|
|
+ <!-- <set-evaModal :itemId="itemId" :visible="openSetting" @refresh="$refs.table.refresh()" @close="openSetting=false"></set-evaModal> -->
|
|
|
|
+ </a-card>
|
|
|
|
+
|
|
|
|
+</template>
|
|
|
|
+
|
|
|
|
+<script>
|
|
|
|
+import {
|
|
|
|
+ STable,
|
|
|
|
+ VSelect
|
|
|
|
+} from '@/components'
|
|
|
|
+import {
|
|
|
|
+ getTenantsList,
|
|
|
|
+ enable
|
|
|
|
+} from '@/api/tenants.js'
|
|
|
|
+import addEvaModal from './AddEvaModal.vue'
|
|
|
|
+// import setEvaModal from './SetEvaModal.vue'
|
|
|
|
+import moment from 'moment'
|
|
|
|
+export default {
|
|
|
|
+ name: 'EvaluationPlanList',
|
|
|
|
+ components: {
|
|
|
|
+ STable,
|
|
|
|
+ VSelect,
|
|
|
|
+ addEvaModal
|
|
|
|
+ // setEvaModal
|
|
|
|
+ },
|
|
|
|
+ data () {
|
|
|
|
+ return {
|
|
|
|
+ moment,
|
|
|
|
+ pageNo: 1,
|
|
|
|
+ pageSize: 10,
|
|
|
|
+ openAddModal: false, // 打开新增弹窗
|
|
|
|
+ openSetting: false, // 打开设置弹窗
|
|
|
|
+ itemId: '', // 要编辑的租户id
|
|
|
|
+ // 查询参数
|
|
|
|
+ queryParam: {
|
|
|
|
+ name: '',
|
|
|
|
+ contactPhone: '',
|
|
|
|
+ status: '' // 状态
|
|
|
|
+ },
|
|
|
|
+ // 表头
|
|
|
|
+ columns: [{
|
|
|
|
+ title: '序号',
|
|
|
|
+ dataIndex: 'no',
|
|
|
|
+ width: '40',
|
|
|
|
+ align: 'center'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '考评方案名称',
|
|
|
|
+ dataIndex: 'name',
|
|
|
|
+ align: 'center'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '考评方案说明',
|
|
|
|
+ dataIndex: 'orgType',
|
|
|
|
+ width: '120',
|
|
|
|
+ align: 'center'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '适用模式',
|
|
|
|
+ width: '120',
|
|
|
|
+ align: 'center',
|
|
|
|
+ dataIndex: 'contactPhone'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '状态',
|
|
|
|
+ width: '200',
|
|
|
|
+ align: 'center',
|
|
|
|
+ dataIndex: 'status',
|
|
|
|
+ scopedSlots: {
|
|
|
|
+ customRender: 'enable'
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '操作',
|
|
|
|
+ width: '200',
|
|
|
|
+ align: 'center',
|
|
|
|
+ scopedSlots: {
|
|
|
|
+ customRender: 'action'
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ ],
|
|
|
|
+ // 加载数据方法 必须为 Promise 对象
|
|
|
|
+ loadData: parameter => {
|
|
|
|
+ return getTenantsList(Object.assign(parameter, this.queryParam)).then(res => {
|
|
|
|
+ if (res.status == 200) {
|
|
|
|
+ const no = (res.data.pageNo - 1) * res.data.pageSize
|
|
|
|
+ for (let i = 0; i < res.data.list.length; i++) {
|
|
|
|
+ const _item = res.data.list[i]
|
|
|
|
+ _item.no = no + i + 1
|
|
|
|
+ _item.status = _item.status + '' === '1'
|
|
|
|
+ }
|
|
|
|
+ return res.data
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ beforeRouteEnter (to, from, next) {
|
|
|
|
+ next(vm => {
|
|
|
|
+ vm.$refs.table.refresh()
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ // 修改状态
|
|
|
|
+ changeFlagHandle (text, record) {
|
|
|
|
+ const _data = {
|
|
|
|
+ id: record.id,
|
|
|
|
+ status: record.status ? '1' : '0'
|
|
|
|
+ }
|
|
|
|
+ if (!record.expireDate && _data.status == '1') {
|
|
|
|
+ this.$message.success('请确认授权设置无误并点击【确定】后,再进行启用!')
|
|
|
|
+ record.status = !record.status
|
|
|
|
+ } else {
|
|
|
|
+ enable(_data).then(res => {
|
|
|
|
+ console.log(res.status)
|
|
|
|
+ if (res.status == '200') {
|
|
|
|
+ this.$message.success('修改成功')
|
|
|
|
+ this.$refs.table.refresh()
|
|
|
|
+ } else {
|
|
|
|
+ record.status = !record.status
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ // 打开新增弹窗
|
|
|
|
+ openModal (row) {
|
|
|
|
+ this.itemId = row ? row.id : ''
|
|
|
|
+ this.openAddModal = true
|
|
|
|
+ },
|
|
|
|
+ // 删除
|
|
|
|
+ delect (row) {
|
|
|
|
+ const _this = this
|
|
|
|
+ this.$confirm({
|
|
|
|
+ title: '警告',
|
|
|
|
+ content: '删除后无法恢复,确认删除?',
|
|
|
|
+ okText: '确定',
|
|
|
|
+ cancelText: '取消',
|
|
|
|
+ onOk () {
|
|
|
|
+ // deleteItem({
|
|
|
|
+ // id: row.id
|
|
|
|
+ // }).then(res => {
|
|
|
|
+ // if (res.status == 200) {
|
|
|
|
+ // _this.$message.success('删除成功')
|
|
|
|
+ // _this.$refs.table.refresh()
|
|
|
|
+ // }
|
|
|
|
+ // })
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ // 打开设置弹框
|
|
|
|
+ handleSet (row) {
|
|
|
|
+ this.openSetting = true
|
|
|
|
+ console.log(this.openSetting)
|
|
|
|
+ },
|
|
|
|
+ // 重置
|
|
|
|
+ reset () {
|
|
|
|
+ this.queryParam = {
|
|
|
|
+ name: '',
|
|
|
|
+ contactPhone: '',
|
|
|
|
+ status: '' // 状态
|
|
|
|
+ }
|
|
|
|
+ this.$refs.table.refresh()
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+</script>
|
|
|
|
+<style>
|
|
|
|
+ .table-page-search-wrapper,
|
|
|
|
+ .addButton {
|
|
|
|
+ margin-bottom: 0;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .table-page-search-wrapper .ant-form-inline .ant-form-item {
|
|
|
|
+ margin-bottom: 10px;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .textCount {
|
|
|
|
+ border: 1px solid #91d5ff;
|
|
|
|
+ background-color: #e6f7ff;
|
|
|
|
+ padding: 10px 0;
|
|
|
|
+ border-radius: 5px;
|
|
|
|
+ padding-left: 20px;
|
|
|
|
+ margin: 10px 0;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .action-button {
|
|
|
|
+ line-height: 40px;
|
|
|
|
+ white-space: nowrap;
|
|
|
|
+ padding: 5px 10px;
|
|
|
|
+ background-color: #1890ff;
|
|
|
|
+ border-radius: 4px;
|
|
|
|
+ color: #fff;
|
|
|
|
+ margin-right: 5px;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .menu-text {
|
|
|
|
+ background-color: #f90;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .actionBtn {
|
|
|
|
+ font-size: 20px;
|
|
|
|
+ padding: 0 10px;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .blue {
|
|
|
|
+ color: #1890FF;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .green {
|
|
|
|
+ color: #16b50e;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .red {
|
|
|
|
+ color: red;
|
|
|
|
+ }
|
|
|
|
+ .orange {
|
|
|
|
+ color: #ffaa00;
|
|
|
|
+ }
|
|
|
|
+</style>
|