资产结构展示

src/api/source/asset.js

@@ -0,0 +1,78 @@
+import request from '@/utils/request'
+
+/**
+ * 查询资产赋权用户信息
+ * @param data 参数信息
+ * @returns {*} 响应结果
+ */
+export function findUserIdList(data) {
+  return request({
+    url: '/source/asset/findUserIdList',
+    method: 'POST',
+    data
+  })
+}
+/**
+ * 添加用户资产权限
+ * @param data 参数信息
+ * @returns {*} 响应结果
+ */
+export function addUserAssetImPower(data) {
+  return request({
+    url: '/source/asset/addUserAssetAccredit',
+    method: 'POST',
+    data
+  })
+}
+
+/**
+ * 删除用户资产权限
+ * @param data 参数信息
+ * @returns {*} 响应结果
+ */
+export function delUserAssetImPower(data) {
+  return request({
+    url: '/source/asset/delUserAssetAccredit',
+    method: 'POST',
+    data
+  })
+}
+
+/**
+ * 查询资产赋权部门信息
+ * @param data 参数信息
+ * @returns {*} 响应结果
+ */
+export function findDeptIdList(data) {
+  return request({
+    url: '/source/asset/findDeptIdList',
+    method: 'POST',
+    data
+  })
+}
+
+/**
+ * 添加部门资产权限
+ * @param data 参数信息
+ * @returns {*} 响应结果
+ */
+export function addDeptAssetImpower(data) {
+  return request({
+    url: '/source/asset/addDeptAssetAccredit',
+    method: 'POST',
+    data
+  })
+}
+
+/**
+ * 删除部门资产权限
+ * @param data 参数信息
+ * @returns {*} 响应结果
+ */
+export function delDeptAssetImpower(data) {
+  return request({
+    url: '/source/asset/delDeptAssetAccredit',
+    method: 'POST',
+    data
+  })
+}

src/api/source/source.js

@@ -78,3 +78,5 @@ export function findTableValueList(basicId,tableName) {
     method: 'post',
   })
 }
+
+

src/api/tableData/data.js

@@ -57,24 +57,28 @@ export function selectTableData(id) {
     method: 'get'
   })
 }
+/**
+ * 过滤级联查询方法，资产授权，获取当前用户的信息
+ * 资产展示的调用方法
+ * @returns {*} 返回集合
+ */
 export function findTableInfo() {
   return request({
     url: '/source/tableInfo/findAssetByTableName',
     method: 'get'
   })
 }
+/**
+ * 查询数据库/表 级联查询用于数据资产授权
+ * 资产结构 资产授权 自己授权用
+ * @returns {AxiosPromise} 返回集合
+ */
 export function findTableInfoList() {
   return request({
     url: '/source/tableInfo/findAsset',
     method: 'get',
   })
 }
