update

gaoshp

2024-11-03 3e091224ab26252d8624b42b461ba773ee8bee0f

 src/views/console/authority/datascope.vue

@@ -1,26 +1,26 @@
<!--
 * @Author: lzhe lzhe@example.com
 * @Date: 2024-03-26 10:28:33
 * @LastEditors: lzhe lzhe@example.com
 * @LastEditTime: 2024-04-02 17:48:31
 * @FilePath: /smart-web/src/views/master/person/main/index.vue
 * @LastEditors: gaoshp
 * @LastEditTime: 2024-10-05 21:26:31
 * @FilePath: /cps-web/src/views/console/authority/datascope.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
   <div class="dict-main">
      <el-form :inline="true" :model="searchData" abel-width="120px">
      <el-form :inline="true" :model="searchData" label-width="120px">
         <el-form-item label="菜单名称">
            <el-input v-model="searchData.name" placeholder="菜单名称" clearable />
         </el-form-item>
         <el-form-item label="菜单编号">
            <el-input v-model="searchData.code" placeholder="菜单编号" clearable></el-input>
         </el-form-item>
         <el-form-item label="所属应用">
         <!-- <el-form-item label="所属应用">
            <el-select v-model="searchData.belongApplication" style="width: 100%">
               <el-option key="CPS" label="CPS" value="CPS"/>
               <el-option key="FMS" label="FMS" value="FMS"/>
               <el-option key="CPS" label="CPS" value="CPS" />
               <el-option key="FMS" label="FMS" value="FMS" />
            </el-select>
         </el-form-item>
         </el-form-item> -->
         <el-form-item>
            <el-button type="primary" @click="searchclick">搜索</el-button>
            <el-button @click="searchClearBtn">清空</el-button>
@@ -28,35 +28,39 @@
      </el-form>
      <div>
         <div class="dict-table">
            <el-table ref="multipleTableRef" :data="tableData" border row-key="id" style="width: 100%" class="multipleTableRef" @selection-change="handleSelectionChange" :tree-props="{ children: 'children', hasChildren: 'has' }">
            <el-table ref="multipleTableRef" :data="tableData" border row-key="id" style="width: 100%"
               class="multipleTableRef" @selection-change="handleSelectionChange"
               :tree-props="{ children: 'children', hasChildren: 'has' }">
               <el-table-column type="selection" width="55" />
               <el-table-column prop="name" label="菜单名称"></el-table-column>
               <el-table-column prop="path" label="路由地址"></el-table-column>
               <el-table-column prop="source" label="菜单图标">
                  <template #default="scope">
                            <component v-if="icons.includes(scope.row.source)" style="width: 20px;height: 20px;"
                                    :is='scope.row.source'></component>
                        </template>
                     <component v-if="icons.includes(scope.row.source)" style="width: 20px;height: 20px;"
                        :is='scope.row.source'></component>
                  </template>
               </el-table-column>
               <el-table-column prop="code" label="菜单编号"></el-table-column>
               <el-table-column prop="alias" label="菜单别名"></el-table-column>
               <el-table-column prop="sort" label="菜单排序"></el-table-column>
               <el-table-column prop="isOpen" label="新窗口">
                  <template #default="scope">
                     <div>{{scope.row.isOpen == 0?"是":"否"}}</div>
                     <div>{{ scope.row.isOpen == 0 ? "是" : "否" }}</div>
                  </template>
               </el-table-column>
               <el-table-column prop="belongApplication" label="所属应用"></el-table-column>
               <!-- <el-table-column prop="belongApplication" label="所属应用"></el-table-column> -->
               <el-table-column fixed="right" label="操作">
                  <template #default="scope">
                     <el-button text type="primary" size="small" @click="showDrawer(scope.row, scope.$index)">权限配置</el-button>
                     <el-button text type="primary" size="small"
                        @click="showDrawer(scope.row, scope.$index)">权限配置</el-button>
                  </template>
               </el-table-column>
            </el-table>
         </div>
      </div>
      <el-drawer title="[控制中心]数据权限配置" v-model="drawer" :direction="direction" :before-close="handleClose" size="920" class="drawerStyle">
         <el-form :inline="true" :model="drawerSearchData" abel-width="120px">
      <el-drawer title="[控制中心]数据权限配置" v-model="drawer" :direction="direction" :before-close="handleClose" size="920"
         class="drawerStyle">
         <el-form :inline="true" :model="drawerSearchData" label-width="120px">
            <el-form-item label="菜单名称">
               <el-input v-model="drawerSearchData.scopeName" placeholder="菜单名称" clearable />
            </el-form-item>
@@ -74,7 +78,8 @@
               <el-button type="danger" plain @click="delData">删除</el-button>
            </div>
            <div class="dict-table">
               <el-table ref="multipleTableRef" :data="drawerTableData" border style="width: 100%" class="multipleTableRef" @selection-change="drawerHandleSelectionChange">
               <el-table ref="multipleTableRef" :data="drawerTableData" border style="width: 100%"
                  class="multipleTableRef" @selection-change="drawerHandleSelectionChange">
                  <el-table-column type="selection" width="55" />
                  <el-table-column prop="scopeName" label="权限名称"></el-table-column>
                  <el-table-column prop="resourceCode" label="权限编号"></el-table-column>
@@ -82,290 +87,295 @@
                  <el-table-column prop="scopeTypeName" label="规则分类"></el-table-column>
                  <el-table-column fixed="right" label="操作">
                     <template #default="scope">
                        <el-button text type="primary" size="small" @click="table_show(scope.row, scope.$index)">查看</el-button>
                        <el-button text type="primary" size="small" @click="table_edit(scope.row, scope.$index)">编辑</el-button>
                        <el-button text type="primary" size="small" @click="table_del(scope.row, scope.$index)">删除</el-button>
                        <el-button text type="primary" size="small"
                           @click="table_show(scope.row, scope.$index)">查看</el-button>
                        <el-button text type="primary" size="small"
                           @click="table_edit(scope.row, scope.$index)">编辑</el-button>
                        <el-button text type="primary" size="small"
                           @click="table_del(scope.row, scope.$index)">删除</el-button>
                     </template>
                  </el-table-column>
               </el-table>
               <el-pagination
                  style="margin-top: 12px;"
                  @size-change="handleSizeChange"
                  @current-change="handleCurrentChange"
                  :current-page="currentPage4"
                  :page-sizes="[15, 50, 100]"
                  :page-size="15"
                  layout="total, sizes, prev, pager, next, jumper"
                  :total="drawerTotal">
               <el-pagination style="margin-top: 12px;" @size-change="handleSizeChange"
                  @current-change="handleCurrentChange" :current-page="currentPage4" :page-sizes="[15, 50, 100]"
                  :page-size="15" layout="total, sizes, prev, pager, next, jumper" :total="drawerTotal">
               </el-pagination>
            </div>
         </div>
      </el-drawer>
      <save-dialog v-if="dialog.save" ref="saveDialog" :scopeTypeNameList="scopeTypeNameList" :tableRow="tableRow" @success="addDatascopeSuccess" @closed="dialog.save=false"></save-dialog>
      <save-dialog v-if="dialog.save" ref="saveDialog" :scopeTypeNameList="scopeTypeNameList" :tableRow="tableRow"
         @success="addDatascopeSuccess" @closed="dialog.save = false"></save-dialog>
   </div>
