公众号设置

This commit is contained in:
yanran200730
2023-06-08 14:48:04 +08:00
parent fe9b1cd542
commit 4392aed3f6
3 changed files with 274 additions and 41 deletions

View File

@@ -0,0 +1,211 @@
<template>
<section class="AppSystemAccount">
<ai-list>
<ai-title slot="title" title="账号管理" isShowBottomBorder/>
<template #content>
<ai-search-bar>
<template #left>
<el-button type="primary" icon="iconfont iconAdd" @click="dialog=true">添加</el-button>
<!-- <el-button type="primary" :disabled="!ids.toString()" @click="batchAllot">功能分配</el-button>-->
</template>
<template #right>
<el-input size="small" placeholder="搜索姓名、手机号" v-model="search.condition" clearable
@change="page.pageNum=1,getTableData()"/>
</template>
</ai-search-bar>
<ai-table :tableData="tableData" :total="page.total" :current.sync="page.pageNum" :size.sync="page.pageSize"
@getList="getTableData" :col-configs="colConfigs" :dict="dict"
@selection-change="v=>ids=v.map(e=>e.id)">
<el-table-column slot="name" label="姓名" width="180px">
<el-row type="flex" align="middle" slot-scope="{row}">
<el-image class="avatar" :src="row.avatar" :preview-src-list="[row.avatar]">
<el-image slot="error" src="https://cdn.cunwuyun.cn/dvcp/h5/defaultAvatar.png" alt=""/>
</el-image>
<div>{{ row.name }}</div>
</el-row>
</el-table-column>
<el-table-column slot="options" align="center" label="操作" fixed="right" width="160px">
<el-row type="flex" justify="center" align="middle" slot-scope="{row}">
<el-button type="text" @click="appAllot(row)">功能分配</el-button>
<el-button type="text" @click="handleDelete(row.id)">删除</el-button>
</el-row>
</el-table-column>
</ai-table>
</template>
</ai-list>
<!--添加账号功能分配-->
<ai-dialog :title="dialogTitle" :visible.sync="dialog" width="600px" @open="initDialogData"
@onConfirm="updateAccount" @closed="dialogForm={}">
<el-form ref="updateAccountForm" :model="dialogForm" :rules="rules" size="small"
label-width="120px">
<el-form-item required label="姓名" prop="name">
<el-input v-model.trim="dialogForm.name" placeholder="请输入..." clearable
:maxLength="15"/>
</el-form-item>
<el-form-item required label="手机号码" prop="phone">
<el-input v-model.trim="dialogForm.phone" placeholder="请输入..." clearable
:maxLength="11" :disabled="isEdit"/>
</el-form-item>
<el-form-item required label="角色" prop="roleId">
<el-select size="small" placeholder="请选择角色" :value="dialogForm.roleId" filterable
v-model="dialogForm.roleId" clearable>
<el-option v-for="(op,i) in accountRoles" :key="i" :label="op.name" :value="op.id"/>
</el-select>
</el-form-item>
<el-form-item label="行政地区" prop="areaId">
<ai-area-get v-model="dialogForm.areaId" :instance="instance" @select="handleAreaSelect"/>
</el-form-item>
</el-form>
</ai-dialog>
</section>
</template>
<script>
import {mapState} from "vuex";
export default {
name: "AppSystemAccount",
label: "账号管理",
props: {
instance: Function,
dict: Object,
permissions: Function
},
computed: {
...mapState(['user']),
cascaderProps() {
return {
value: 'id',
checkStrictly: true,
emitPath: false
}
},
isEdit() {
return !!this.dialogForm.id
},
dialogTitle() {
return this.isEdit ? '功能分配' : '添加账号'
},
colConfigs() {
return [
// {type: 'selection', align: 'center'},
{label: "姓名", slot: "name"},
{label: "联系方式", prop: "phone", align: 'center'},
{label: "角色", prop: "roleName", align: 'center'},
{label: "地区", prop: "areaName"},
{slot: "options"}
]
},
rules() {
return {
name: [{required: true, message: "请填写姓名"}],
// organizationId: [{required: true, message: "请选择党组织"}],
// unitId: [{required: true, message: "请选择单位"}],
// areaId: [{required: true, message: '请选择地区', trigger: 'change'}],
roleId: [{required: true, message: "请选择角色"}],
phone: [{required: true, message: "请输入手机号码"}]
}
},
disabledLevel() {
return this.user.info.areaList?.length || 0
}
},
data() {
return {
accountRoles: [],
page: {pageNum: 1, pageSize: 10, total: 0},
dialog: false,
dialogForm: {},
tableData: [],
search: {condition: ""},
ids: []
}
},
methods: {
getTableData() {
this.instance.post("/admin/user/page", null, {
params: {...this.page, ...this.search}
}).then(res => {
if (res?.data) {
this.tableData = res.data?.records
this.page.total = res.data.total
}
})
},
initDialogData() {
//用于优化初始化数据
this.getAccountRoles()
},
getAccountRoles() {
this.accountRoles.length == 0 && this.instance.post("/admin/role/list-all").then(res => {
if (res?.data) {
this.accountRoles = res.data
}
})
},
batchAllot() {
this.dialog = true
this.dialogForm = {areaId: this.user.info.areaId, ids: this.ids}
},
appAllot(row) {
this.dialog = true
this.dialogForm = JSON.parse(JSON.stringify({
...row,
areaId: row.areaId || this.user.info.areaId
}));
},
// 修改
updateAccount() {
this.$refs.updateAccountForm.validate(v => {
if (v) {
this.instance.post("/admin/user/addOrEdit", this.dialogForm).then(res => {
if (res?.code == 0) {
this.dialog = false;
this.$message.success("提交成功")
this.getTableData();
} else {
this.$message.error(res?.msg)
}
})
}
})
},
handleDelete(ids) {
this.$confirm("是否要删除该账号?").then(() => {
this.instance.post("/admin/user/del", null, {
params: {ids}
}).then(res => {
if (res?.code == 0) {
this.getTableData();
this.$message.success("删除成功!");
}
})
}).catch(() => 0)
},
handleAreaSelect(v) {
this.dialogForm.areaName = v?.[0]?.label
}
},
created() {
this.getTableData()
}
}
</script>
<style lang="scss" scoped>
.AppSystemAccount {
height: 100%;
:deep( .avatar ){
width: 40px;
height: 40px;
margin-right: 10px;
}
:deep( .el-form ){
.el-cascader, .el-select {
width: 100%;
}
}
}
</style>

View File

@@ -10,7 +10,7 @@
</template> </template>
<template #right> <template #right>
<el-input <el-input
v-model="search.content" v-model="search.mpName"
size="small" size="small"
placeholder="请输入公众号名称" placeholder="请输入公众号名称"
clearable clearable
@@ -31,9 +31,9 @@
<el-table-column slot="options" label="操作" align="center" fixed="right" width="180"> <el-table-column slot="options" label="操作" align="center" fixed="right" width="180">
<template slot-scope="{ row }"> <template slot-scope="{ row }">
<div class="table-options"> <div class="table-options">
<el-button type="text" @click="remove(row.id)">编辑</el-button> <el-button type="text" @click="toEdit(row)">编辑</el-button>
<el-button type="text" @click="remove(row.id)">删除</el-button> <el-button type="text" @click="remove(row.id)">删除</el-button>
<el-button type="text" @click="remove(row.id)">结算金额</el-button> <el-button type="text" @click="change(row)">结算金额</el-button>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
@@ -43,22 +43,23 @@
width="890px" width="890px"
:title="id ? '编辑公众号设置' : '添加公众号设置'" :title="id ? '编辑公众号设置' : '添加公众号设置'"
@close="onClose" @close="onClose"
:close-on-click-modal="false"
@onConfirm="onConfirm"> @onConfirm="onConfirm">
<el-form ref="form" class="ai-form" :model="form" label-width="110px" label-position="right"> <el-form ref="form" class="ai-form" :model="form" label-width="110px" label-position="right">
<el-form-item label="公众号名称" style="width: 100%" prop="name" :rules="[{required: true, message: '请输入公众号名称', trigger: 'blur'}]"> <el-form-item label="公众号名称" style="width: 100%" prop="mpName" :rules="[{required: true, message: '请输入公众号名称', trigger: 'blur'}]">
<el-input v-model="form.name" size="small" placeholder="请输入公众号名称"></el-input> <el-input v-model="form.mpName" size="small" placeholder="请输入公众号名称"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="appid" style="width: 100%" prop="appid" :rules="[{required: true, message: '请输入appid', trigger: 'blur'}]"> <el-form-item label="appid" style="width: 100%" prop="appId" :rules="[{required: true, message: '请输入appid', trigger: 'blur'}]">
<el-input v-model="form.appid" size="small" placeholder="请输入appid"></el-input> <el-input v-model="form.appId" size="small" placeholder="请输入appid"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="secret" style="width: 100%" prop="secret" :rules="[{required: true, message: '请输入公众号密钥', trigger: 'blur'}]"> <el-form-item label="secret" style="width: 100%" prop="secret" :rules="[{required: true, message: '请输入公众号密钥', trigger: 'blur'}]">
<el-input v-model="form.secret" size="small" placeholder="请输入公众号密钥"></el-input> <el-input v-model="form.secret" size="small" placeholder="请输入公众号密钥"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="收益率" style="width: 100%" prop="rate" :rules="[{required: true, message: '请输入收益率', trigger: 'blur'}]"> <el-form-item label="收益率" style="width: 100%" prop="yield" :rules="[{required: true, message: '请输入收益率', trigger: 'blur'}]">
<el-input v-model="form.rate" size="small" placeholder="请输入收益率"></el-input> <el-input-number :precision="2" size="small" type="input" v-model="form.yield" :min="0" placeholder="请输入"></el-input-number>
</el-form-item> </el-form-item>
<el-form-item label="备注" style="width: 100%" prop="remarks" :rules="[{required: true, message: '请输入备注', trigger: 'blur'}]"> <el-form-item label="备注" style="width: 100%" prop="notes" :rules="[{required: true, message: '请输入备注', trigger: 'blur'}]">
<el-input v-model="form.remarks" size="small" placeholder="请输入备注"></el-input> <el-input v-model="form.notes" type="textarea" :rows="3" size="small" placeholder="请输入备注"></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
</ai-dialog> </ai-dialog>
@@ -69,8 +70,8 @@
@close="onClose" @close="onClose"
@onConfirm="onAmountConfirm"> @onConfirm="onAmountConfirm">
<el-form ref="amountForm" class="ai-form" :model="amountForm" label-width="90px" label-position="right"> <el-form ref="amountForm" class="ai-form" :model="amountForm" label-width="90px" label-position="right">
<el-form-item label="结算金额" style="width: 100%" prop="amount" :rules="[{required: true, message: '请输入结算金额', trigger: 'blur'}]"> <el-form-item label="结算金额" style="width: 100%" prop="settledAmount" :rules="[{required: true, message: '请输入结算金额', trigger: 'blur'}]">
<el-input-number v-model="amountForm.amount" :precision="2" :step="0.1" :max="10"></el-input-number> <el-input-number :precision="2" size="small" type="input" v-model="amountForm.settledAmount" :min="0" placeholder="请输入"></el-input-number>
</el-form-item> </el-form-item>
</el-form> </el-form>
</ai-dialog> </ai-dialog>
@@ -92,23 +93,23 @@
tableData: [], tableData: [],
isShow: false, isShow: false,
form: { form: {
name: '', mpName: '',
appid: '', notes: '',
secret: '', appId: '',
rate: '', yield: '',
remarks: '' secret: ''
}, },
amountForm: { amountForm: {
amount: '' settledAmount: ''
}, },
isShowAmount: false, isShowAmount: false,
colConfigs: [ colConfigs: [
{ prop: 'content', label: '公众号名称' }, { prop: 'mpName', label: '公众号名称' },
{ prop: 'createUserName', label: 'appid', align: 'center' }, { prop: 'appId', label: 'appid', align: 'center' },
{ prop: 'createTime', label: 'secret', align: 'center' }, { prop: 'secret', label: 'secret', align: 'center' },
{ prop: 'createUserName', label: '收益率', align: 'center' }, { prop: 'yield', label: '收益率', align: 'center' },
{ prop: 'createTime', label: '已结算金额(元)', align: 'center' }, { prop: 'settledAmount', label: '已结算金额(元)', align: 'center' },
{ prop: 'createUserName', label: '备注', align: 'center' } { prop: 'notes', label: '备注', align: 'center' }
], ],
search: { search: {
size: 10, size: 10,
@@ -125,7 +126,7 @@
methods: { methods: {
getList () { getList () {
this.instance.post(`/app/applearningquestion/list`, null, { this.instance.post(`/wxmpconfig/list`, null, {
params: { params: {
...this.search ...this.search
} }
@@ -137,24 +138,41 @@
}) })
}, },
toEdit (e) {
this.id = e.id
this.form.notes = e.notes
this.form.appId = e.appId
this.form.yield = e.yield
this.form.secret = e.secret
this.form.mpName = e.mpName
this.isShow = true
},
change (e) {
this.id = e.id
this.amountForm.settledAmount = e.settledAmount
this.isShowAmount = true
},
onClose () { onClose () {
this.id = '' this.form.notes = ''
this.form.files = [] this.form.appId = ''
this.form.videoName = '' this.form.yield = ''
this.form.videoIntroduction = '' this.form.secret = ''
this.form.videoFileUrl = '' this.form.mpName = ''
this.form.videoFileId = '' this.amountForm.settledAmount = ''
this.form.imageFileUrl = '' this.isShowAmount = false
this.form.imageFileId = ''
this.isShow = false this.isShow = false
}, },
onAmountConfirm () { onAmountConfirm () {
this.$refs.amountForm.validate((valid) => { this.$refs.amountForm.validate((valid) => {
if (valid) { if (valid) {
this.instance.post(`/app/appvideoinfo/addOrUpdate`, { this.instance.post(`/wxmpconfig/updateSettledAmount`, null, {
...this.amountForm, params: {
id: this.id ...this.amountForm,
id: this.id
}
}).then(res => { }).then(res => {
if (res.code == 0) { if (res.code == 0) {
this.$message.success('提交成功!') this.$message.success('提交成功!')
@@ -170,7 +188,7 @@
onConfirm () { onConfirm () {
this.$refs.form.validate((valid) => { this.$refs.form.validate((valid) => {
if (valid) { if (valid) {
this.instance.post(`/app/appvideoinfo/addOrUpdate`, { this.instance.post(`/wxmpconfig/addOrUpdate`, {
...this.form, ...this.form,
id: this.id || '' id: this.id || ''
}).then(res => { }).then(res => {
@@ -187,7 +205,7 @@
remove (id) { remove (id) {
this.$confirm('删除后不可恢复,确定删除该数据?').then(() => { this.$confirm('删除后不可恢复,确定删除该数据?').then(() => {
this.instance.post(`/app/applearningquestion/deleteQuestion?id=${id}`).then(res => { this.instance.post(`/wxmpconfig/delete?ids=${id}`).then(res => {
if (res.code == 0) { if (res.code == 0) {
this.$message.success('删除成功!') this.$message.success('删除成功!')
this.getList() this.getList()

View File

@@ -1,6 +1,6 @@
<template> <template>
<section class="ai-dialog__wrapper"> <section class="ai-dialog__wrapper">
<el-dialog custom-class="ai-dialog" v-on="$listeners" v-bind="$attrs" :visible.sync="dialog"> <el-dialog custom-class="ai-dialog" v-on="$listeners" v-bind="$attrs" :destroy-on-close="destroyOnclose" :visible.sync="dialog">
<div class="ai-dialog__header fill" slot="title" v-text="title"/> <div class="ai-dialog__header fill" slot="title" v-text="title"/>
<div class="ai-dialog__content"> <div class="ai-dialog__content">
<div class="ai-dialog__content--wrapper pad-r8"> <div class="ai-dialog__content--wrapper pad-r8">
@@ -30,7 +30,11 @@ export default {
visible: Boolean, visible: Boolean,
title: {type: String, default: ''}, title: {type: String, default: ''},
customFooter: Boolean, customFooter: Boolean,
isDrag: {type: Boolean, default: true} isDrag: {type: Boolean, default: true},
destroyOnclose: {
type: Boolean,
default: true
}
}, },
data() { data() {
return { return {