Jeecg-Boot 2.1.4 版本发布 | 重构较大,较多新功能

ant-design-vue-jeecg/src/views/system/modules/DeptRoleUserModal.vue

@@ -0,0 +1,200 @@
+<template>
+  <a-drawer
+    :title="title"
+    :maskClosable="true"
+    width=600
+    placement="right"
+    :closable="true"
+    @close="close"
+    :visible="visible"
+    style="height: calc(100% - 55px);overflow: auto;padding-bottom: 53px;">
+
+    <a-spin :spinning="confirmLoading">
+
+      <a-form :form="form" v-if="designNameOption.length>0">
+        <a-form-item label=''>
+          <a-col :xl="24" :lg="24" :md="24" :sm="24" :xs="24">
+            <a-card :style="{ marginTop: '12px',height:'auto' }">
+              <a-checkbox-group @change="designNameChange" v-model="designNameValue" style="width: 100%">
+                <a-row>
+                  <template v-for="(des) in designNameOption">
+                    <a-col :span="6">
+                      <a-checkbox :value="des.value">{{ des.text }}</a-checkbox>
+                    </a-col>
+                  </template>
+                </a-row>
+              </a-checkbox-group>
+            </a-card>
+          </a-col>
+        </a-form-item>
+      </a-form>
+      <div v-else><h3>无可配置角色!</h3></div>
+    </a-spin>
+    <div class="drawer-bootom-button">
+      <a-dropdown style="float: left" :trigger="['click']" placement="topCenter">
+        <a-menu slot="overlay">
+          <a-menu-item key="1" @click="checkALL">全部勾选</a-menu-item>
+          <a-menu-item key="2" @click="cancelCheckALL">取消全选</a-menu-item>
+        </a-menu>
+        <a-button>
+          操作 <a-icon type="up" />
+        </a-button>
+      </a-dropdown>
+      <a-popconfirm  title="确定放弃编辑？" @confirm="close" okText="确定" cancelText="取消">
+        <a-button style="margin-right: .8rem">取消</a-button>
+      </a-popconfirm>
+      <a-button @click="handleSubmit(true)" type="primary">保存</a-button>
+    </div>
+  </a-drawer>
+</template>
+
+<script>
+  import {httpAction, getAction} from '@/api/manage'
+  import  JEllipsis  from '@/components/jeecg/JEllipsis'
+  import {initDictOptions} from '@/components/dict/JDictSelectUtil'
+
+  export default {
+    name: 'DeptRoleUserModal',
+    components: {
+      JEllipsis
+    },
+    data() {
+      return {
+        currentDeptId:"",
+        title: "部门角色分配",
+        visible: false,
+        model: {},
+        labelCol: {
+          xs: {span: 24},
+          sm: {span: 5},
+        },
+        wrapperCol: {
+          xs: {span: 24},
+          sm: {span: 16},
+        },
+        confirmLoading: false,
+        form: this.$form.createForm(this),
+        validatorRules: {},
+        url: {
+          add: "/sys/sysDepartRole/deptRoleUserAdd",
+          getDeptRoleList:"/sys/sysDepartRole/getDeptRoleList",
+          getDeptRoleByUserId:"/sys/sysDepartRole/getDeptRoleByUserId"
+        },
+        designNameOption: [],
+        userId: "",
+        newRoleId:"",
+        oldRoleId:"",
+        designNameValue:[],
+        desformList: [],
+      }
+    },
+    created() {
+
+    },
+    methods: {
+      add(record,departId) {
+        this.userId = record.id;
+        this.currentDeptId = departId;
+        this.loadDesformList();
+        this.edit({});
+      },
+      edit(record) {
+        this.form.resetFields();
+        this.model = Object.assign({}, record);
+        this.visible = true;
+        getAction(this.url.getDeptRoleByUserId,{userId:this.userId}).then((res) => {
+          if (res.success) {
+            var designName = [];
+            for (let value of res.result) {
+              designName.push(value.droleId)
+            }
+            this.oldRoleId=designName.join(",");
+            this.designNameValue = designName;
+            this.newRoleId = designName.join(",");
+          }
+        });
+      },
+      close() {
+        this.$emit('close');
+        this.visible = false;
+      },
+      handleSubmit() {
+        const that = this;
+        // 触发表单验证
+        that.confirmLoading = true;
+        let  httpurl = this.url.add;
+        let  method = 'post';
+        let formData = Object.assign(this.model, {});
+        //时间格式化
+        formData.userId = this.userId;
+        formData.newRoleId=this.newRoleId;
+        formData.oldRoleId=this.oldRoleId;
+        httpAction(httpurl, formData, method).then((res) => {
+          if (res.success) {
+            that.$message.success(res.message);
+            that.$emit('reload');
+            that.$emit('ok');
+          } else {
+            that.$message.warning(res.message);
+          }
+        }).finally(() => {
+          that.confirmLoading = false;
+          that.close();
+        })
+      },
+      handleCancel() {
+        this.designNameOption=[];
+        this.designNameValue=[];
+        this.close()
+      },
+      designNameChange(selectedValue) {
+        this.newRoleId=selectedValue.join(",");
+      },
+      checkALL(){
+        var designName = [];
+        for (let value of this.desformList) {
+          designName.push(
+            value.id
+          )
+        }
+        this.designNameValue = designName;
+        this.newRoleId=designName.join(",");
+      },
+      cancelCheckALL(){
+        this.designNameValue=[];
+        this.newRoleId="";
+      },
+      /** 加载desform */
+      loadDesformList() {
+        getAction(this.url.getDeptRoleList, { departId: this.currentDeptId }).then((res) => {
+          if (res.success) {
+            this.desformList = res.result
+            var designName = [];
+            for (let value of this.desformList) {
+              designName.push({
+                value: value.id,
+                text: value.roleName,
+              })
+            }
+            this.designNameOption = designName;
+          }
+        });
+      },
+    }
+
+  }
+</script>
+
+<style scoped>
+  .drawer-bootom-button {
+    position: absolute;
+    bottom: 0;
+    width: 100%;
+    border-top: 1px solid #e8e8e8;
+    padding: 10px 16px;
+    text-align: right;
+    left: 0;
+    background: #fff;
+    border-radius: 0 0 2px 2px;
+  }
+</style>