jiangyy
5 years ago
4 changed files with 451 additions and 139 deletions
@ -0,0 +1,267 @@ |
|||
<template> |
|||
|
|||
<div :class="['div_sub_table',{'table2': tableType==='nosync'}]"> |
|||
<div class="span_sub_title">{{talbeTitle}}</div> |
|||
<el-button class="btn_sub" |
|||
type="primary" |
|||
size="mini" |
|||
@click="tableType==='sync'?delSubSure():syncSubSure()">{{btnName}}</el-button> |
|||
<el-table :height="subTabHeight" |
|||
ref="ref_table" |
|||
v-loading="dataListLoading" |
|||
:data="tableData" |
|||
border |
|||
style="width: 100%;" |
|||
@selection-change="handleSelectionChange"> |
|||
<el-table-column type="selection" |
|||
width="55"> |
|||
</el-table-column> |
|||
<el-table-column prop="tmplId" |
|||
label="公共模板ID" |
|||
header-align="left" |
|||
:min-width="150" |
|||
align="left"></el-table-column> |
|||
<el-table-column v-if="showCustomerTempId" |
|||
prop="personalTempId" |
|||
label="客户模板ID" |
|||
header-align="left" |
|||
:min-width="160" |
|||
align="left"></el-table-column> |
|||
<el-table-column prop="title" |
|||
label="标题" |
|||
header-align="left" |
|||
:min-width="120" |
|||
align="left"></el-table-column> |
|||
|
|||
<!-- <el-table-column prop="state" |
|||
label="状态" |
|||
header-align="left" |
|||
:min-width="80"> |
|||
<template slot-scope="scope"> |
|||
<span v-if="scope.row.state==='0'" |
|||
style="color: red">未同步</span> |
|||
<span v-else-if="scope.row.state==='1'">同步</span> |
|||
|
|||
</template> |
|||
</el-table-column> --> |
|||
|
|||
</el-table> |
|||
|
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { requestPost } from "@/js/dai/request"; |
|||
import { mapGetters } from 'vuex' |
|||
import { Loading } from 'element-ui' // 引入Loading服务 |
|||
|
|||
let loading // 加载动画 |
|||
export default { |
|||
data () { |
|||
return { |
|||
dataListLoading: false, |
|||
selCustomerId: '', |
|||
resiAppid: '', |
|||
workAppid: '', |
|||
tableData: [], |
|||
selList: [],//选中的list |
|||
title: "aaa" |
|||
} |
|||
}, |
|||
components: {}, |
|||
activated () { |
|||
this.$nextTick(() => { |
|||
this.$refs.table.doLayout() // 解决表格错位 |
|||
}) |
|||
}, |
|||
mounted () { |
|||
|
|||
}, |
|||
computed: { |
|||
subTabHeight () { |
|||
return this.clientHeight * 0.57 / 2 |
|||
}, |
|||
...mapGetters(['clientHeight', 'env']) |
|||
}, |
|||
methods: { |
|||
handleSelectionChange (val) { |
|||
this.selList = val |
|||
|
|||
}, |
|||
getSelTemplIdList () { |
|||
let selTempIdList = [] |
|||
this.selList.forEach(element => { |
|||
selTempIdList.push(element.tmplId) |
|||
}) |
|||
return selTempIdList |
|||
}, |
|||
getSelPersonalIdList () { |
|||
let personalIdList = [] |
|||
this.selList.forEach(element => { |
|||
personalIdList.push(element.personalId) |
|||
}) |
|||
return personalIdList |
|||
}, |
|||
|
|||
setTableData (tableData, selCustomerId, resiAppid, workAppid) { |
|||
this.tableData = tableData |
|||
this.selCustomerId = selCustomerId |
|||
this.workAppid = workAppid |
|||
this.resiAppid = resiAppid |
|||
}, |
|||
|
|||
//同步客户的订阅消息为默认订阅消息 |
|||
async syncSubSure (message, type) { |
|||
this.$confirm('确认同步客户的订阅消息', '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}).then(() => { |
|||
let selList = this.getSelTemplIdList() |
|||
if (selList.length === 0) { |
|||
this.$message.info("请选择要同步的模板") |
|||
} else { |
|||
console.log(selList) |
|||
this.syncSub(selList) |
|||
|
|||
} |
|||
|
|||
}).catch(() => { |
|||
|
|||
}) |
|||
}, |
|||
|
|||
//同步客户的订阅消息为默认订阅消息 |
|||
async delSubSure () { |
|||
this.$confirm('确认删除客户的订阅消息', '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}).then(() => { |
|||
let selList = this.getSelPersonalIdList() |
|||
if (selList.length === 0) { |
|||
this.$message.info("请选择要删除的模板") |
|||
} else { |
|||
this.delSub(selList) |
|||
} |
|||
|
|||
}).catch(() => { |
|||
}) |
|||
}, |
|||
|
|||
async syncSub (selList) { |
|||
this.startLoading() |
|||
// const url = 'https://nei.netease.com/api/apimock-v2/e3b1d0eb88e905f6c7ee559b2d6bb7ad/third/subscribe/init' |
|||
const url = 'https://epmet-cloud.elinkservice.cn/api/third/subscribe/init' |
|||
|
|||
let params = { |
|||
customerId: this.selCustomerId, |
|||
workAppId: this.workAppid, |
|||
resiAppId: this.resiAppid |
|||
} |
|||
|
|||
if (this.activeName === 'resi') { |
|||
params.resiTempIdList = selList |
|||
} else { |
|||
params.workTempIdList = selList |
|||
} |
|||
|
|||
const { data, code, msg, internalMsg } = await requestPost(url, params) |
|||
if (code === 0) { |
|||
this.$message.success('同步成功') |
|||
this.$emit('refresh') |
|||
|
|||
} else { |
|||
this.$message.error(msg + "：" + internalMsg) |
|||
} |
|||
this.endLoading() |
|||
|
|||
}, |
|||
async delSub (selList) { |
|||
this.startLoading() |
|||
// const url = 'https://nei.netease.com/api/apimock-v2/e3b1d0eb88e905f6c7ee559b2d6bb7ad/third/subscribe/delpersonaltemp' |
|||
const url = 'https://epmet-cloud.elinkservice.cn/api/third/subscribe/delpersonaltemp' |
|||
|
|||
let params = { |
|||
customerId: this.selCustomerId, |
|||
clientType: this.activeName, |
|||
tempIdList: selList |
|||
} |
|||
|
|||
const { data, code, msg, internalMsg } = await requestPost(url, params) |
|||
if (code === 0) { |
|||
this.$message.success('删除成功') |
|||
this.$emit('refresh') |
|||
|
|||
} else { |
|||
this.$message.error(msg + "：" + internalMsg) |
|||
} |
|||
this.endLoading() |
|||
|
|||
}, |
|||
|
|||
// 开启加载动画 |
|||
startLoading () { |
|||
loading = Loading.service({ |
|||
lock: true, // 是否锁定 |
|||
text: '正在加载……', // 加载中需要显示的文字 |
|||
background: 'rgba(0,0,0,.7)' // 背景颜色 |
|||
}) |
|||
}, |
|||
// 结束加载动画 |
|||
endLoading () { |
|||
// clearTimeout(timer); |
|||
if (loading) { |
|||
loading.close() |
|||
} |
|||
} |
|||
}, |
|||
props: { |
|||
//是否显示客户模板id |
|||
showCustomerTempId: { |
|||
type: Boolean, |
|||
default: true |
|||
}, |
|||
//列表类型 sync 已同步的 nosync 未同步的 |
|||
tableType: { |
|||
type: String, |
|||
default: 'sync' |
|||
}, |
|||
// |
|||
talbeTitle: { |
|||
type: String, |
|||
default: '已同步模板' |
|||
}, |
|||
// |
|||
btnName: { |
|||
type: String, |
|||
default: '删除订阅模板' |
|||
}, |
|||
activeName: { |
|||
type: String, |
|||
default: 'resi' |
|||
} |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
<style lang="css" > |
|||
.div_sub_table { |
|||
/* margin: 10px 10px; */ |
|||
position: relative; |
|||
} |
|||
.table2 { |
|||
margin-top: 20px; |
|||
} |
|||
.span_sub_title { |
|||
/* height: 30px; |
|||
line-height: 30px; */ |
|||
font-size: 16px; |
|||
padding: 5px 0 10px 0; |
|||
} |
|||
.btn_sub { |
|||
position: absolute; |
|||
right: 10px; |
|||
top: 0px; |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue