群众留言界面完成

This commit is contained in:
aixianling
2022-03-14 15:25:07 +08:00
parent dcbe39d228
commit cb2aa2c46a
4 changed files with 241 additions and 1 deletions

View File

@@ -6,7 +6,6 @@
"main": "lib/cw-webapps.common.js",
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lib": "vue-cli-service build --no-clean --target lib --dest lib packages/index.js&&npm unpublish --force&&npm publish",
"lib:core": "vue-cli-service build --target lib --dest core/dist core/index.js --name vc-app-core&&npm unpublish --force&&npm publish",
"lib:project": "node project/build.js",

View File

@@ -0,0 +1,35 @@
<template>
<section class="AppMassMessage">
<component :is="currentComponent" :instance="instance" :dict="dict" :permissions="permissions"/>
</section>
</template>
<script>
import PumDetail from "./mmDetail";
import PumList from "./mmList";
export default {
name: "AppMassMessage",
components: {PumList, PumDetail},
label: "群众留言",
props: {
instance: Function,
dict: Object,
permissions: Function
},
computed: {
currentComponent() {
return !!this.$route.query.id ? PumDetail : PumList
}
},
created() {
}
}
</script>
<style lang="scss" scoped>
.AppMassMessage {
height: 100%;
}
</style>

View File

@@ -0,0 +1,110 @@
<template>
<section class="mmDetail">
<ai-detail>
<ai-title slot="title" title="留言详情" isShowBottomBorder isShowBack @onBackClick="$router.push({query:{}})">
<template #rightBtn>
<el-button type="primary">回复留言</el-button>
<el-button>关闭留言</el-button>
</template>
</ai-title>
<template #content>
<el-form size="small">
<ai-card class="header">
<template #title>
<b v-text="detail.title||'标题'"/>
<el-row type="flex">
<el-form-item label="留言编号">{{ detail.createTime || "-" }}</el-form-item>
<el-form-item label="留言时间">{{ detail.createTime || "-" }}</el-form-item>
<el-form-item label="留言人">{{ detail.createUserName || "-" }}</el-form-item>
</el-row>
<ai-icon type="svg" :icon="statusImages[detail.status||0]"/>
</template>
<template #content>
<div v-html="detail.content"/>
</template>
</ai-card>
<ai-card title="沟通记录">
<template #content>
</template>
</ai-card>
</el-form>
</template>
</ai-detail>
</section>
</template>
<script>
export default {
name: "mmDetail",
props: {
instance: Function,
dict: Object,
permissions: Function
},
computed: {
statusImages() {
return {
0: "iconno_response",
1: "iconreplied",
2: "iconfinished"
}
}
},
data() {
return {
detail: {},
}
},
methods: {
getDetail() {
let {id} = this.$route.query
this.instance.post("/appportaluserenterprise/queryDetailById", null, {
params: {id}
}).then(res => {
if (res?.data) {
this.detail = res.data
}
})
},
},
created() {
this.getDetail()
}
}
</script>
<style lang="scss" scoped>
.mmDetail {
height: 100%;
::v-deep.header {
position: relative;
.el-form-item {
width: 33%;
}
.aibar {
height: auto;
.aibar-left {
width: 100%;
font-weight: normal;
}
b {
line-height: 56px;
}
}
.AiIcon {
position: absolute;
right: 0;
bottom: 0;
width: 80px;
height: 80px;
}
}
}
</style>

View File

@@ -0,0 +1,96 @@
<template>
<section class="mmList">
<ai-list>
<ai-title slot="title" title="群众留言" isShowBottomBorder/>
<template #content>
<ai-search-bar>
<template #left>
<ai-select v-model="search.type" placeholder="留言状态"/>
<ai-select v-model="search.type" placeholder="留言类型"/>
</template>
<template #right>
<el-input size="small" placeholder="搜索企业名称、法人姓名、登录账号" v-model="search.enterpriseName" clearable
@change="page.current=1,getTableData()"/>
</template>
</ai-search-bar>
<ai-table :tableData="tableData" :total="page.total" :current.sync="page.current" :size.sync="page.size"
@getList="getTableData" :col-configs="colConfigs" :dict="dict">
<el-table-column slot="options" label="操作" fixed="right" align="center">
<template slot-scope="{row}">
<el-button v-if="row.status==0" type="text" @click="handleEnable(row)">公示</el-button>
<el-button v-else-if="row.status==1" type="text" @click="handleEnable(row)">取消公示</el-button>
<el-button type="text" @click="showDetail(row.id)">详情</el-button>
</template>
</el-table-column>
</ai-table>
</template>
</ai-list>
</section>
</template>
<script>
import {mapState} from "vuex";
export default {
name: "mmList",
props: {
instance: Function,
dict: Object,
permissions: Function
},
computed: {
...mapState(['user'])
},
data() {
return {
search: {name: ""},
page: {current: 1, size: 10, total: 0},
tableData: [],
colConfigs: [
{label: "标题", prop: "enterpriseName"},
{label: "类型", prop: "enterpriseType", dict: "enterpriseType"},
{label: "内容", prop: "content"},
{label: "留言人", prop: "createUserName"},
{label: "留言提交时间", prop: "createTime"},
{label: "最后回复时间", prop: "loginAccount"},
{slot: "options"}
]
}
},
methods: {
getTableData() {
this.instance.post("/appportaluserenterprise/list", null, {
params: {...this.page, ...this.search, status: 1}
}).then(res => {
if (res?.data) {
this.tableData = res.data?.records
this.page.total = res.data.total
}
})
},
showDetail(id) {
this.$router.push({query: {id}})
},
handleEnable(row) {
let status = (Number(row.status) + 1) % 2
this.$confirm(`是否要${this.dict.getLabel('portalUserStatus', status)}留言?`).then(() => {
this.instance.post("/appportaluser/addOrUpdate", {...row, status}).then(res => {
if (res?.code == 0) {
this.$message.success(this.dict.getLabel('portalUserStatus', status) + "成功!")
this.getTableData()
}
})
}).catch(() => 0)
},
},
created() {
this.getTableData()
this.search.areaId = this.user.info.areaId
}
}
</script>
<style lang="scss" scoped>
.mmList {
}
</style>