</template>
<script>
   import saveDialog from './addDatascope'
   import * as ElementPlusIconsVue from '@element-plus/icons-vue'
   let icons = []
   for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
       icons.push(key)
   }
   export default {
      name: "datascope",
      data(){
         return {
            scopeTypeNameList: [],
            dialog: {
               save: false
            },
            drawerTotal: 0,
            direction: "rtl",
            drawer: false,
            icons,
            belongApplicationList: [],
            fileDialogVisible: false,
            getModalData: [],
            selection: [],
            drawerSelection: [],
            total: 0,
            drawerSearchData: {
               scopeName: "",
               resourceCode: "",
               menuId: "",
               current: 1,
               size: 10
            },
            searchData: {
               name: "",
               code: "",
               belongApplication: "",
               parentId: ""
            },
            dialog: {
               save: false,
               allocation: false
            },
            tableData: [],
            drawerTableData: [],
            rowId: "",
            tableRow: {}
         }
      },
      created(){
			
      },
      mounted(){
         this.getscopeTypeNameList();//规则分类枚举
         this.searchBtn();
      },
      components: {
          ...ElementPlusIconsVue,saveDialog
       },
      methods: {
         getscopeTypeNameList() {  //规则分类枚举
            this.$HTTP.get("/api/blade-system/dict/dictionary?code=data_scope_type").then(res=> {
               if(res.code == 200) {
                  this.scopeTypeNameList = res.data;
               }
            })
import saveDialog from './addDatascope'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
let icons = []
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
   icons.push(key)
}
export default {
   name: "datascope",
   data() {
      return {
         scopeTypeNameList: [],
         dialog: {
            save: false
         },
         addDatascopeSuccess() {
            this.drawerSearchclick();
         drawerTotal: 0,
         direction: "rtl",
         drawer: false,
         icons,
         belongApplicationList: [],
         fileDialogVisible: false,
         getModalData: [],
         selection: [],
         drawerSelection: [],
         total: 0,
         drawerSearchData: {
            scopeName: "",
            resourceCode: "",
            menuId: "",
            current: 1,
            size: 10
         },
         //添加权限
         addData(){
            this.dialog.save = true
            this.$nextTick(() => {
               this.$refs.saveDialog.open()
            })
         searchData: {
            name: "",
            code: "",
            belongApplication: "CPS",
            parentId: ""
         },
         // 删除
         delData() {
            if(this.drawerSelection.length == 0) {
               this.$message({
                   message: '请选择至少一条数据',
                   type: 'warning'
                 });
                 return;
         dialog: {
            save: false,
            allocation: false
         },
         tableData: [],
         drawerTableData: [],
         rowId: "",
         tableRow: {}
      }
   },
   created() {

   },
   mounted() {
      this.getscopeTypeNameList();//规则分类枚举
      this.searchBtn();
   },
   components: {
      ...ElementPlusIconsVue, saveDialog
   },
   methods: {
      getscopeTypeNameList() {  //规则分类枚举
         this.$HTTP.get("/api/blade-system/dict/dictionary?code=data_scope_type").then(res => {
            if (res.code == 200) {
               this.scopeTypeNameList = res.data;
            }
            var selStr = "";
            this.drawerSelection.map(item=> {
               selStr += item.id + ","
            })
            selStr = selStr.replace(/,$/, '');
            var that = this;
            this.$HTTP.post("/api/blade-system/data-scope/remove?ids="+selStr).then(res=> {
               if(res.code == 200) {
         })
      },
      addDatascopeSuccess() {
         this.drawerSearchclick();
      },
      //添加权限
      addData() {
         this.dialog.save = true
         this.$nextTick(() => {
            this.$refs.saveDialog.open()
         })
      },
      // 删除
      delData() {
         if (this.drawerSelection.length == 0) {
            this.$message({
               message: '请选择至少一条数据',
               type: 'warning'
            });
            return;
         }
         var selStr = "";
         this.drawerSelection.map(item => {
            selStr += item.id + ","
         })
         selStr = selStr.replace(/,$/, '');
         var that = this;
         this.$HTTP.post("/api/blade-system/data-scope/remove?ids=" + selStr).then(res => {
            if (res.code == 200) {
               that.$message.success("操作成功");
               that.drawerSearchclick();
            }
         })
      },
      table_edit(row) {  //编辑
         this.dialog.save = true
         this.$HTTP.get("/api/blade-system/data-scope/detail?id=" + row.id).then(res => {
            if (res.code == 200) {
               this.dialog.save = true;
               this.$nextTick(() => {
                  this.$refs.saveDialog.open('edit').setData(res.data);
               })
            }
         })
      },
      //查看
      table_show(row) {  //查看
         this.dialog.save = true
         this.$nextTick(() => {
            this.$refs.saveDialog.open('show').setData(row)
         })
      },
      table_del(row) {
         var that = this;
         this.$confirm(`确定将选择数据删除?`, '', {
            type: 'warning'
         }).then(() => {
            this.$HTTP.post("/api/blade-system/data-scope/remove?ids=" + row.id).then(res => {
               if (res.code == 200) {
                  that.$message.success("操作成功");
                  that.drawerSearchclick();
               }
            })
         },
         table_edit(row){  //编辑
            this.dialog.save = true
            this.$HTTP.get("/api/blade-system/data-scope/detail?id="+row.id).then(res=> {
               if(res.code == 200) {
                  this.dialog.save = true;
                  this.$nextTick(() => {
                     this.$refs.saveDialog.open('edit').setData(res.data);
                  })
               }
            })
         },
         //查看
         table_show(row){  //查看
            this.dialog.save = true
            this.$nextTick(() => {
               this.$refs.saveDialog.open('show').setData(row)
            })
         },
         table_del(row) {
            var that = this;
            this.$confirm(`确定将选择数据删除?`, '', {
               type: 'warning'
            }).then(() => {
               this.$HTTP.post("/api/blade-system/data-scope/remove?ids="+row.id).then(res=> {
                  if(res.code == 200) {
                     that.$message.success("操作成功");
                     that.drawerSearchclick();
                  }
               })
            }).catch(() => {
         }).catch(() => {

            })
         },
         handleClose(done) {
            this.drawerTableData = [];
              done();
          },
         exportFile(row,index){
            window.open(row.link);
         },
         codeClick() {
				
         },
         searchClearBtn() {
            this.searchData = {
               name: "",
               code: "",
               belongApplication: "",
               parentId: ""
            }
            this.searchBtn();
         },
         showDrawer(row){
            this.rowId = row.id;
            this.tableRow = row;  //后面组件会用到
            this.drawerSearchclick();
            this.drawer = true;
         },
         drawerSearchclick() {
            var obj = {};
            for(var key in this.drawerSearchData) {
               if(this.drawerSearchData[key]) {
                  obj[key] = this.drawerSearchData[key];
               }
            }
            obj.menuId = this.rowId;
            this.$HTTP.get("/api/blade-system/data-scope/list?"+this.$TOOL.qsStringify(obj)).then(res=> {
               if(res.code == 200) {
                  this.drawerTableData = res.data.records;
                  this.drawerTotal = res.data.total;
               }
            })
         },
         drawerSearchClearBtn() {
            this.drawerSearchData = {
               scopeName: "",
               resourceCode: "",
               menuId: this.rowId,
               current: 1,
               size: 10
            }
            this.drawerSearchclick();
         },
         searchclick() {
            this.searchBtn();
         },
         searchBtn() {
            var obj = {};
            for(var key in this.searchData) {
               if(this.searchData[key]) {
                  obj[key] = this.searchData[key];
               }
            }
            this.$HTTP.get("/api/blade-system/menu/lazy-menu-list",obj).then(res=> {
               if(res.code == 200) {
                  this.tableData = res.data;
               }
            })
         },
         handleSelectionChange(selection) {
            this.selection = selection;
         },
         drawerHandleSelectionChange(selection) {
            this.drawerSelection = selection;
         },
         changeDepartment() {
            this.departmentVisible = true;
         },
         handleSizeChange(val) {
            console.log(`每页 ${val} 条`);
            this.drawerSearchData.current = "1";
            this.drawerSearchData.size = val;
            this.drawerSearchclick();
         },
         handleCurrentChange(val) {
            console.log(`当前页: ${val}`);
            this.drawerSearchData.current = val;
            this.drawerSearchclick();
         })
      },
      handleClose(done) {
         this.drawerTableData = [];
         done();
      },
      exportFile(row, index) {
         window.open(row.link);
      },
      codeClick() {

      },
      searchClearBtn() {
         this.searchData = {
            name: "",
            code: "",
            belongApplication: "",
            parentId: ""
         }
         this.searchBtn();
      },
      showDrawer(row) {
         this.rowId = row.id;
         this.tableRow = row;  //后面组件会用到
         this.drawerSearchclick();
         this.drawer = true;
      },
      drawerSearchclick() {
         var obj = {};
         for (var key in this.drawerSearchData) {
            if (this.drawerSearchData[key]) {
               obj[key] = this.drawerSearchData[key];
            }
         }
         obj.menuId = this.rowId;
         this.$HTTP.get("/api/blade-system/data-scope/list?" + this.$TOOL.qsStringify(obj)).then(res => {
            if (res.code == 200) {
               this.drawerTableData = res.data.records;
               this.drawerTotal = res.data.total;
            }
         })
      },
      drawerSearchClearBtn() {
         this.drawerSearchData = {
            scopeName: "",
            resourceCode: "",
            menuId: this.rowId,
            current: 1,
            size: 10
         }
         this.drawerSearchclick();
      },
      searchclick() {
         this.searchBtn();
      },
      searchBtn() {
         var obj = {};
         for (var key in this.searchData) {
            if (this.searchData[key]) {
               obj[key] = this.searchData[key];
            }
         }
         this.$HTTP.get("/api/blade-system/menu/lazy-menu-list", obj).then(res => {
            if (res.code == 200) {
               this.tableData = res.data;
            }
         })
      },
      handleSelectionChange(selection) {
         this.selection = selection;
      },
      drawerHandleSelectionChange(selection) {
         this.drawerSelection = selection;
      },
      changeDepartment() {
         this.departmentVisible = true;
      },
      handleSizeChange(val) {
         console.log(`每页 ${val} 条`);
         this.drawerSearchData.current = "1";
         this.drawerSearchData.size = val;
         this.drawerSearchclick();
      },
      handleCurrentChange(val) {
         console.log(`当前页: ${val}`);
         this.drawerSearchData.current = val;
         this.drawerSearchclick();
      }
   }
}
</script>

<style scoped>
   .dict-main {
      background-color: #fff;
      margin: 8px;
      padding: 8px;
   }
   .dict-Btn {
      display: flex;
      justify-content: space-between;
      border-bottom: 1px solid #dcdfe6;
      margin-bottom: 8px;
      padding-left: 8px;
      padding-right: 8px;
   }
   .dict-btn-bottom {
      padding-left: 8px;
      padding-right: 8px;
      margin-bottom: 8px;
   }
   .dict-table {
      padding-left: 8px;
      padding-right: 8px;
      margin-bottom: 8px;
		
   }
   .multipleTableRef {
      margin-bottom: 8px;
   }
   .attachSize {
      color:#409eff;
      padding: 0 10px;
       font-size: 12px;
      background-color: #ebf4f4;
      border: 1px solid #d8e8e8;
   }
   /deep/ .drawerStyle {
      padding: 20px;
   }
   .datascope-drawer-btn {
      margin-bottom: 8px;
      padding-left: 8px;
      padding-right: 8px;
   }
.dict-main {
   background-color: #fff;
   margin: 8px;
   padding: 8px;
}

.dict-Btn {
   display: flex;
   justify-content: space-between;
   border-bottom: 1px solid #dcdfe6;
   margin-bottom: 8px;
   padding-left: 8px;
   padding-right: 8px;
}

.dict-btn-bottom {
   padding-left: 8px;
   padding-right: 8px;
   margin-bottom: 8px;
}

.dict-table {
   padding-left: 8px;
   padding-right: 8px;
   margin-bottom: 8px;

}

.multipleTableRef {
   margin-bottom: 8px;
}

.attachSize {
   color: #409eff;
   padding: 0 10px;
   font-size: 12px;
   background-color: #ebf4f4;
   border: 1px solid #d8e8e8;
}

/deep/ .drawerStyle {
   padding: 20px;
}

.datascope-drawer-btn {
   margin-bottom: 8px;
   padding-left: 8px;
   padding-right: 8px;
}
</style>