Commit fbae6ad4 authored by Zhang Xiaojie's avatar Zhang Xiaojie

UI:popconfirm修改为modal

parent c4845a96
......@@ -4,11 +4,17 @@ export enum addUser{
}
export enum modalType{
delete,
on,
off
delete,
on,
off,
}
export enum userModal{
enable, //启用
disable, //禁用
inJob, //在岗
offJob //不在岗
}
export enum deployLevel{
"一级分行",
"二级分行",
......
......@@ -16,14 +16,16 @@
</a-form-model-item>
<!-- 现属信息 -->
<a-form-model-item :label="'现属'+label[i-1]" v-for="i in level_org" :key="i.id" >
<span class=" text-sm text-black">fjhb</span>
<span class=" text-sm text-black">{{i}}</span>
</a-form-model-item>
<a-form-model-item label="现地址">
<span class=" text-sm text-black">dc</span>
</a-form-model-item>
<!-- 调配级别 -->
<a-form-model-item label="选择调配级别">
<a-select class="w-200" @change="getDeployTo" placeholder="请选择调配级别">
<a-select class="w-200"
@change="getDeployTo"
placeholder="请选择调配级别">
<a-select-option v-for="(bank,i) in selectableDeployLevel"
:key="bank"
:value="i">
......@@ -34,14 +36,25 @@
<div v-if="showDeployInfo">
<!-- 调配信息 -->
<a-form-model-item :label="'调配'+selectableDeployLevel[form.deployTo]" >
<a-select :placeholder="'选择调配的'+selectableDeployLevel[form.deployTo]" class="w-200">
<a-select-option v-for="bank in bankList" :key="bank">{{bank}}</a-select-option>
<a-select :placeholder="'选择调配的'+selectableDeployLevel[form.deployTo]"
class="w-200">
<a-select-option v-for="bank in bankList"
:key="bank">
{{bank}}
</a-select-option>
</a-select>
</a-form-model-item>
<!-- 调配银行的所属信息 -->
<a-form-model-item :label="'所属'+detailDeployLabel[n-1]" v-for="n in detailDeployLength" :key="n.id">
<a-select :placeholder="'选择现属'+detailDeployLabel[n-1]" class="w-200">
<a-select-option v-for="(bank,i) in bankList" :key="bank" :value="i">{{bank}}</a-select-option>
<a-form-model-item :label="'所属'+detailDeployLabel[n-1]"
v-for="n in detailDeployLength"
:key="n.id">
<a-select :placeholder="'选择现属'+detailDeployLabel[n-1]"
class="w-200">
<a-select-option v-for="(bank,i) in bankList"
:key="bank"
:value="i">
{{bank}}
</a-select-option>
</a-select>
</a-form-model-item>
<a-form-model-item label="详细地址" :required="true" prop="location" >
......@@ -96,7 +109,7 @@ export default Vue.extend({
return{
form:{
deployTo:0,
location:'',
location:'vsdfc',
firstBranch:'',
secondaryBranch:'',
firstSubBranch:'',
......
......@@ -20,48 +20,35 @@
<span slot="secondarySubClient" slot-scope="text,record"> <a @click="getSecondarySubClientList(record.key)">查看</a> </span>
<!-- 操作 -->
<p slot="action" slot-scope="text,record" >
<a v-if="record.state!='已禁用'" @click="deploy(record)">调配</a>
<a-popconfirm
v-if="record.state=='已禁用'"
title="确定启用吗?"
cancelText="取消"
okText="确定"
@confirm="() => enable(record.key)"
>
<a>启用</a>
</a-popconfirm>
<a-popconfirm
v-else
title="确定禁用吗?"
cancelText="取消"
okText="确定"
@confirm="() => disable(record.key)"
>
<span v-if="record.state!='已禁用'">
<a @click="deploy(record)">调配</a>
<a-divider type="vertical" />
<a>禁用</a>
</a-popconfirm>
<a-popconfirm
v-if="record.state==('启用中/在岗')"
title="确定将该账户设为不在岗吗?"
cancelText="取消"
okText="确定"
@confirm="() => offJob(record.key)"
>
<a @click="() => enable(record.key)">启用</a>
</span>
<span v-else>
<a @click="disable(record.key)">禁用</a>
</span>
<span v-if="record.state==('启用中/在岗')">
<a-divider type="vertical" />
<a href="javascript:;">不在岗</a>
</a-popconfirm>
<a-popconfirm
v-else-if="record.state==('启用中/不在岗')"
title="确定将该账户设为在岗吗?"
cancelText="取消"
okText="确定"
@confirm="() => inJob(record.key)"
>
<a @confirm="() => offJob(record.key)">不在岗</a>
</span>
<span v-else-if="record.state==('启用中/不在岗')">
<a-divider type="vertical" />
<a href="javascript:;">在岗</a>
</a-popconfirm>
<a @click="inJob(record.key)">在岗</a>
</span>
</p>
</a-table>
<!-- 操作Modal -->
<a-modal
:title="title"
v-model="show"
:centered="true"
:closable="false"
@ok="handleOk"
@cancle="show = false"
>
<p class=" text-center">{{text}}</p>
</a-modal>
</div>
</template>
......@@ -72,11 +59,12 @@ import { staff } from '@/types/staff'
import { eRole } from "@/types/role"
import { eLevel } from "@/types/level"
import { getColumns } from '@/const/columns/userManagerCol'
import { userModal } from './const'
import deplotModal from "@/components/UserManage/deployModal.vue"
export default Vue.extend({
components:{ deplotModal },
props:{
props:{
level:{
type: Number as PropType<eLevel>,
default:0
......@@ -89,6 +77,14 @@ export default Vue.extend({
type: Array as PropType<staff[]>,
}
},
data(){
return{
show:false,
title:'',
text:'',
type:userModal.enable
}
},
computed:{
firstLevelManager():Array<staff>{
return firstLevelManager
......@@ -98,23 +94,44 @@ export default Vue.extend({
}
},
methods:{
deploy(record:staff){
(this.$refs.deployModal as any).showModal()
},
enable(key:string){
console.log(key)
this.type = userModal.enable
this.title = '启用用户'
this.text = '确定启用该用户?'
this.show = true
},
disable(key:string){
console.log(key)
},
deploy(record:staff){
(this.$refs.deployModal as any).showModal()
this.type = userModal.disable
this.title = '禁用用户'
this.text = '确定禁用该用户?'
this.show = true
},
inJob(key:string){
console.log(key)
this.type = userModal.enable
this.title = '设置在岗'
this.text = '确定将该用户设置为在岗?'
this.show = true
},
offJob(key:string){
console.log(key)
this.type = userModal.enable
this.title = '设置不在岗'
this.text = '确定将该用户设置为在岗?'
this.show = true
},
add(){
handleOk(record:any){
if( this.type == userModal.enable ){
} else if( this.type == userModal.disable ){
} else if( this.type == userModal.inJob ){
} else if( this.type == userModal.offJob ){
}
this.show = false
},
// 二级分行管理员
getSecondaryManageList(key:string){
......
......@@ -71,8 +71,6 @@ router.beforeEach((to, from, next) => {
/* 如果有登录信息 */
const roles = (to.meta as { roles?: eRole[] }).roles
if (roles && roles.includes(usermsg.role)) {
console.log(1);
next()
} else {
if( usermsg.role == eRole.platform_management){
......
export enum modal {
on,
off,
delete
}
\ No newline at end of file
......@@ -18,35 +18,31 @@
</span>
<!-- 操作 -->
<span slot="action" slot-scope="text,record">
<a-popconfirm
v-if="record.state=='已下架'"
title="确定上架吗?"
cancelText="取消"
okText="确定"
@confirm="() => add(record.key)"
>
<a>上架</a>
</a-popconfirm>
<a-popconfirm
v-else
title="确定下架吗?"
cancelText="取消"
okText="确定"
@confirm="() => remove(record.key)"
>
<a>下架</a>
</a-popconfirm>
<a-popconfirm
title="确定删除吗?"
cancelText="取消"
okText="确定"
@confirm="() => onDelete(record.key)"
>
<a v-if="record.state=='已下架'"
@click="add(record.key)">
上架
</a>
<a v-else
@click="remove(record.key)">
下架
</a>
<a-divider type="vertical" />
<a href="javascript:;">删除</a>
</a-popconfirm>
</span>
<a @click="onDelete(record.key)">
删除
</a>
</span>
</a-table>
<!-- 操作Modal -->
<a-modal
:title="title"
v-model="show"
:centered="true"
:closable="false"
@ok="handleOk"
@cancle="show = false"
>
<p class=" text-center">{{text}}</p>
</a-modal>
</div>
</template>
......@@ -54,6 +50,8 @@
import Vue from 'vue'
import { activityList } from '@/mock/index'
import { columns } from '@/const/columns/activityColumn'
import { modal } from './const'
export default Vue.extend({
computed:{
columns(){
......@@ -66,7 +64,11 @@ export default Vue.extend({
search:'',
time:[],
value:'',
list
list,
show:false,
title:'',
type:modal.on,
text:'',
}
},
methods:{
......@@ -84,15 +86,33 @@ export default Vue.extend({
edit(key:string){
this.$router.push({name:'publishActivity',query:{key:key}})
},
onDelete(key:string) {
const dataSource = [...this.list];
this.list = dataSource.filter(item => item.key !== key);
add(record:any){
this.type = modal.on
this.show = true
this.title = '上架资讯'
this.text = '确定上架该资讯吗?'
},
add(key:string){
console.log(key)
remove(record:any){
this.type = modal.off
this.show = true
this.title = '下架活动'
this.text = '确定下架该活动吗?'
},
remove(key:string){
console.log(key)
onDelete(record:any){
this.type = modal.delete
this.show = true
this.title = '删除活动'
this.text = '确定删除该活动吗?'
},
handleOk(record:any){
if( this.type == modal.on){
} else if( this.type == modal.off){
} else if( this.type == modal.delete){
}
this.show = false
},
toDetail(key:string){
this.$router.push({name:'activityDetail',query:{key:key}})
......
export enum modalType {
on,
off,
delete
}
\ No newline at end of file
<template>
<div>
<p class=" text-2xl font-bold mb-5">banner管理</p>
<p class=" text-2xl font-bold mb-5">Banner管理</p>
<!-- timepicker -->
<span class=" font-semibold">发布时间:</span>
<a-range-picker :placeholder="['起始日期', '结束日期']" v-model="timerange" style=" margin-right:10px;" />
......@@ -13,12 +13,17 @@
v-model="visible"
:centered="true"
footer=""
:closable="false"
>
<a-form-model :model="form" :label-col="labelCol" :wrapper-col="wrapperCol" ref="ruleForm" :rules="rules">
<a-form-model-item label="banner名称" :required="true" prop="name">
<a-form-model :model="form"
:label-col=" { span: 5 }"
:wrapper-col=" { span: 10 }"
ref="ruleForm"
:rules="rules">
<a-form-model-item label="Banner名称" prop="name">
<a-input style="width:200px" v-model="form.name" placeholder="请输入名称"/>
</a-form-model-item>
<a-form-model-item label="banner位置">
<a-form-model-item label="Banner位置">
<span class=" text-sm text-black">首页</span>
</a-form-model-item>
<a-form-model-item label="上传图片" :required="true" prop="file">
......@@ -32,15 +37,17 @@
<a-button style="width:200px"> <a-icon type="upload" /> 点击上传 </a-button>
</a-upload>
</a-form-model-item>
<a-form-model-item :wrapper-col="{ span: 14, offset: 4 }">
<a-form-model-item :wrapper-col="{ span: 9, offset: 5 }">
<a-button type="primary" @click="onSubmit">发布</a-button>
<a-button style="margin-left: 10px;" @click="resetForm">重置</a-button>
<a-button style="margin-left: 10px;" @click="visible=false">取消</a-button>
</a-form-model-item>
</a-form-model>
</a-modal>
<!-- banner列表 -->
<a-table :columns="columns" :data-source="list" style=" text-align: center; margin-top:40px;" bordered>
<a-table :columns="columns"
:data-source="list"
style=" text-align: center; margin-top:40px;"
bordered>
<span slot="path" slot-scope="text,record">
<a-icon type="picture" @click="preview(record.path)" theme="twoTone" style="fontSize:20px"/>
<el-image-viewer
......@@ -50,43 +57,34 @@
:url-list="[url]" />
</span>
<span slot="action" slot-scope="text,record">
<a-popconfirm
v-if="record.state=='下架'"
title="确定上架吗?"
cancelText="取消"
okText="确定"
@confirm="() => add(record.key)"
>
<a>上架</a>
</a-popconfirm>
<a-popconfirm
v-else
title="确定下架吗?"
cancelText="取消"
okText="确定"
@confirm="() => remove(record.key)"
>
<a>下架</a>
</a-popconfirm>
<a-popconfirm
v-if="record.state=='下架'"
title="确定删除吗?"
cancelText="取消"
okText="确定"
@confirm="() => onDelete(record.key)"
>
<span v-if="record.state=='下架'">
<a @click="addBanner">上架</a>
<a-divider type="vertical" />
<a>删除</a>
</a-popconfirm>
<a @click="deleteBanner">删除</a>
</span>
<a v-else
@click="removeBanner">下架</a>
</span>
</a-table>
<!-- 操作Modal -->
<a-modal
:title="title"
v-model="show"
:centered="true"
:closable="false"
@ok="handleOk"
@cancle="show = false"
>
<p class=" text-center">{{text}}</p>
</a-modal>
</div>
</template>
<script lang="ts">
import Vue from "vue";
import { FormModel } from 'ant-design-vue';
import { bannerList } from '@/mock/index';
import { columns } from '@/const/columns/bannerColumns';
import Vue from "vue"
import { FormModel, Modal } from 'ant-design-vue'
import { bannerList } from '@/mock/index'
import { columns } from '@/const/columns/bannerColumns'
import { modalType } from './const'
export default Vue.extend({
components:{
......@@ -97,27 +95,22 @@ export default Vue.extend({
return columns
}
},
props:{
rules:{
type:Object,
default(){
return{
name: [{ required: true, message: '请输入名称', trigger: 'blur' }],
file: [{ required: true, message: '请上传文件', trigger: 'change' }],
}
}
},
},
data() {
let list = bannerList
return{
timerange:[],
visible: false,
labelCol: { span: 5 },
wrapperCol: { span: 10},
show:false,
title:'',
text:'',
modalType:modalType.on,
form: {
name: '',
},
rules:{
name: [{ required: true, message: '请输入名称', trigger: 'blur' }],
file: [{ required: true, message: '请上传文件', trigger: 'change' }],
},
showViewer:false,
url:'',
list,
......@@ -128,15 +121,34 @@ export default Vue.extend({
query(){
console.log(this.timerange)
},
onDelete(key:string) {
const dataSource = [...this.list];
this.list = dataSource.filter(item => item.key !== key);
addBanner(record:any){
this.modalType = modalType.on
this.show = true
this.title = '上架Banner'
this.text = '确定上架该Banner吗?'
},
add(key:string){
console.log(key)
removeBanner(record:any){
this.modalType = modalType.off
this.show = true
this.title = '下架Banner'
this.text = '确定下架该Banner吗?'
},
remove(key:string){
console.log(key)
deleteBanner(record:any){
this.modalType = modalType.delete
this.show = true
this.title = '删除Banner'
this.text = '确定删除该Banner吗?'
},
handleOk(record:any){
if( this.modalType == modalType.on){
} else if( this.modalType == modalType.off){
} else if( this.modalType == modalType.delete){
}
this.show = false
},
handleChange(info:any) {
if (info.file.status !== 'uploading') {
......@@ -154,14 +166,11 @@ export default Vue.extend({
preview(src:string){
this.showViewer = true
this.url = src
console.log(this.url);
},
closeViewer(){
this.showViewer = false
},
handleCancel(e:Event) {
console.log('Clicked cancel button');
this.visible = false;
},
onSubmit() {
......@@ -174,9 +183,6 @@ export default Vue.extend({
}
})
},
resetForm() {
(this.$refs.ruleForm as FormModel).resetFields();
},
}
});
</script>
export enum modal{
on,
off,
setDefault,
delete
}
\ No newline at end of file
......@@ -35,46 +35,31 @@
</span>
<!-- 操作 -->
<span slot="action" slot-scope="text,record">
<a-popconfirm
v-if="record.state=='已下架'"
title="确定上架吗?"
cancelText="取消"
okText="确定"
@confirm="() => add(record.key)"
>
<a>上架</a>
</a-popconfirm>
<a-popconfirm
v-else
title="确定下架吗?"
cancelText="取消"
okText="确定"
@confirm="() => remove(record.key)"
>
<a>下架</a>
</a-popconfirm>
<a-popconfirm
v-if="record.state=='已发布' && record.type=='自动回复'"
title="确定设为默认吗?"
cancelText="取消"
okText="确定"
@confirm="() => setDefault(record.key)"
>
<a-divider type="vertical" />
<a>设为默认</a>
</a-popconfirm>
<a-popconfirm
v-if="record.state=='已下架'"
title="确定删除吗?"
cancelText="取消"
okText="确定"
@confirm="() => onDelete(record.key)"
>
<a-divider type="vertical" />
<a href="javascript:;">删除</a>
</a-popconfirm>
</span>
<span v-if="record.state=='已下架'">
<a @click="add(record.key)"> 上架</a>
<a-divider type="vertical" />
<a @click="onDelete(record.key)">删除</a>
</span>
<span v-else>
<a @click="remove(record.key)">下架</a>
</span>
<span v-if="record.state=='已发布' && record.type=='自动回复'">
<a-divider type="vertical" />
<a @click="setDefault(record.key)">设为默认</a>
</span>
</span>
</a-table>
<!-- 操作Modal -->
<a-modal
:title="title"
v-model="visible"
:centered="true"
:closable="false"
@ok="handleOk"
@cancle="visible = false"
>
<p class=" text-center">{{text}}</p>
</a-modal>
</div>
</template>
......@@ -82,9 +67,11 @@
import Vue from 'vue'
import { chatList } from '@/mock/index'
import { columns } from '@/const/columns/chatColumns'
import { FormModel } from 'ant-design-vue';
import { FormModel } from 'ant-design-vue'
import { modal } from './const'
import { Tabs } from 'ant-design-vue'
Vue.use(Tabs)
export default Vue.extend({
computed:{
columns(){
......@@ -115,7 +102,11 @@ export default Vue.extend({
show:false,
form:{
}
},
visible:false,
title:'',
type:modal.on,
text:'',
}
},
methods:{
......@@ -142,18 +133,42 @@ export default Vue.extend({
// this.form[m as formtype] = ''
// })
},
onDelete(key:string) {
const dataSource = [...this.list];
this.list = dataSource.filter(item => item.key !== key);
add(record:any){
this.type = modal.on
this.visible = true
this.title = '上架内容'
this.text = '确定上架该内容吗?'
},
remove(record:any){
this.type = modal.off
this.visible = true
this.title = '下架内容'
this.text = '确定下架该内容吗?'
},
setDefault(key:string){
console.log(key)
setDefault(record:any){
this.type = modal.setDefault
this.visible = true
this.title = '设为自动回复'
this.text = '确定将该内容设为自动回复吗?'
},
add(key:string){
console.log(key)
onDelete(record:any){
this.type = modal.delete
this.visible = true
this.title = '删除内容'
this.text = '确定删除该内容吗?'
},
remove(key:string){
console.log(key)
handleOk(record:any){
if( this.type == modal.on){
} else if( this.type == modal.off){
} else if( this.type == modal.delete){
} else if( this.type == modal.setDefault){
}
this.visible = false
},
},
// created(){
......
export enum modal {
on,
off,
delete
}
\ No newline at end of file
......@@ -45,46 +45,41 @@
</span>
<!-- 操作 -->
<span slot="action" slot-scope="text,record">
<span slot="content"></span>
<span slot="action"></span>
<a-popconfirm
v-if="record.state=='已下架'"
title="确定上架吗?"
cancelText="取消"
okText="确定"
@confirm="() => add(record.key)"
>
<a>上架</a>
</a-popconfirm>
<a-popconfirm
v-else
title="确定下架吗?"
cancelText="取消"
okText="确定"
@confirm="() => remove(record.key)"
>
<a>下架</a>
</a-popconfirm>
<a-popconfirm
title="确定删除吗?"
cancelText="取消"
okText="确定"
@confirm="() => onDelete(record.key)"
>
<a v-if="record.state=='已下架'"
@click="add(record.key)">
上架
</a>
<a v-else
@click="remove(record.key)">
下架
</a>
<a-divider type="vertical" />
<a href="javascript:;">删除</a>
</a-popconfirm>
<a @click="onDelete(record.key)">
删除
</a>
</span>
</a-table>
<!-- 操作Modal -->
<a-modal
:title="title"
v-model="showActionModal"
:centered="true"
:closable="false"
@ok="onOk"
@cancle="show = false"
>
<p class=" text-center">{{text}}</p>
</a-modal>
</div>
</template>
<script lang="ts">
import Vue from 'vue';
import { columns } from '@/const/columns/msgColumns'
import { FormModel } from 'ant-design-vue';
import { msg } from '@/types/msg';
import { msgList } from '@/mock/index';
import { FormModel } from 'ant-design-vue'
import { msg } from '@/types/msg'
import { msgList } from '@/mock/index'
import { modal } from './const'
export default Vue.extend({
computed:{
......@@ -101,15 +96,34 @@ export default Vue.extend({
}
},
methods:{
onDelete(key:string) {
const dataSource = [...this.list];
this.list = dataSource.filter(item => item.key !== key);
add(record:any){
this.type = modal.on
this.showActionModal = true
this.title = '上架消息'
this.text = '确定上架该消息吗?'
},
add(key:string){
console.log(key)
remove(record:any){
this.type = modal.off
this.showActionModal = true
this.title = '下架消息'
this.text = '确定下架该消息吗?'
},
remove(key:string){
console.log(key)
onDelete(record:any){
this.type = modal.delete
this.showActionModal = true
this.title = '删除消息'
this.text = '确定删除该消息吗?'
},
onOk(record:any){
if( this.type == modal.on){
} else if( this.type == modal.off){
} else if( this.type == modal.delete){
}
this.showActionModal = false
},
query(){
......@@ -150,7 +164,7 @@ export default Vue.extend({
this.form[m as formtype] = record[m as msgtype ]
})
this.show = true
}
},
},
data(){
const list = msgList
......@@ -171,6 +185,10 @@ export default Vue.extend({
return{
visible:false,
show:false,
showActionModal:false,
title:'',
type:modal.on,
text:'',
current:{},
labelCol: { span: 4 },
wrapperCol: { span: 14 },
......
export enum modal{
on,
off,
delete
}
\ No newline at end of file
<template>
<div>
<div v-if="showFirstFilter">
<p class="text-2xl font-bold mb-5">用户管理</p>
<p class="text-2xl font-bold mb-5">网点管理</p>
<div>
<!-- 级联选择 -->
<a-cascader
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment