老产品前端代码
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

403 lines
11 KiB

<template>
<div class="registerList resi-container">
<div v-show="formShow==='list'">
<el-card ref="searchCard"
class="search-card">
<el-form :inline="true"
:model="tableParams">
<div>
<el-form-item label="所属组织"
:label-width="labelWidth">
<el-cascader v-model="agencyIdArray"
filterable
style="width:480px"
:key="iscascaderShow"
:options="options"
:props="optionProps"
clearable></el-cascader>
</el-form-item>
<el-form-item label="问题分类"
:label-width="labelWidth">
<el-select v-model="tableParams.categoryCode"
placeholder="问题分类"
clearable>
<el-option v-for="item in categoryList"
:key="item.categoryCode"
:label="item.categoryName"
:value="item.categoryCode">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="标题"
:label-width="labelWidth">
<el-input v-model="tableParams.guideTitle"
placeholder="标题"
clearable>
</el-input>
</el-form-item>
<el-form-item style="margin-left:10px">
<el-button size="small"
@click="loadData()"
class="diy-button--search"
type="primary">查询</el-button>
<el-button style="margin-left:10px"
class="diy-button--reset"
size="small"
@click="resetSearch">重置</el-button>
</el-form-item>
<!-- <el-form-item v-if="isStaff"
style="margin-left:10px">
<el-button @click="add()"
type="primary">新增</el-button>
</el-form-item> -->
</div>
</el-form>
</el-card>
<el-card shadow="never">
<div v-if="isStaff"
class="resi-row-btn">
<el-button class="diy-button--add"
size="small"
@click="add">新增</el-button>
</div>
<c-table column-type="index"
class="resi-card-table"
ref="table"
:url="tableUrl"
:params="tableParams"
:operationWidth="80"
keyword="guidanceList"
:operations="operations"
columnAlign="center"
:tableHeight="tableHeight"
@detail="detail"
@edit="edit"
@confirmDel="confirmDel">
</c-table>
</el-card>
</div>
<el-card v-show="formShow==='edit'">
<add-form ref="ref_edit_form"
@cancleBack="cancleBack"
@refresh="loadData"></add-form>
</el-card>
<!-- <el-card v-show="formShow==='detail'"> -->
<detail-form v-show="formShow==='detail'"
ref="ref_detail_form"
@cancleBack="cancleBack"></detail-form>
<!-- </el-card> -->
</div>
</template>
<script>
import CTable from '@c/CTable'
import DetailForm from './DetailForm'
import addForm from './addForm'
import { mapGetters } from 'vuex'
import { Loading } from 'element-ui' // 引入Loading服务
import { requestPost } from '@/js/dai/request'
let loading // 加载动画
const customerId = localStorage.getItem('customerId')
export default {
data () {
return {
userId: '',
isStaff: false,
//查询条件标题宽度
labelWidth: '80px',
formShow: 'list',
optionProps: {
checkStrictly: true,
expandTrigger: 'hover',
value: 'agencyId',
label: 'agencyName',
children: 'subAgencyList',
},
options: [],
agencyIdArray: [],
iscascaderShow: 0,
categoryList: [],
// 列表相关
tableUrl: '/gov/voice/guide/list',
// tableUrl: 'http://yapi.elinkservice.cn/mock/102/gov/voice/guide/list',
tableParams: {
agencyId: '', //
categoryCode: '', //分类
guideTitle: '' //标题
},
operations: [
{
lable: '详情', // 按钮显示名称
size: 'small',
style: 'margin: 0 6px;',
type: 'text',
slot: '',
plain: false,
class: 'div-table-button--detail',
methodName: 'detail', // 回调方法名称
isShow: (row) => {
return true
}
},
{
lable: '修改', // 按钮显示名称
size: 'small',
style: 'margin: 0 6px;',
type: 'text',
slot: '',
plain: false,
class: 'div-table-button--edit',
methodName: 'edit', // 回调方法名称
isShow: (row) => {
// return true
if (row.createdId === this.userId) {
return true
} else {
return false
}
}
},
{
lable: '删除', // 按钮显示名称
size: 'small',
style: 'margin: 0 6px;',
type: 'text',
slot: '',
plain: false,
class: 'div-table-button--delete',
methodName: 'confirmDel', // 回调方法名称
isShow: (row) => {
if (row.createdId === this.userId) {
return true
} else {
return false
}
}
}
],
}
},
components: {
CTable,
DetailForm,
addForm
},
activated () {
this.$nextTick(() => {
this.$refs.table.doLayout() // 解决表格错位
})
},
mounted () {
this.initData()
console.log(customerId)
},
computed: {
tableHeight () {
const h = this.clientHeight - 360 + this.iframeHeigh
const _h = this.clientHeight - 360
return this.$store.state.inIframe ? h : _h
},
...mapGetters(['clientHeight', 'iframeHeight', 'env'])
},
methods: {
//重置搜索条件
resetSearch () {
this.tableParams.agencyId = ''
this.tableParams.categoryCode = ''
this.tableParams.guideTitle = ''
this.agencyIdArray = []
this.pageSize = 10
this.pageNo = 0
// this.loadTable()
},
async initData () {
this.startLoading()
await this.getAgencylist()//获取组织级别
await this.getcategory()//获取分类
await this.loadData()//获取指南列表
let roleList = localStorage.getItem('roleList')
this.userId = this.$store.state.user.id
console.log(this.userId)
if (roleList.indexOf('staff') > -1) {
this.isStaff = true
} else {
this.isStaff = true
}
this.endLoading()
},
agencyChange (item) {
if (item.length > 0) {
// this.tableParams.agencyId = item[item.length - 1]
}
},
loadData () {
if (this.agencyIdArray.length > 0) {
this.tableParams.agencyId = this.agencyIdArray[this.agencyIdArray.length - 1]
} else {
this.tableParams.agencyId = ''
}
this.$refs.table.loadData()
},
//新增
add () {
this.formShow = 'edit'
this.$refs['ref_edit_form'].initData("", "A")
},
// 详情
detail (row) {
// this.formShow = 'detail'
// this.$refs['ref_detail_form'].initData(row.guideId, "D")
this.formShow = 'edit'
this.$refs['ref_edit_form'].initData(row.guideId, "D")
},
edit (row) {
this.formShow = 'edit'
this.$refs['ref_edit_form'].initData(row.guideId, "U")
},
confirmDel (row) {
this.$confirm('确认删除当前指南', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(async () => {
this.del(row)
})
},
async del (row) {
const url = '/gov/voice/guide/del'
// const url = 'http://yapi.elinkservice.cn/mock/102/gov/voice/guidecategory/delete'
const params = {
guideId: row.guideId
}
const { data, code, msg } = await requestPost(url, params)
if (code === 0) {
this.$message.success("删除成功")
this.loadData()
} else {
this.$message.error(msg)
}
},
cancleBack () {
this.formShow = 'list'
},
async getAgencylist () {
const url = '/gov/org/customeragency/agencylist'
// const url = 'http://yapi.elinkservice.cn/mock/102/gov/org/agency/agencylist'
const params = {}
const { data, code, msg } = await requestPost(url, params)
if (code === 0) {
++this.iscascaderShow
this.options = []
this.agencyIdArray.length = []
this.options.push(data)
} else {
this.$message.error(msg)
}
},
async getcategory () {
const url = '/gov/voice/guidecategory/getcategory'
// const url = 'http://yapi.elinkservice.cn/mock/102/gov/voice/guidecategory/getcategory'
const params = {
queryOrigin: 'query'
}
const { data, code, msg } = await requestPost(url, params)
if (code === 0) {
this.categoryList = data
} else {
this.$message.error(msg)
}
},
// 开启加载动画
startLoading () {
loading = Loading.service({
lock: true, // 是否锁定
text: '正在加载……', // 加载中需要显示的文字
background: 'rgba(0,0,0,.7)' // 背景颜色
})
},
// 结束加载动画
endLoading () {
// clearTimeout(timer);
if (loading) {
loading.close()
}
}
}
}
</script>
<style lang="scss" scoped>
.myNote {
display: -webkit-box;
text-overflow: ellipsis;
overflow: hidden;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
.resi-container .resi-card-table {
::v-deep .el-table th {
color: #fff;
background-color: rgba(33, 149, 254, 1);
// border-right: 1px solid rgba(33, 149, 254, 1);
}
}
.resi-row-btn {
margin-bottom: 13px;
::v-deep .el-button {
// margin-left: 10px;
border: 0;
}
.el-button--success {
background: rgba(34, 193, 195, 1);
}
}
/* .register .el-table .el-table__header-wrapper {
position: absolute;
top: 0;
left: 0;
}*/
/*
.register .el-table .el-table__fixed-body-wrapper {
height: calc(100% - 44px);
margin-top: 44px;
overflow-y: auto !important;
} */
</style>