-export function selectColumn() {
-  return request({
-    url: '/source/tableInfo/selectColumn',
-    method: 'get',
-  })
-}
 export function findTableName(id) {
   return request({
     url: '/source/tableInfo/findTableName',

src/views/accredit/index.vue

@@ -1,123 +1,361 @@
 <template>
 <div>
   <el-container>
-    <el-aside width="30%">
+    <el-aside width="400px">
-    <el-tree :data="dataList" :props="defaultProps" @node-click="handleNodeClick">
+      <el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick"></el-tree>
-    </el-tree>
+    </el-aside>
-  </el-aside>
+
+    <el-main>
+
+      <el-form :inline="true" :model="tableBasic" class="demo-form-inline">
+        <el-form-item label="数据库名称">
+          <el-input v-model="tableBasic.tableName" placeholder="数据库/表名称" disabled></el-input>
+        </el-form-item>
+        <el-form-item label="中文名称">
+          <el-input v-model="tableBasic.tableRemark" placeholder="中文名称" disabled></el-input>
+        </el-form-item>
+        <el-form-item label="数据量">
+          <el-input v-model="tableBasic.dataNum" placeholder="数据量" disabled></el-input>
+        </el-form-item>
+      </el-form>
+
+      <el-card class="box-card">
+        <div slot="header" class="clearfix">
+          <span>卡片名称</span>
+        </div>
+        <template>
+          <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
+            <el-tab-pane label="部门授权" name="first">
+              <el-table
+                v-if="refreshTable"
+                v-loading="loading"
+                :data="deptList"
+                :default-expand-all="isExpandAll"
+                :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
+                row-key="deptId">
+                <el-table-column label="部门名称" prop="deptName" width="260"></el-table-column>
+                <el-table-column label="部门负责人" prop="leader" width="260"></el-table-column>
+                <el-table-column label="邮箱" prop="email" width="260"></el-table-column>
+                <el-table-column align="center" label="创建时间" prop="createTime" width="200">
+                  <template slot-scope="scope">
+                    <span>{{ parseTime(scope.row.createTime) }}</span>
+                  </template>
+                </el-table-column>
+                <el-table-column align="center" class-name="small-padding fixed-width" label="操作(授权)">
+                  <template slot-scope="scope">
+                    <el-switch
+                      :value="isDeptAccredited(scope.row.deptId)"
+                      @change="handleDeptAccreditChange(scope.row.deptId,$event)"
+                      active-color="#13ce66"
+                      inactive-color="#ff4949">
+                    </el-switch>
+                  </template>
+                </el-table-column>
+              </el-table>
 
 
-  <el-tabs type="border-card" v-model="idType">
+            </el-tab-pane>
-    <el-tab-pane label="部门授权" name="dept">
+            <el-tab-pane label="用户授权" name="second">
-      <el-table
+              <el-table v-loading="loading" :data="userList">
-        ref="deptTable"
+                <el-table-column v-if="columns[0].visible" key="userId" align="center" label="用户编号" prop="userId"/>
-        v-loading="loading"
+                <el-table-column v-if="columns[1].visible" key="userName" :show-overflow-tooltip="true" align="center" label="用户名称"
-        :data="deptList"
+                                 prop="userName"/>
-        :default-expand-all="true"
+                <el-table-column v-if="columns[2].visible" key="nickName" :show-overflow-tooltip="true" align="center" label="用户昵称"
-        :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
+                                 prop="nickName"/>
-        row-key="deptId"
+                <el-table-column v-if="columns[3].visible" key="deptName" :show-overflow-tooltip="true" align="center" label="部门"
-      >
+                                 prop="dept.deptName"/>
-        <el-table-column label="部门名称" prop="deptName"></el-table-column>
+                <el-table-column v-if="columns[4].visible" key="phonenumber" align="center" label="手机号码"
-        <el-table-column label="部门负责人" prop="leader"></el-table-column>
+                                 prop="phonenumber" width="120"/>
-        <el-table-column label="邮箱" prop="email"></el-table-column>
+                <el-table-column v-if="columns[7].visible" key="email" align="center" label="邮箱"
-        <el-table-column align="center" label="创建时间" prop="createTime">
+                                 prop="email" width="120"/>
-          <template slot-scope="scope">
+                <el-table-column v-if="columns[6].visible" align="center" label="创建时间" prop="createTime" width="160">
-            <span>{{ parseTime(scope.row.createTime) }}</span>
+                  <template slot-scope="scope">
-          </template>
+                    <span>{{ parseTime(scope.row.createTime) }}</span>
-        </el-table-column>
+                  </template>
-        <el-table-column align="center" label="操作" prop="createTime">
+                </el-table-column>
-          <template slot-scope="scope">
+                <el-table-column align="center" class-name="small-padding fixed-width" label="操作(授权)" width="160">
-            <el-switch
+                  <template slot-scope="scope">
-              style="display: block"
+
-              v-model="scope.row.isAuth"
+                    <el-switch
-              @change="(val)=>accreditChange(val,scope.row,scope.row.deptId)"
+                      :value="isAccredited(scope.row.userId)"
-              active-color="#13ce66"
+                      @change="handleAccreditChange(scope.row.userId,$event)"
-              inactive-color="#ff4949"
+                      active-color="#13ce66"
-              active-text="已授权"
+                      inactive-color="#ff4949">
-              inactive-text="未授权">
+                    </el-switch>
-            </el-switch>
+                  </template>
-          </template>
+                </el-table-column>
-        </el-table-column>
+              </el-table>
-      </el-table>
+            </el-tab-pane>
-      <pagination v-show="total> 0" :limit.sync="pageSize" :page.sync="pageNum" :total="total"/>
+          </el-tabs>
-    </el-tab-pane>
+        </template>
-    <el-tab-pane label="用户授权" name="user">
+      </el-card>
-      <el-table ref="table" v-loading="loading" :data="userList">
+    </el-main>
-        <el-table-column align="center" label="用户名称" prop="userName"/>
-        <el-table-column align="center" label="用户昵称" prop="nickName"/>
-        <el-table-column align="center" label="用户部门" prop="dept.deptName"/>
-        <el-table-column align="center" label="用户邮箱" prop="email"/>
-        <el-table-column align="center" label="用户手机号" prop="phonenumber"/>
-        <el-table-column align="center" label="创建时间" prop="createTime"/>
-        <el-table-column align="center" label="操作" prop="createTime">
-          <template slot-scope="scope">
-            <el-switch
-              style="display: block"
-              v-model="scope.row.isAuth"
-              @change="(val)=>accreditChange(val,scope.row,scope.row.userId)"
-              active-color="#13ce66"
-              inactive-color="#ff4949"
-              active-text="已授权"
-              inactive-text="未授权">
-            </el-switch>
-          </template>
-        </el-table-column>
-      </el-table>
-      <pagination v-show="total> 0" :limit.sync="pageSize" :page.sync="pageNum" :total="total"/>
-    </el-tab-pane>
-  </el-tabs>
   </el-container>
 </div>
 </template>
 <script setup>
+
+import { listUser } from '@/api/system/user'
+import { listDept } from '@/api/system/dept'
+import {
+  addDeptAssetImpower,
+  addUserAssetImPower,
+  delDeptAssetImpower,
+  delUserAssetImPower,
+  findDeptIdList,
+  findUserIdList
+} from "@/api/source/asset";
 import {findTableInfoList} from "@/api/tableData/data";
-import {listDept} from "@/api/system/dept";
-import {listUser} from "@/api/system/user";
 
 export default {
   name:'Accredit',
   data() {
     return {
-      // 部门列表
+      //用户是否授权
-      deptList: [],
+      AccreditValue:false,
-      // 用户列表
+      //用户列表
-      userList: [],
+      userList:[],
-      deptData:[],
+      // 列信息
-      dataList:[
+      columns: [
-        {
+        {key: 0, label: `用户编号`, visible: false},
-          children:[],
+        {key: 1, label: `用户名称`, visible: true},
-        }
+        {key: 2, label: `用户昵称`, visible: true},
+        {key: 3, label: `部门`, visible: true},
+        {key: 4, label: `手机号码`, visible: true},
+        {key: 5, label: `状态`, visible: false},
+        {key: 6, label: `创建时间`, visible: true},
+        {key: 7, label: `邮箱`, visible: true}
       ],
+      // 遮罩层
+      loading: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 表格树数据
+      deptList: [],
+      // 部门树选项
+      deptOptions: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 是否展开，默认全部展开
+      isExpandAll: true,
+      // 重新渲染表格状态
+      refreshTable: true,
+      // 查询参数
+      queryParams: {
+        deptName: undefined,
+        status: undefined
+      },
+      data:[],
       defaultProps: {
         children: 'children',
         label: 'tableName'
       },
-
+      tableBasic:{},
+      tableStructure:[],
+      valueList:[],
+      activeName: 'first',
+      AssetImPowerListReq:{
+        basicId:null,
+        tableId:null,
+        deptId:null,
+        userId:null
+      },
+      userIdList:[],
+      deptIdList:[],
     };
   },
   created() {
-    this.findTableInfoList();
+    //查询数据库和相关联表
-    this.init();
+    this.findByTableName();
+    //查询部门列表;
+    this.getList();
+    //查询用户列表
+    this.getUserList();
+
   },
-  methods:{
+  methods: {
-    findTableInfoList(){
+    //部门switch状态变化
-      findTableInfoList().then(res=>{
+    handleDeptAccreditChange(deptId, value) {
-        this.dataList=res.data
+      this.AssetImPowerListReq.basicId = this.tableBasic.basicId
+      this.AssetImPowerListReq.tableId = this.tableBasic.id
+      this.AssetImPowerListReq.deptId = deptId
+      if (this.tableBasic.children != null) {
+        this.AssetImPowerListReq.tableId = null;
+      } else {
+        this.AssetImPowerListReq.basicId = null;
+      }
+
+      if (value === true) {
+        //添加部门资产权限
+        addDeptAssetImpower(this.AssetImPowerListReq).then((res) => {
+          if (res.code === 200) {
+            this.$modal.msgSuccess("授权成功");
+          } else {
+            this.$modal.msgError("授权失败");
+          }
+          this.findDeptIdList();
+          this.isDeptAccredited()
+        })
+      } else {
+        //删除部门资产权限
+        delDeptAssetImpower(this.AssetImPowerListReq).then((res) => {
+          if (res.code === 200) {
+            this.$modal.msgSuccess("权限删除成功");
+          } else {
+            this.$modal.msgError("权限删除失败");
+          }
+          this.findDeptIdList();
+          this.isDeptAccredited()
+        })
+      }
+    },
+    //处理switch状态变化,进行授予权限和剔除权限
+    handleAccreditChange(userId, value) {
+      console.log("userId的值：:" + userId);
+      console.log("value的值：" + value)
+      this.AssetImPowerListReq.basicId = this.tableBasic.basicId
+      this.AssetImPowerListReq.tableId = this.tableBasic.id
+      this.AssetImPowerListReq.userId = userId
+      if (this.tableBasic.children != null) {
+        this.AssetImPowerListReq.tableId = null;
+      } else {
+        this.AssetImPowerListReq.basicId = null;
+      }
+
+      if (value === true) {
+        //添加用户资产权限
+        addUserAssetImPower(this.AssetImPowerListReq).then((res) => {
+          if (res.code === 200) {
+            this.$message.success("授权成功")
+          } else {
+            this.$message.error("授权失败");
+          }
+          this.findUserIdList()
+          this.isAccredited()
+        })
+      } else {
+        //删除用户资产权限
+        delUserAssetImPower(this.AssetImPowerListReq).then((res) => {
+          if (res.code === 200) {
+           this.$message.success("取消授权成功");
+          } else {
+            this.$message.error("取消授权失败");
+          }
+          this.findUserIdList()
+          this.isAccredited()
+        })
+      }
+    },
+
+    // 判断用户ID是否在列表中
+    isAccredited(userId) {
+      return this.userIdList.includes(userId);
+    },
+
+    //判断部门ID是否在列表中
+    isDeptAccredited(deptId) {
+      return this.deptIdList.includes(deptId);
+    },
+
+    /**
+     * 查询用户列表
+     */
+    getUserList() {
+      this.loading = false;
+      listUser(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
+          this.userList = response.data.rows;
+          this.total = response.data.total;
+          this.loading = false;
+          console.log(response.data.rows)
+        }
+      );
+    },
+
+    /**
+     * 查询部门列表
+     */
+    getList() {
+      this.loading = false;
+      listDept(this.queryParams).then(response => {
+        this.deptList = this.handleTree(response.data, "deptId");
+        this.loading = false;
+      });
+    },
+    /**
+     * 部门授权卡片
+     * @param tab
+     * @param event
+     */
+    handleClick(tab, event) {
+      // console.log(tab, event);
+    },
+
+    /**
+     * 查询数据库和相关联表
+     * @returns {AxiosPromise} 返回集合
+     */
+    findByTableName() {
+      findTableInfoList().then((res) => {
+        this.data = res.data
       })
     },
-    init() {
+
-      listDept().then(res => {
+    /**
-        this.deptData = res.data
+     * 查询资产赋权用户信息
-        this.deptList = this.handleTree(res.data, "deptId");
+     * @param data 参数信息
+     * @returns {*} 响应结果
+     */
+    findUserIdList(){
+      findUserIdList(this.AssetImPowerListReq).then((res) => {
+        this.userIdList = res.data
       })
-      listUser().then(res => {
-        console.log(res)
-        this.userList = res.data.rows
-      })
-      // setTimeout(() => {
-      //   this.setAuth();
-      // }, 600);
     },
+
+    /**
+     * 查询资产赋权部门信息
+     * @param data 参数信息
+     * @returns {*} 响应结果
+     */
+    findDeptIdList(){
+      findDeptIdList(this.AssetImPowerListReq).then((res) => {
+        this.deptIdList = res.data
+      })
+    },
+    /**\
+     * 树形结构
+     * @param data
+     */
+    handleNodeClick(data) {
+      this.tableBasic = data
+      this.AssetImPowerListReq.tableId = this.tableBasic.id
+      this.AssetImPowerListReq.basicId = this.tableBasic.basicId
+      this.AssetImPowerListReq.deptId = this.tableBasic.deptId
+      if (this.tableBasic.children != null) {
+        this.AssetImPowerListReq.tableId = null;
+      } else {
+        this.AssetImPowerListReq.basicId = null;
+      }
+      /**
+       * 查询资产赋权用户信息
+       * @param data 参数信息
+       * @returns {*} 响应结果
+       */
+      findUserIdList(this.AssetImPowerListReq).then((res) => {
+        this.userIdList = res.data
+      })
+      /**
+       * 查询资产赋权部门信息
+       * @param data 参数信息
+       * @returns {*} 响应结果
+       */
+      findDeptIdList(this.AssetImPowerListReq).then((res) => {
+        this.deptIdList = res.data
+      })
+
+    },
+
   },
 }
 </script>

src/views/show/index.vue

@@ -112,12 +112,6 @@ export default {
         console.log(res.data);
       })
     },
-    findTableInfoList(){
-      findTableInfoList().then(res=>{
-        this.data=res.data
-        console.log(res.data);
-      })
-    },
     handleNodeClick(data) {
       this.tableBasic = data
       if (data.children == null) {

src/views/type/index.vue

@@ -64,7 +64,8 @@
   </div>
 </template>
 <script setup>
-import {findTableInfoList, selectColumn, selectTableData} from "@/api/tableData/data";
+import { selectTableData} from "@/api/tableData/data";
+import {findByTableName} from "@/api/source/source";
 
 export default {
   name: 'Type',
@@ -93,7 +94,7 @@ export default {
   },
   methods: {
    findTableInfoList(){
-     findTableInfoList().then(res=>{
+     findByTableName().then(res=>{
        this.dataList=res.data
      })
    },