yunshangxie-admin/src/pages/association/person.vue

<template>
  <t-card :bordered="false">
    <div class="form-step-container">
      <t-button @click="add">新增</t-button>
      <t-table
        rowKey="index"
        :data="list"
        :columns="columns"
        :stripe="false"
        :bordered="false"
        :hover="true"
        size="large"
        table-layout="auto"
        cellEmptyContent="-"
      >
        <template #group="{ row }">
          <t-tag theme="primary" v-if="row.group==1">超级管理员</t-tag>
          <t-tag theme="success" v-if="row.group==2">办事员</t-tag>
        </template>
        <template #select="{ row }">
          <t-space size="24px" v-if="row.group!=1">
            <t-button theme="warning" @click="edit(row)">编辑</t-button>
            <t-popconfirm  content="确认删除吗？" @confirm="del(row)">
              <t-button theme="danger" >删除</t-button>
            </t-popconfirm>
          </t-space>
        </template>
      </t-table>
    </div>
    <t-dialog :header="isEdit?'编辑管理员':'新增管理员'" :visible="addMode" :onClose="onCloseMy" @confirm="onSubmit">
      <t-form>
        <t-form-item label="管理员帐号" name="name">
          <t-input placeholder="请输入管理员帐号" v-model="modData.zhanghu"/>
        </t-form-item>
        <t-form-item label="管理员密码" name="password">
          <t-input placeholder="请输入管理员密码" v-model="modData.password"/>
        </t-form-item>
        <t-form-item label="绑定会员" name="password">
          <t-select
            v-model="modData.member_id"
            :filterable="true"
            placeholder="搜索会员"
            style="width: 400px; display: inline-block"
          >
            <t-option v-for="(item,index) in options" :value="item.value" :key="index" :label="item.label"></t-option>
          </t-select>
        </t-form-item>
        <t-form-item label="权限类型" name="type">
          <t-select  v-model="modData.group">
            <t-option value="2" key="2" label="业务员"></t-option>
          </t-select>
        </t-form-item>
      </t-form>
    </t-dialog>
  </t-card>

</template>
<script lang="ts">
export default {
  data() {
    return {
      modData:{
        zhanghu:'',
        password:'',
        group:'2',
        member_id:null,
        pid:0
      },
      options: [],
      addMode: false,
      isEdit: false,
      editID:0,
      list: [],
      columns: [
        {colKey: 'zhanghu', title: '管理员帐号'},
        {colKey: 'nikename', title: '绑定会员'},
        {colKey: 'group', title: '权限类型'},
        {colKey: 'select', title: '操作', width: 200},
      ],
      association:{},
    }
  },
  mounted() {
    //this.member_id=this.$route.query.id;
    if(typeof (this.$store.state.user.association)=='object'){
      this.association=this.$store.state.user.association;
    }else{
      this.association=JSON.parse(this.$store.state.user.association);
    }
    this.getList();
    this.getUserList();
  },
  methods: {
    getList() {
      this.$request
        .post("/association")
        .then( (res) => {
          console.log(res);
          this.list=res.data;
        })
        .catch((e) => {
          console.log(e);
        });
    },
    getUserList() {
      this.$request
        .post("/member",{if_xianshi:1,size:1000,page:1})
        .then( (res) => {
          console.log(res);
          var key=res.data.ret;
          var transformedSelectList = key.map(item => ({
            value: item.member_id,
            label: item.nikename
          }));
        this.options=transformedSelectList;
        })
        .catch((e) => {
          console.log(e);
        });
    },
    del(d){
      console.log(d);
      this.$request
        .post('/association/delAdmin',{id:d.id})
        .then((res) => {
          if(res.code==1){
            this.$message.success(res.msg);
            this.getList();
          }else {
            this.$message.error(res.msg);
          }
          console.log(res);
        })
        .catch((e) => {
          console.log(e);
        });
    },
    add(){
      delete this.modData.id;
      this.modData.zhanghu='';
      this.modData.password= '';
      this.modData.member_id=null;
      this.addMode=true;
      this.isEdit=false;
    },
    edit(d){
      this.editID=d.id;
      this.modData.zhanghu=d.zhanghu;
      this.modData.password=d.password;
      this.modData.member_id=d.member_id;
      this.modData.group=String(d.group);
      this.addMode=true;
      this.isEdit=true;
    },
    onSubmit() {
      if (this.modData.zhanghu == '') {
        this.$message.error('账户不能为空');
        return;
      }
      if (this.modData.password == '') {
        this.$message.error('密码不能为空');
        return;
      }
      if (this.modData.member_id == 0 || this.modData.member_id == null) {
        this.$message.error('绑定会员不能为空');
        return;
      }
      if (this.modData.group == '') {
        this.$message.error('请选择权限类型');
        return;
      }
      var url='/association/addAdmin';
      if(this.isEdit){
        url='/association/updateAdmin';
        this.modData.id=this.editID;
      }
      this.modData.pid=this.association.id;
      this.$request
        .post(url,this.modData)
        .then((res) => {
          if(res.code==1){
            this.$message.success(res.msg);
            this.addMode=false;
          }else {
            this.$message.error(res.msg);
          }
          this.getList();
        })
        .catch((e) => {
          console.log(e);
        });
    },
    onCloseMy() {
      this.addMode = false;
    }
  }
}
</script>
<style scoped lang="less">

</style>