monitor_v3 / hg-monitor-web · Commits

Go to a project

Authored by 王涛
Commit 43bda42b4e57c4f8b265152629766fa9b4ca717c 2 parents 8732cd74 eb409d1f

Merge branch 'master-500-dev-lushangqing' into 'master-500-dev' 

【无】人员关系批量处理功能 #1，【无】部门管理增加业务授权功能-表格高度调整 #2



See merge request !653
Inline Side-by-side
Showing 30 changed files with 3422 additions and 4 deletions
@@ -191,8 +191,11 @@ layui.define(['table', 'form', 'admin', 'layer', 'upload', 'common', 'sessions', @@ -191,8 +191,11 @@ layui.define(['table', 'form', 'admin', 'layer', 'upload', 'common', 'sessions',
191 } 191 }
192 }, 192 },
193 { 193 {
194 - title: '操作', fixed: 'right', align: 'center',minWidth: 230, 194 + title: '操作', fixed: 'right', align: 'center',minWidth: 280,
195 templet: '<div>' + 195 templet: '<div>' +
  196 + //lsq 新增变更按钮 2022-05-30
  197 + '<button data-username="{{d.username}}" data-nickname="{{d.nickname}}" lay-tips="人员相关业务变更" type="button" class="layui-btn layui-btn-xs layui-btn-normal user_batch_change_leaders_btn"><i class="layui-icon layui-icon-edit"></i></button>'+
  198 +
196 '<button data-id="{{d.id}}" lay-tips="删除" type="button" class="layui-btn layui-btn-xs layui-btn-normal user_delete_btn"><i class="layui-icon layui-icon-delete"></i></button>'+ 199 '<button data-id="{{d.id}}" lay-tips="删除" type="button" class="layui-btn layui-btn-xs layui-btn-normal user_delete_btn"><i class="layui-icon layui-icon-delete"></i></button>'+
197 '<button data-id="{{d.id}}" data-username="{{d.username}}" lay-tips="重置密码" type="button" class="layui-btn layui-btn-xs layui-btn-normal user_pass_btn"><i class="layui-icon layui-icon-password"></i></button>'+ 200 '<button data-id="{{d.id}}" data-username="{{d.username}}" lay-tips="重置密码" type="button" class="layui-btn layui-btn-xs layui-btn-normal user_pass_btn"><i class="layui-icon layui-icon-password"></i></button>'+
198 '<button data-username="{{d.username}}" lay-tips="资源类型授权" type="button" class="layui-btn layui-btn-xs layui-btn-normal user_resType_authorization_btn"><i class="layui-icon layui-icon-app"></i></button>'+ 201 '<button data-username="{{d.username}}" lay-tips="资源类型授权" type="button" class="layui-btn layui-btn-xs layui-btn-normal user_resType_authorization_btn"><i class="layui-icon layui-icon-app"></i></button>'+
@@ -283,6 +286,39 @@ layui.define(['table', 'form', 'admin', 'layer', 'upload', 'common', 'sessions', @@ -283,6 +286,39 @@ layui.define(['table', 'form', 'admin', 'layer', 'upload', 'common', 'sessions',
283 } 286 }
284 }) 287 })
285 } 288 }
  289 + //start lsq 人员相关业务批量变更 2022-05-30
  290 + $('.user_batch_change_leaders_btn').unbind().on('click',function () {
  291 + let param = {
  292 + username: $(this).data('username'),
  293 + resName: ''
  294 + }
  295 + let urlParams='';
  296 + for(let key in param){
  297 + if(param[key]){
  298 + urlParams+=key+'='+param[key]+'&'
  299 + }
  300 + }
  301 + urlParams=urlParams.substr(0,urlParams.length-1);
  302 + let title=`
  303 + <div style="display: flex;justify-content: space-between; align-items: center;">
  304 + <span>"`+$(this).data('nickname')+`"相关业务批量变更</span>
  305 + </div>
  306 + `;
  307 + layer.open({
  308 + title: [title, 'font-size:18px;'],
  309 + type: 2,
  310 + area: ['80%', '90%'],
  311 + shadeClose: true,//开启遮罩层
  312 + id: 'batch_change_leaders',
  313 + content: ['/vue3/index.html#/vue3/batchChangeLeaders?'+urlParams, 'no'],
  314 + success:function (layero,index){
  315 + },
  316 + cancel: function () {
  317 + // clearTimeout(obj.lineTimer);
  318 + }
  319 + });
  320 + });
  321 + //end lsq 2022-05-30
286 // 配置默认首页 322 // 配置默认首页
287 $('.user-config-default-index').unbind('click').on('click', function () { 323 $('.user-config-default-index').unbind('click').on('click', function () {
288 var username = $(this).data('username'); 324 var username = $(this).data('username');
@@ -141,3 +141,10 @@ custom-class="config-dialog" @@ -141,3 +141,10 @@ custom-class="config-dialog"
141 .margin-top-bottom-10{ 141 .margin-top-bottom-10{
142 margin:10px 0; 142 margin:10px 0;
143 } 143 }
  144 +.tree-table .el-table td.el-table__cell div{
  145 + display: flex;
  146 + align-items: center;
  147 +}
  148 +.tree-table .el-table .el-table__cell.is-center div{
  149 + justify-content: center;
  150 +}+
1 <div > 1 <div >
2 <!-- 表格--> 2 <!-- 表格-->
3 <el-table :border="showBorder" v-loading="loading" :size="size" ref="multipleTable" @selection-change="handleSelectionChange" :data="dataList" stripe header-row-class-name="tbl-header-class" :height="height" 3 <el-table :border="showBorder" v-loading="loading" :size="size" ref="multipleTable" @selection-change="handleSelectionChange" :data="dataList" stripe header-row-class-name="tbl-header-class" :height="height"
4 - style="width: 100%;margin: 0px 0px; font-size:13.5px;" :row-key="getRowKeys" :expand-row-keys="expands"> 4 + style="width: 100%;margin: 0px 0px; font-size:13.5px;" :row-key="getRowKeys" :expand-row-keys="expands" :default-expand-all="defaultExpand"
  5 + @select="handleSelect" @select-all="handleSelectAll"
  6 + >
5 7
6 <el-table-column type="expand" v-if="showExpand"> 8 <el-table-column type="expand" v-if="showExpand">
7 <template #default="scope"> 9 <template #default="scope">
@@ -98,10 +98,15 @@ export default { @@ -98,10 +98,15 @@ export default {
98 type: String, 98 type: String,
99 default: 'id' 99 default: 'id'
100 }, 100 },
101 - //是否默认展开所有行 101 + //默认展开哪行
102 expands:{ 102 expands:{
103 type: Array, 103 type: Array,
104 default: [] 104 default: []
  105 + },
  106 + //是否默认展开所有行
  107 + defaultExpand:{
  108 + type:Boolean,
  109 + default:false
105 } 110 }
106 }, 111 },
107 data() { 112 data() {
@@ -150,6 +155,7 @@ export default { @@ -150,6 +155,7 @@ export default {
150 let params = { 155 let params = {
151 page: currentPage.value, limit: pageSize.value 156 page: currentPage.value, limit: pageSize.value
152 } 157 }
  158 + proxy.$refs.multipleTable.clearSelection();
153 159
154 emit('loaddata', params) 160 emit('loaddata', params)
155 } 161 }
@@ -224,6 +230,44 @@ export default { @@ -224,6 +230,44 @@ export default {
224 return val; 230 return val;
225 231
226 } 232 }
  233 + //设置父节点选中后children也选中
  234 + let setChecked=(row)=>{
  235 + let arr=[];
  236 + if(row.children){
  237 + row.children.map(j=>{
  238 + arr.push(j)
  239 + setChecked(j)
  240 + })
  241 + }
  242 + toggleSelection(arr)
  243 + }
  244 + //勾选数据行的Checkbox事件
  245 + let handleSelect=(selection, row)=>{
  246 + setChecked(row);
  247 +
  248 + emit('handleSelect',selection)
  249 + }
  250 + //勾选全选checkbox事件
  251 + let handleSelectAll=(selection)=>{
  252 + const isSelect=selection.some(el=>{
  253 + const tableDataIds=props.dataList.map(j=>j[props.getRowKeys])
  254 + return tableDataIds.includes(el.id)
  255 + })
  256 + const isCancel=!props.dataList.every(el=>{
  257 + const selectIds=selection.map(j=>j[props.getRowKeys])
  258 + return selectIds.includes(el.id)
  259 + })
  260 + if(isSelect){
  261 + setChecked(selection);
  262 + }
  263 + if(isCancel){
  264 + props.dataList.map(el=>{
  265 + setChecked(el);
  266 + })
  267 + }
  268 +
  269 + emit('handleSelectAll',selection)
  270 + }
227 // 挂载完 271 // 挂载完
228 Vue.onMounted(() => { 272 Vue.onMounted(() => {
229 //callback(); 273 //callback();
@@ -240,6 +284,8 @@ export default { @@ -240,6 +284,8 @@ export default {
240 }) 284 })
241 285
242 return { 286 return {
  287 + handleSelect,
  288 + handleSelectAll,
243 toggleSelection, 289 toggleSelection,
244 handleSelectionChange, 290 handleSelectionChange,
245 // multipleSelection, 291 // multipleSelection,
@@ -126,6 +126,11 @@ const routes = [{ @@ -126,6 +126,11 @@ const routes = [{
126 name: 'connectScatter', 126 name: 'connectScatter',
127 component: () => myImport('views/connectScatter/index') 127 component: () => myImport('views/connectScatter/index')
128 }, 128 },
  129 + {
  130 + path: '/vue3/batchChangeLeaders',
  131 + name: 'batchChangeLeaders',
  132 + component: () => myImport('views/batchChangeLeaders/index')
  133 + },
129 //部门业务关系 134 //部门业务关系
130 { 135 {
131 path: '/vue3/orgBustype', 136 path: '/vue3/orgBustype',
  1 +<el-row>
  2 + <el-col :span="24" class="search">
  3 + <div class="condition" style="display: flex;">
  4 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;width: 300px">
  5 + <el-input v-model="data.searchParams.keywords" placeholder="关键字支持：名称、负责人、业务描述"></el-input>
  6 + </el-form-item>
  7 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  8 + <el-button @click="getList">查询</el-button>
  9 + </el-form-item>
  10 +
  11 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  12 + <el-button type="primary" @click="removeRel">取消</el-button>
  13 + </el-form-item>
  14 +
  15 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  16 + <el-button type="primary" @click="changeUser">变更</el-button>
  17 + </el-form-item>
  18 +
  19 + </div>
  20 + </el-col>
  21 +</el-row>
  22 +<el-row style="font-size: 12px;color: grey;padding: 6px;">
  23 + {{item.ddicDesc}}
  24 +</el-row>
  25 +<el-row class="margin-bottom-50" style="margin-top: 3px">
  26 + <el-col :span="24" class="table-height">
  27 + <cm-table-page :columns="data.columns"
  28 + :dataList="data.tableData"
  29 + :treeProps="{ children: 'children', hasChildren: 'hasChildren' }"
  30 + :total="data.count"
  31 + :pageSize="data.searchParams.limit"
  32 + @loaddata="loadTableDataList"
  33 + @selectionChange="selectionChange"
  34 + :showIndex="true"
  35 + :showSelection="true"
  36 + :showBorder="true"
  37 + :loading="loading"
  38 + :showPage="true"
  39 + :showTools="false"
  40 + :height="(height - 200)">
  41 + <template #default="{row,prop,column}">
  42 + </template>
  43 + </cm-table-page>
  44 + </el-col>
  45 +</el-row>
  46 +
  47 +<ChangeUsersList :show="data.userDialogFlag" @hideDialog="showUserDialog" @savebtn="saveRel"></ChangeUsersList>
  1 +export default {
  2 + name: 'resourceTypePer',
  3 + template: '',
  4 + components: {
  5 + 'ChangeUsersList': Vue.defineAsyncComponent(
  6 + () => myImport('views/batchChangeLeaders/changeUsersList/index')
  7 + ),
  8 + },
  9 + data() {
  10 + },
  11 + props: {
  12 + item:{
  13 + type:Object,
  14 + default:{}
  15 + }
  16 + },
  17 + setup: function (props, {attrs, slots, emit}) {
  18 + const {proxy} = Vue.getCurrentInstance();
  19 + //列表高度
  20 + let height = Vue.ref(window.innerHeight);
  21 + let data = Vue.ref({
  22 + searchParams: {
  23 + "page": 1,
  24 + "limit": 50,
  25 + "keywords": "",
  26 + "userName": proxy.$route.query.username,
  27 + "subId": ""
  28 + },
  29 + userDialogFlag : false,
  30 + count: 0,
  31 + columns: [{
  32 + prop: "subName",
  33 + label: "订阅名称",
  34 + width: "250",
  35 + sortable: true,
  36 + align: 'center'
  37 + }, {
  38 + prop: "subType",
  39 + label: "订阅类型",
  40 + width: "120",
  41 + sortable: true,
  42 + align: 'center',
  43 + render: function (row) {
  44 + switch (row.subType) {
  45 + case '1':
  46 + return '告警订阅'
  47 + break;
  48 + case '2':
  49 + return '报表订阅'
  50 + break;
  51 + case '3':
  52 + return '系统通知订阅'
  53 + break;
  54 + case '4':
  55 + return '采集器异常订阅'
  56 + break;
  57 + }
  58 + }
  59 + }, {
  60 + prop: "subWay",
  61 + label: "通知类型",
  62 + width: "120",
  63 + sortable: true,
  64 + align: 'center',
  65 + render: function (row) {
  66 + switch (row.subWay){
  67 + case 'wechat':
  68 + return '<div class="iconfont icon-weixin" style="font-size: 22px"></div>'
  69 + break;
  70 + case 'email':
  71 + return '<div class="iconfont icon-youxiang" style="font-size: 22px"></div>'
  72 + break;
  73 + case 'message':
  74 + return '<div class="iconfont icon-duanxinqunfa" style="font-size: 22px"></div>'
  75 + break;
  76 + }
  77 + }
  78 + },{
  79 + prop: "tempType",
  80 + label: "通知说明",
  81 + width: "300",
  82 + sortable: true,
  83 + align: 'center',
  84 + render: (d) => {
  85 + var sendWay = '';
  86 + switch (d.subWay){
  87 + case 'wechat':
  88 + sendWay = '微信'
  89 + break;
  90 + case 'email':
  91 + sendWay = '邮箱';
  92 + break;
  93 + case 'message':
  94 + sendWay = '短信';
  95 + break;
  96 + }
  97 + var unit = d.sentFrequency && d.sentFrequency.indexOf("?")>0?"":"分钟一次";
  98 + return `${sendWay}通知${d.sendTotal}次；频率${d.sentFrequency}${unit}`;
  99 + }
  100 + }, {
  101 + prop: "userTotal",
  102 + label: "订阅人数",
  103 + sortable: true,
  104 + align: 'center'
  105 + }, {
  106 + prop: "times",
  107 + label: "允许通知时间段",
  108 + sortable: true,
  109 + align: 'center'
  110 + }, {
  111 + prop: "syncFlag",
  112 + label: "同步状态",
  113 + sortable: true,
  114 + align: 'center',
  115 + render: (row) => {
  116 + switch (row.syncFlag) {
  117 + case '0':
  118 + return '未同步'
  119 + case '1':
  120 + return '已同步';
  121 + }
  122 + }
  123 + }],
  124 + tableData: [],
  125 + // 表格选中
  126 + checkArr:[]
  127 + })
  128 +
  129 +
  130 + const getList = () => {
  131 + proxy.$http.post(`/api-web/personnelChange/getList/alarmSubPer`, data.value.searchParams, function (res) {
  132 + if (res && res.success) {
  133 + let dataVal = data.value;
  134 + let list = res.data;
  135 + let count = res.count;
  136 +
  137 + dataVal.tableData = list;
  138 + dataVal.count = count;
  139 + }
  140 + })
  141 + }
  142 +
  143 + // 展示用户选择
  144 + let showUserDialog = (flg) =>{
  145 + data.value.userDialogFlag = flg;
  146 + }
  147 +
  148 + let saveRel = (obj) =>{
  149 + // 获取选中
  150 + let arr = data.value.checkArr;
  151 + if(arr.length == 0){
  152 + proxy.$global.showMsg('请至少选择一项','warning');
  153 + return;
  154 + }
  155 +
  156 + let params = {
  157 + targetUserName: obj.selectModel.join(''),
  158 + "userName": proxy.$route.query.username,
  159 + "subId": arr.join(',')
  160 + }
  161 + if(params.targetUserName == params.userName){
  162 + proxy.$global.showMsg('变更用户不能与变更前用户一致，请修改！','warning');
  163 + return;
  164 + }
  165 + proxy.$http.post(`/api-web/personnelChange/update/alarmSubPer`,params, function (res) {
  166 + if (res && res.success) {
  167 + proxy.$global.showMsg('变更成功！');
  168 + showUserDialog(false);
  169 + // 刷新表格
  170 + getList();
  171 + }
  172 + })
  173 + }
  174 +
  175 + // 变更
  176 + let changeUser = () =>{
  177 + // 获取选中
  178 + let arr = data.value.checkArr;
  179 + if(arr.length == 0){
  180 + proxy.$global.showMsg('请至少选择一项','warning');
  181 + return;
  182 + }
  183 +
  184 + showUserDialog(true);
  185 + }
  186 +
  187 + /**
  188 + * 取消
  189 + */
  190 + let removeRel = () =>{
  191 + let arr = data.value.checkArr;
  192 + if(arr.length == 0){
  193 + proxy.$global.showMsg('请至少选择一项','warning');
  194 + return;
  195 + }
  196 +
  197 + data.value.searchParams.subId = arr.join(',')
  198 + proxy.$global.confirm("确定取消相关资源？", function () {
  199 +
  200 + proxy.$http.post(`/api-web/personnelChange/remove/alarmSubPer`, data.value.searchParams , function (res) {
  201 + if (res && res.success) {
  202 + proxy.$global.showMsg('取消成功！');
  203 + getList()
  204 + }
  205 + })
  206 + });
  207 + }
  208 +
  209 + //重新加载表格数据
  210 + let loadTableDataList = ({page, limit}) => {
  211 + let dataVal = data.value;
  212 + dataVal.page = page;
  213 + dataVal.limit = limit;
  214 + getList();
  215 + }
  216 +
  217 + // 表格全选事件
  218 + let selectionChange = (val) => {
  219 + let checkArr = [];
  220 + val.map(item => {
  221 + checkArr.push(item.subId)
  222 + })
  223 + data.value.checkArr = checkArr;
  224 + let isCheck = (list, checkArr) => {
  225 + list.forEach((v, i) => {
  226 + v.checked = checkArr.includes(v.subId);
  227 + if (v.children) {
  228 + isCheck(v.children, checkArr);
  229 + }
  230 + });
  231 + }
  232 + isCheck(data.value.tableData, checkArr);
  233 + }
  234 +
  235 + // 挂载完
  236 + Vue.onMounted(() => {
  237 + getList();
  238 + })
  239 +
  240 + return {
  241 + height,
  242 + data,
  243 + getList,
  244 + changeUser,
  245 + showUserDialog,
  246 + removeRel,
  247 + loadTableDataList,
  248 + selectionChange,
  249 + saveRel
  250 + }
  251 + }
  252 +}
  1 +<el-row>
  2 + <el-col :span="24" class="search">
  3 + <div class="condition" style="display: flex;">
  4 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;width: 300px">
  5 + <el-input v-model="data.searchParams.keywords" placeholder="关键字支持：名称、负责人、业务描述"></el-input>
  6 + </el-form-item>
  7 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  8 + <el-button @click="getList">查询</el-button>
  9 + </el-form-item>
  10 +
  11 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  12 + <el-button type="primary" @click="removeRel">取消</el-button>
  13 + </el-form-item>
  14 +
  15 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  16 + <el-button type="primary" @click="changeUser">变更</el-button>
  17 + </el-form-item>
  18 +
  19 + </div>
  20 + </el-col>
  21 +</el-row>
  22 +<el-row style="font-size: 12px;color: grey;padding: 6px;">
  23 + {{item.ddicDesc}}
  24 +</el-row>
  25 +<el-row class="margin-bottom-50" style="margin-top: 3px">
  26 + <el-col :span="24" class="table-height">
  27 + <cm-table-page :columns="data.columns"
  28 + :dataList="data.tableData"
  29 + :treeProps="{ children: 'children', hasChildren: 'hasChildren' }"
  30 + :total="data.count"
  31 + :pageSize="data.searchParams.limit"
  32 + @loaddata="loadTableDataList"
  33 + @selectionChange="selectionChange"
  34 + :showIndex="true"
  35 + :showSelection="true"
  36 + :showBorder="true"
  37 + :loading="loading"
  38 + :showPage="true"
  39 + :showTools="false"
  40 + :height="(height - 200)">
  41 + <template #default="{row,prop,column}">
  42 + </template>
  43 + </cm-table-page>
  44 + </el-col>
  45 +</el-row>
  46 +
  47 +<ChangeUsersList :show="data.userDialogFlag" @hideDialog="showUserDialog" @savebtn="saveRel"></ChangeUsersList>
  1 +export default {
  2 + name: 'autoPatrolPortPer',
  3 + template: '',
  4 + components: {
  5 + 'ChangeUsersList': Vue.defineAsyncComponent(
  6 + () => myImport('views/batchChangeLeaders/changeUsersList/index')
  7 + ),
  8 + },
  9 + data() {
  10 + },
  11 + props: {
  12 + item:{
  13 + type:Object,
  14 + default:{}
  15 + }
  16 + },
  17 + setup: function (props, {attrs, slots, emit}) {
  18 + const {proxy} = Vue.getCurrentInstance();
  19 + //列表高度
  20 + let height = Vue.ref(window.innerHeight);
  21 + let data = Vue.ref({
  22 + searchParams: {
  23 + "page": 1,
  24 + "limit": 50,
  25 + "keywords": "",
  26 + "userName": proxy.$route.query.username,
  27 + "reportId": ""
  28 + },
  29 + userDialogFlag: false,
  30 + count: 0,
  31 + columns: [{
  32 + prop: "docName",
  33 + label: "文档名称",
  34 + width: "300",
  35 + sortable: true,
  36 + align: 'center'
  37 + }, {
  38 + prop: "frequencyType",
  39 + label: "调度类型",
  40 + width: "120",
  41 + sortable: true,
  42 + align: 'center',
  43 + render:(d)=>{
  44 + switch (d.frequencyType) {
  45 + case 'quarter':
  46 + return '季度'
  47 + case 'month':
  48 + return '每月'
  49 + case 'day':
  50 + return '每日'
  51 + case 'hour':
  52 + return '小时'
  53 + case 'year':
  54 + return '每年'
  55 + case 'week':
  56 + return '每周'
  57 + }
  58 + }
  59 + }, {
  60 + prop: "inspectionType",
  61 + label: "报表类型",
  62 + width: "100",
  63 + sortable: true,
  64 + align: 'center',
  65 + render: (d) => {
  66 + switch (d.reportType) {
  67 + case 'yxjk':
  68 + return '运行监控'
  69 + case 'jkjc':
  70 + return '健康检查'
  71 + case 'lxwh':
  72 + return '例行维护'
  73 + case 'gzfx':
  74 + return '故障分析'
  75 + case 'fxbg':
  76 + return '分析报告'
  77 + }
  78 + }
  79 + }, {
  80 + prop: "runningFlag",
  81 + label: "启用/禁用",
  82 + width: "120",
  83 + sortable: true,
  84 + align: 'center',
  85 + render: (d) => {
  86 + switch (d.runningFlag) {
  87 + case '1':
  88 + return '启用'
  89 + default :
  90 + return '禁用'
  91 + }
  92 + }
  93 +
  94 + },{
  95 + prop: "templatePath",
  96 + label: "模板地址",
  97 + sortable: true,
  98 + align: 'left'
  99 + }],
  100 + tableData: [],
  101 + // 表格选中
  102 + checkArr: []
  103 + })
  104 +
  105 +
  106 + const getList = () => {
  107 + proxy.$http.post(`/api-web/personnelChange/getList/autoPatrolPortPer`, data.value.searchParams, function (res) {
  108 + if (res && res.data) {
  109 + let dataVal = data.value;
  110 + let list = res.data;
  111 + let count = res.count;
  112 +
  113 + dataVal.tableData = list;
  114 + dataVal.count = count;
  115 + }
  116 + })
  117 + }
  118 +
  119 + // 展示用户选择
  120 + let showUserDialog = (flg) => {
  121 + data.value.userDialogFlag = flg;
  122 + }
  123 +
  124 + let saveRel = (obj) => {
  125 + // 获取选中
  126 + let arr = data.value.checkArr;
  127 + if (arr.length == 0) {
  128 + proxy.$global.showMsg('请至少选择一项', 'warning');
  129 + return;
  130 + }
  131 +
  132 + let params = {
  133 + targetUserName: obj.selectModel.join(''),
  134 + "userName": proxy.$route.query.username,
  135 + "reportId": arr.join(',')
  136 + }
  137 + if (params.targetUserName == params.userName) {
  138 + proxy.$global.showMsg('变更用户不能与变更前用户一致，请修改！', 'warning');
  139 + return;
  140 + }
  141 + proxy.$http.post(`/api-web/personnelChange/update/autoPatrolPortPer`, params, function (res) {
  142 + if (res && res.success) {
  143 + proxy.$global.showMsg('变更成功！');
  144 + showUserDialog(false);
  145 + // 刷新表格
  146 + getList();
  147 + }
  148 + })
  149 + }
  150 +
  151 + // 变更
  152 + let changeUser = () => {
  153 + // 获取选中
  154 + let arr = data.value.checkArr;
  155 + if (arr.length == 0) {
  156 + proxy.$global.showMsg('请至少选择一项', 'warning');
  157 + return;
  158 + }
  159 +
  160 + showUserDialog(true);
  161 + }
  162 +
  163 + /**
  164 + * 取消
  165 + */
  166 + let removeRel = () => {
  167 + let arr = data.value.checkArr;
  168 + if (arr.length == 0) {
  169 + proxy.$global.showMsg('请至少选择一项', 'warning');
  170 + return;
  171 + }
  172 +
  173 + data.value.searchParams.reportId = arr.join(',')
  174 + proxy.$global.confirm("确定取消相关资源？", function () {
  175 + proxy.$http.post(`/api-web/personnelChange/remove/autoPatrolPortPer`, data.value.searchParams, function (res) {
  176 + if (res && res.success) {
  177 + proxy.$global.showMsg('取消成功！');
  178 + getList()
  179 + }
  180 + })
  181 + });
  182 + }
  183 +
  184 + //重新加载表格数据
  185 + let loadTableDataList = ({page, limit}) => {
  186 + let dataVal = data.value;
  187 + dataVal.page = page;
  188 + dataVal.limit = limit;
  189 + getList();
  190 + }
  191 +
  192 + // 表格全选事件
  193 + let selectionChange = (val) => {
  194 + let checkArr = [];
  195 + val.map(item => {
  196 + checkArr.push(item.id)
  197 + })
  198 + data.value.checkArr = checkArr;
  199 + let isCheck = (list, checkArr) => {
  200 + list.forEach((v, i) => {
  201 + v.checked = checkArr.includes(v.id);
  202 + if (v.children) {
  203 + isCheck(v.children, checkArr);
  204 + }
  205 + });
  206 + }
  207 + isCheck(data.value.tableData, checkArr);
  208 + }
  209 +
  210 + // 挂载完
  211 + Vue.onMounted(() => {
  212 + getList();
  213 + })
  214 +
  215 + return {
  216 + height,
  217 + data,
  218 + getList,
  219 + changeUser,
  220 + showUserDialog,
  221 + removeRel,
  222 + loadTableDataList,
  223 + selectionChange,
  224 + saveRel
  225 + }
  226 + }
  227 +}
  1 +<el-row>
  2 + <el-col :span="24" class="search">
  3 + <div class="condition" >
  4 + <el-form ref=“form” style="display: flex;">
  5 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;width: 300px">
  6 + <el-input v-model="search.keyword" placeholder="关键字支持：业务名称"></el-input>
  7 + </el-form-item>
  8 + <!--<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  9 + <el-select filterable clearable v-model="search.resType" placeholder="请选择资源类型">
  10 + <el-option
  11 + v-for="item in resTypeOptions"
  12 + :key="item.resTypeCode"
  13 + :label="item.resTypeName"
  14 + :value="item.resTypeCode">
  15 + </el-option>
  16 + </el-select>
  17 + </el-form-item>-->
  18 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  19 + <el-button @click="getListData" >查询</el-button>
  20 + </el-form-item>
  21 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  22 + <el-button type="primary" @click="changeAdmin()" style="margin-left: 6px">变更</el-button>
  23 + </el-form-item>
  24 + </el-form>
  25 + </div>
  26 + </el-col>
  27 +</el-row>
  28 +<!--<el-row style="margin-bottom: 10px;">
  29 + <div class="flex-div-start">
  30 +&lt;!&ndash; <el-button type="primary" @click="changeCancel()" size="small">取消</el-button>&ndash;&gt;
  31 + <el-button type="primary" @click="changeAdmin()" size="small" style="margin-left: 6px">变更</el-button>
  32 + </div>
  33 +</el-row>-->
  34 +<el-row style="font-size: 12px;color: grey;padding: 6px;">
  35 + {{item.ddicDesc}}
  36 +</el-row>
  37 +<el-row class="margin-bottom-50" style="margin-top: 3px">
  38 + <el-col :span="24" class="table-height">
  39 + <cm-table-page :columns="columns"
  40 + :dataList="resourceData"
  41 + :total="count"
  42 + :pageSize="search.limit"
  43 + @loaddata="loadTableDataList"
  44 + @selectionChange="selectionChange"
  45 + :showIndex="true"
  46 + :showSelection="true"
  47 + :showBorder="true"
  48 + :loading="loading"
  49 + :showPage="true"
  50 + :showTools="false"
  51 + :height="(height - 200)">
  52 + <template #default="{row,prop,column}">
  53 + <div v-if="prop == 'showType'">
  54 + <el-select v-if="row.resType == 'HOST_X86SERVER'" v-model="row.showType" placeholder="">
  55 + <el-option
  56 + v-for="item in showTypeList"
  57 + :key="item.value"
  58 + :label="item.name"
  59 + :value="item.value"
  60 + >
  61 + </el-option>
  62 + </el-select>
  63 + </div>
  64 + </template>
  65 + </cm-table-page>
  66 + </el-col>
  67 +</el-row>
  68 +
  69 +<ChangeUsersList :show="show" :isTwoGroup="isTwoGroup" :isMulti="isMulti" @hideDialog="hideDialog" @savebtn="savebtn"></ChangeUsersList>
  1 +export default {
  2 + name: 'bizLeader',
  3 + template: '',
  4 + components: {
  5 + 'ChangeUsersList': Vue.defineAsyncComponent(
  6 + () => myImport('views/batchChangeLeaders/changeUsersList/index')
  7 + ),
  8 + },
  9 + data() {
  10 + },
  11 + props: {
  12 + item:{
  13 + type:Object,
  14 + default:{}
  15 + }
  16 + },
  17 + setup: function (props, {attrs, slots, emit}) {
  18 + const {proxy} = Vue.getCurrentInstance();
  19 + //接收从用户列表中选中的用户
  20 + let userName=Vue.ref(proxy.$route.query.username);
  21 + //变更人员弹框
  22 + let show=Vue.ref(false);
  23 + //变更人员列表是否多选
  24 + let isMulti=Vue.ref(false);
  25 + //变更人员列表是否是两组
  26 + let isTwoGroup=Vue.ref(false);
  27 + //配置列表总数
  28 + let count = Vue.ref(0);
  29 + //列表高度
  30 + let height = Vue.ref(window.innerHeight);
  31 + //加载
  32 + let loading = Vue.ref(true);
  33 + //选中数据
  34 + let pitch = Vue.ref([]);
  35 + let showTypeList=Vue.ref([]);
  36 + let search = Vue.ref({
  37 + resType: '',
  38 + keyword: '',
  39 + page: 1,
  40 + limit: 50,
  41 + });
  42 + let resTypeOptions=Vue.ref([])
  43 + const columns = [
  44 + {
  45 + prop: 'busTypeName',
  46 + label: '业务类型名称',
  47 + sortable: true,
  48 + align: 'center',
  49 + },
  50 + {
  51 + prop: 'admin',
  52 + label: '负责人',
  53 + sortable: true,
  54 + align: 'center',
  55 + },
  56 + {
  57 + prop: 'busTypeDesc',
  58 + label: '业务类型描述',
  59 + sortable: true,
  60 + align: 'center',
  61 + },
  62 + {
  63 + prop: 'isUse',
  64 + label: '是否使用',
  65 + sortable: true,
  66 + align: 'center',
  67 + render: function (row) {
  68 + switch (row.isUse) {
  69 + case 0:
  70 + return '否';
  71 + case 1:
  72 + return '是';
  73 + default:
  74 + return '';
  75 + }
  76 + }
  77 + },
  78 + {
  79 + prop: 'important',
  80 + label: '重要程度',
  81 + sortable: true,
  82 + align: 'center',
  83 + render: function (row) {
  84 + switch (row.important) {
  85 + case 1:
  86 + return '核心';
  87 + case 2:
  88 + return '重要';
  89 + case 3:
  90 + return '一般';
  91 + case 9:
  92 + return '虚拟业务';
  93 + default:
  94 + return '';
  95 + }
  96 + }
  97 + },
  98 + {
  99 + prop: 'sort',
  100 + label: '排序',
  101 + sortable: true,
  102 + align: 'center',
  103 + },
  104 + {
  105 + prop: 'showType',
  106 + label: '展示类型',
  107 + sortable: true,
  108 + align: 'center',
  109 + /* render: function (row) {
  110 +
  111 + }*/
  112 + }
  113 + ];
  114 +
  115 + //列表数据
  116 + let resourceData = Vue.ref([]);
  117 + //获取列表数据
  118 + const getListData = () => {
  119 + resourceData.value=[];
  120 + loading.value = true;
  121 + //定义列表参数
  122 + let getParams = {
  123 + resType:search.value.resType,
  124 + keywords:search.value.keyword,
  125 + userName:userName.value,
  126 + page: search.value.page,
  127 + limit: search.value.limit
  128 + };
  129 + proxy.$http.post("/api-web/personnelChange/getList/bizLeader", getParams, function (res) {
  130 + if (res && res.data) {
  131 + resourceData.value = res.data ? res.data : [];
  132 + count.value = res.count;
  133 + loading.value = false;
  134 + }
  135 + })
  136 + }
  137 + //重新加载表格数据
  138 + let loadTableDataList = ({page, limit}) => {
  139 + search.value.page=page;
  140 + search.value.limit=limit;
  141 + getListData();
  142 + }
  143 + let busIds=Vue.ref('');//选中的ids
  144 + //表格全选事件
  145 + let selectionChange = (val) => {
  146 + pitch.value = val;
  147 + let arr=[];
  148 + pitch.value.map(item=>{
  149 + arr.push(item.busId)
  150 + })
  151 + busIds.value=arr.join(",");//选中的值
  152 + }
  153 + //获取资源类型数据
  154 + let getResourceTypoe=()=>{
  155 + proxy.$http.get(`/api-web/manage/restype/list`, {}, function (res) {
  156 + if (res && res.data) {
  157 + resTypeOptions.value=res.data
  158 + }
  159 + })
  160 + }
  161 + //获取展示类型的字典数据
  162 + let initShowType=()=>{
  163 + proxy.$http.post("/api-web/manage/ddic/findSucDdics/DETAILS_POWER", {}, function (res) {
  164 + if (res && res.data) {
  165 + let arr=res.data;
  166 + if(arr && arr.length>0){
  167 + arr.map(v=>{
  168 + showTypeList.value.push({
  169 + name: v.ddicName
  170 + ,value: v.ddicCode.substring(v.ddicCode.lastIndexOf("_")+1,v.ddicCode.length)
  171 + });
  172 + })
  173 + }
  174 +
  175 + }
  176 + })
  177 + }
  178 + //批量取消相关资源
  179 + let changeCancel = () => {
  180 + if(pitch.value.length<1){
  181 + proxy.$global.showMsg('请至少选择一项','warning');
  182 + }else{
  183 + proxy.$global.confirm("确定取消相关资源？", function () {
  184 + let parmas={
  185 + userName:userName.value,
  186 + busId:busIds.value
  187 + }
  188 + proxy.$http.post(`/api-web/personnelChange/remove/bizLeader`, parmas, function (res) {
  189 + if (res && res.success) {
  190 + proxy.$global.showMsg('取消成功！');
  191 + getListData()
  192 + }
  193 + })
  194 + });
  195 + }
  196 + }
  197 + //变更负责人
  198 + let changeAdmin = () => {
  199 + if(pitch.value.length<1){
  200 + proxy.$global.showMsg('请至少选择一项','warning');
  201 +
  202 + }else{
  203 + show.value=true;
  204 + }
  205 +
  206 + }
  207 + //变更人员的弹框关闭后
  208 + let hideDialog =(flag)=>{
  209 + show.value=flag;
  210 + }
  211 + //变更人员的弹框保存后
  212 + let savebtn =(obj)=>{
  213 + show.value=false;
  214 + //obj.selectModel 选中的用户组（一个/主负责人) obj.selectModelSecond 辅负责人，都是数组
  215 + let targetUserName='';
  216 + if(obj.selectModel){
  217 + targetUserName=obj.selectModel.join(',')
  218 + }
  219 + let params={
  220 + busId:busIds.value,
  221 + targetUserName:targetUserName,
  222 + userName:userName.value,
  223 + }
  224 + proxy.$http.post(`/api-web/personnelChange/update/bizLeader`, params, function (res) {
  225 + if (res && res.success) {
  226 + proxy.$global.showMsg('变更成功！');
  227 + getListData()
  228 + }
  229 + })
  230 + }
  231 + // 挂载完
  232 + Vue.onMounted(() => {
  233 + initShowType();
  234 + getResourceTypoe();
  235 + getListData();
  236 + })
  237 + return {
  238 + isMulti,
  239 + isTwoGroup,
  240 + show,
  241 + initShowType,
  242 + showTypeList,
  243 + search,
  244 + resTypeOptions,
  245 + changeCancel,
  246 + count,
  247 + hideDialog,
  248 + savebtn,
  249 + changeAdmin,
  250 + getResourceTypoe,
  251 +
  252 + resourceData,
  253 + columns,
  254 + height,
  255 + loading,
  256 +
  257 + selectionChange,
  258 +
  259 + getListData,
  260 + loadTableDataList,
  261 + userName
  262 + }
  263 + }
  264 +}
  1 +<el-row>
  2 + <el-col :span="24" class="search">
  3 + <div class="condition" style="display: flex;">
  4 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;width: 300px">
  5 + <el-input v-model="data.searchParams.keywords" placeholder="关键字支持：名称、负责人、业务描述"></el-input>
  6 + </el-form-item>
  7 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  8 + <el-button @click="getList">查询</el-button>
  9 + </el-form-item>
  10 +
  11 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  12 + <el-button type="primary" @click="removeRel">取消</el-button>
  13 + </el-form-item>
  14 +
  15 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  16 + <el-button type="primary" @click="changeUser">变更</el-button>
  17 + </el-form-item>
  18 +
  19 + </div>
  20 + </el-col>
  21 +</el-row>
  22 +<el-row style="font-size: 12px;color: grey;padding: 6px;">
  23 + {{item.ddicDesc}}
  24 +</el-row>
  25 +<el-row class="margin-bottom-50" style="margin-top: 3px">
  26 + <el-col :span="24" class="table-height tree-table">
  27 + <cm-table-page :columns="data.columns"
  28 + :dataList="data.tableData"
  29 + :total="data.count"
  30 + :pageSize="data.searchParams.limit"
  31 + @loaddata="loadTableDataList"
  32 + @selectionChange="selectionChange"
  33 + :showIndex="true"
  34 + :showSelection="true"
  35 + :showBorder="true"
  36 + :loading="loading"
  37 + :showPage="true"
  38 + :showTools="false"
  39 + :getRowKeys="'busId'"
  40 + :defaultExpand="true"
  41 + :height="(height - 200)">
  42 + <template #default="{row,prop,column}">
  43 + </template>
  44 + </cm-table-page>
  45 + </el-col>
  46 +</el-row>
  47 +
  48 +<ChangeUsersList :show="data.userDialogFlag" @hideDialog="showUserDialog" @savebtn="saveRel"></ChangeUsersList>
  1 +export default {
  2 + name: 'resourceTypePer',
  3 + template: '',
  4 + components: {
  5 + 'ChangeUsersList': Vue.defineAsyncComponent(
  6 + () => myImport('views/batchChangeLeaders/changeUsersList/index')
  7 + ),
  8 + },
  9 + data() {
  10 + },
  11 + props: {
  12 + item:{
  13 + type:Object,
  14 + default:{}
  15 + }
  16 + },
  17 + setup: function (props, {attrs, slots, emit}) {
  18 + const {proxy} = Vue.getCurrentInstance();
  19 + //列表高度
  20 + let height = Vue.ref(window.innerHeight);
  21 + let data = Vue.ref({
  22 + searchParams: {
  23 + "page": 1,
  24 + "limit": 50,
  25 + "keywords": "",
  26 + "userName": proxy.$route.query.username,
  27 + "busId": ""
  28 + },
  29 + userDialogFlag : false,
  30 + count: 0,
  31 + columns: [{
  32 + prop: "busTypeName",
  33 + label: "名称",
  34 + width: "250",
  35 + sortable: true,
  36 + align: 'left'
  37 + }, {
  38 + prop: "nickname",
  39 + label: "负责人",
  40 + width: "120",
  41 + sortable: true,
  42 + align: 'center'
  43 + }, {
  44 + prop: "busTypeDesc",
  45 + label: "业务描述",
  46 + width: "200",
  47 + sortable: true,
  48 + align: 'center'
  49 + }, {
  50 + prop: "isUse",
  51 + label: "是否使用",
  52 + sortable: true,
  53 + align: 'center',
  54 + render: (row) => {
  55 + switch (row.isUse) {
  56 + case 0:
  57 + return '否';
  58 + case 1:
  59 + return '是';
  60 + default:
  61 + return '';
  62 + }
  63 + }
  64 + }, {
  65 + prop: "important",
  66 + label: "重要程度",
  67 + sortable: true,
  68 + align: 'center',
  69 + render: (row) => {
  70 + switch (row.important) {
  71 + case 1:
  72 + return '核心';
  73 + case 2:
  74 + return '重要';
  75 + case 3:
  76 + return '一般';
  77 + case 9:
  78 + return '虚拟业务';
  79 + default:
  80 + return '';
  81 + }
  82 + }
  83 + }, {
  84 + prop: "sort",
  85 + label: "排序",
  86 + sortable: true,
  87 + align: 'center'
  88 + }],
  89 + tableData: [],
  90 + // 表格选中
  91 + checkArr:[]
  92 + })
  93 +
  94 +
  95 + const getList = () => {
  96 + proxy.$http.post(`/api-web/personnelChange/getList/bizPer`, data.value.searchParams, function (res) {
  97 + if (res && res.data) {
  98 + let dataVal = data.value;
  99 + let list = res.data;
  100 + let count = res.count;
  101 +
  102 + let tableData = list.filter(function (v) {
  103 + if (v.parentId == '0') {
  104 + // 获取子节点
  105 + let childs = list.filter(function (v1) {
  106 + if (v1.parentId != '0' && v1.parentId == v.busId) {
  107 + // 获取子节点
  108 + return v1;
  109 + }
  110 + }).sort(function (a, b) {
  111 + return a.sort - b.sort
  112 + })
  113 + v.children = childs;
  114 + return v;
  115 + }
  116 + }).sort(function (a, b) {
  117 + return a.sort - b.sort
  118 + })
  119 + dataVal.tableData = tableData;
  120 + dataVal.count = count;
  121 + }
  122 + })
  123 + }
  124 +
  125 + // 展示用户选择
  126 + let showUserDialog = (flg) =>{
  127 + data.value.userDialogFlag = flg;
  128 + }
  129 +
  130 + let saveRel = (obj) =>{
  131 + // 获取选中
  132 + let arr = data.value.checkArr;
  133 + if(arr.length == 0){
  134 + proxy.$global.showMsg('请至少选择一项','warning');
  135 + return;
  136 + }
  137 +
  138 + let params = {
  139 + targetUserName: obj.selectModel.join(''),
  140 + "userName": proxy.$route.query.username,
  141 + "busId": arr.join(',')
  142 + }
  143 + if(params.targetUserName == params.userName){
  144 + proxy.$global.showMsg('变更用户不能与变更前用户一致，请修改！','warning');
  145 + return;
  146 + }
  147 + proxy.$http.post(`/api-web/personnelChange/update/bizPer`,params, function (res) {
  148 + if (res && res.success) {
  149 + proxy.$global.showMsg('变更成功！');
  150 + showUserDialog(false);
  151 + // 刷新表格
  152 + getList();
  153 + }
  154 + })
  155 + }
  156 +
  157 + // 变更
  158 + let changeUser = () =>{
  159 + // 获取选中
  160 + let arr = data.value.checkArr;
  161 + if(arr.length == 0){
  162 + proxy.$global.showMsg('请至少选择一项','warning');
  163 + return;
  164 + }
  165 +
  166 + showUserDialog(true);
  167 + }
  168 +
  169 + /**
  170 + * 取消
  171 + */
  172 + let removeRel = () =>{
  173 + let arr = data.value.checkArr;
  174 + if(arr.length == 0){
  175 + proxy.$global.showMsg('请至少选择一项','warning');
  176 + return;
  177 + }
  178 +
  179 + data.value.searchParams.busId = arr.join(',')
  180 + proxy.$global.confirm("确定取消相关资源？", function () {
  181 + proxy.$http.post(`/api-web/personnelChange/remove/bizPer`, data.value.searchParams , function (res) {
  182 + if (res && res.success) {
  183 + proxy.$global.showMsg('取消成功！');
  184 + getList()
  185 + }
  186 + })
  187 + });
  188 + }
  189 +
  190 + //重新加载表格数据
  191 + let loadTableDataList = ({page, limit}) => {
  192 + let dataVal = data.value;
  193 + dataVal.page = page;
  194 + dataVal.limit = limit;
  195 + getList();
  196 + }
  197 +
  198 + // 表格全选事件
  199 + let selectionChange = (val) => {
  200 + let checkArr = [];
  201 + val.map(item => {
  202 + checkArr.push(item.busId)
  203 + })
  204 + data.value.checkArr = checkArr;
  205 + let isCheck = (list, checkArr) => {
  206 + list.forEach((v, i) => {
  207 + v.checked = checkArr.includes(v.busId);
  208 + if (v.children) {
  209 + isCheck(v.children, checkArr);
  210 + }
  211 + });
  212 + }
  213 + isCheck(data.value.tableData, checkArr);
  214 + }
  215 +
  216 + // 挂载完
  217 + Vue.onMounted(() => {
  218 + getList();
  219 + })
  220 +
  221 + return {
  222 + height,
  223 + data,
  224 + getList,
  225 + changeUser,
  226 + showUserDialog,
  227 + removeRel,
  228 + loadTableDataList,
  229 + selectionChange,
  230 + saveRel
  231 + }
  232 + }
  233 +}
  1 +<cm-dialog :title="title" width="500px" :showDialogVisible="show" @hidedialog="hidedialog" @okfunc="getUser">
  2 + <template v-slot>
  3 + <el-row >
  4 + <el-col :span="24" class="table-height">
  5 + <span v-if="isTwoGroup">主负责人：</span>
  6 + <el-select
  7 + v-model="selectModel"
  8 + :multiple="isMulti"
  9 + placeholder="请选择用户"
  10 + style="width:80%"
  11 + clearable
  12 + filterable
  13 + >
  14 + <el-option
  15 + v-for="item in userList"
  16 + :key="item.username"
  17 + :label="item.nickname"
  18 + :value="item.username"
  19 + >
  20 + <div >
  21 + <span>{{item.orgName}}/{{item.nickname}}</span>
  22 + </div>
  23 + </el-option>
  24 + </el-select>
  25 + </el-col>
  26 + </el-row>
  27 + <el-row v-if="isTwoGroup" style="margin-top:10px;">
  28 + <el-col :span="24">
  29 + <span>辅负责人：</span>
  30 + <el-select
  31 + v-model="selectModelSecond"
  32 + multiple
  33 + placeholder="请选择用户"
  34 + style="width:80%"
  35 + clearable
  36 + filterable
  37 + >
  38 + <el-option
  39 + v-for="item in userListSecond"
  40 + :key="item.username"
  41 + :label="item.nickname"
  42 + :value="item.username"
  43 + >
  44 + <div >
  45 + <span>{{item.orgName}}/{{item.nickname}}</span>
  46 + </div>
  47 + </el-option>
  48 + </el-select>
  49 + </el-col>
  50 + </el-row>
  51 + </template>
  52 +</cm-dialog>
  1 +export default {
  2 + name: 'changeUsersList',
  3 + template: '',
  4 + components: {
  5 +
  6 + },
  7 + data() {
  8 + },
  9 + props: {
  10 + title: {
  11 + type: String,
  12 + default: '用户列表'
  13 + },
  14 + show:{
  15 + type:Boolean,
  16 + default: false
  17 + },
  18 + //是否为多选
  19 + isMulti:{
  20 + type:Boolean,
  21 + default:false
  22 + },
  23 + //如果是主/辅负责人时为true
  24 + isTwoGroup:{
  25 + type:Boolean,
  26 + default:false
  27 + }
  28 + },
  29 + setup: function (props, {attrs, slots, emit}) {
  30 + const {proxy} = Vue.getCurrentInstance();
  31 + let height=Vue.ref(window.innerHeight);
  32 + let selectModel=Vue.ref([]);
  33 + let selectModelSecond=Vue.ref([]);
  34 +
  35 + let hidedialog = () => {
  36 + emit('hideDialog', false);
  37 + }
  38 + let getUser = () =>{
  39 + let obj={}
  40 + let arr=[];
  41 + if(props.isMulti){
  42 + arr=selectModel.value
  43 + }else{
  44 + arr=[selectModel.value];
  45 + }
  46 + if(props.isTwoGroup){
  47 + obj={
  48 + selectModel: arr,
  49 + selectModelSecond: selectModelSecond.value
  50 + }
  51 + }else{
  52 + obj={
  53 + selectModel: arr,
  54 + }
  55 + }
  56 + emit('savebtn', obj);
  57 +
  58 + }
  59 + let search=Vue.ref({
  60 + username:'',
  61 + nickname:'',
  62 + enabled:'',
  63 + orgId:'',
  64 + roles:'',
  65 + limit:999999,
  66 + page:1
  67 + })
  68 + let userList=Vue.ref([]);
  69 + let userListSecond=Vue.ref([]);
  70 + let count=Vue.ref(0);
  71 + //获取所有用户
  72 + let getAllUser = () =>{
  73 + proxy.$http.get('/api-user/users', search.value, function (res) {
  74 + if (res && res.data) {
  75 + userList.value=res.data;
  76 + userListSecond.value=res.data;
  77 + count.value=res.count;
  78 + }
  79 + })
  80 + }
  81 + // 挂载完
  82 + Vue.onMounted(() => {
  83 + getAllUser();
  84 + })
  85 + return {
  86 + selectModel,
  87 + height,
  88 + selectModelSecond,
  89 + getAllUser,
  90 + userList,
  91 + userListSecond,
  92 + count,
  93 + hidedialog,
  94 + getUser,
  95 + search
  96 + }
  97 + }
  98 +}
  1 +<el-row>
  2 + <el-col :span="24" class="search">
  3 + <div class="condition" style="display: flex;">
  4 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;width: 300px">
  5 + <el-input v-model="data.searchParams.keywords" placeholder="关键字支持：名称、负责人、业务描述"></el-input>
  6 + </el-form-item>
  7 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  8 + <el-button @click="getList">查询</el-button>
  9 + </el-form-item>
  10 +
  11 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  12 + <el-button type="primary" @click="removeRel">取消</el-button>
  13 + </el-form-item>
  14 +
  15 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  16 + <el-button type="primary" @click="changeUser">变更</el-button>
  17 + </el-form-item>
  18 +
  19 + </div>
  20 + </el-col>
  21 +</el-row>
  22 +<el-row style="font-size: 12px;color: grey;padding: 6px;">
  23 + {{item.ddicDesc}}
  24 +</el-row>
  25 +<el-row class="margin-bottom-50" style="margin-top: 3px">
  26 + <el-col :span="24" class="table-height">
  27 + <cm-table-page :columns="data.columns"
  28 + :dataList="data.tableData"
  29 + :treeProps="{ children: 'children', hasChildren: 'hasChildren' }"
  30 + :total="data.count"
  31 + :pageSize="data.searchParams.limit"
  32 + @loaddata="loadTableDataList"
  33 + @selectionChange="selectionChange"
  34 + :showIndex="true"
  35 + :showSelection="true"
  36 + :showBorder="true"
  37 + :loading="loading"
  38 + :showPage="true"
  39 + :showTools="false"
  40 + :height="(height - 200)">
  41 + <template #default="{row,prop,column}">
  42 + </template>
  43 + </cm-table-page>
  44 + </el-col>
  45 +</el-row>
  46 +
  47 +<ChangeUsersList :show="data.userDialogFlag" @hideDialog="showUserDialog" @savebtn="saveRel"></ChangeUsersList>
  1 +export default {
  2 + name: 'fileManagePer',
  3 + template: '',
  4 + components: {
  5 + 'ChangeUsersList': Vue.defineAsyncComponent(
  6 + () => myImport('views/batchChangeLeaders/changeUsersList/index')
  7 + ),
  8 + },
  9 + data() {
  10 + },
  11 + props: {
  12 + item:{
  13 + type:Object,
  14 + default:{}
  15 + }
  16 + },
  17 + setup: function (props, {attrs, slots, emit}) {
  18 + const {proxy} = Vue.getCurrentInstance();
  19 + //列表高度
  20 + let height = Vue.ref(window.innerHeight);
  21 + let data = Vue.ref({
  22 + searchParams: {
  23 + "page": 1,
  24 + "limit": 50,
  25 + "keywords": "",
  26 + "userName": proxy.$route.query.username,
  27 + "docId": ""
  28 + },
  29 + userDialogFlag: false,
  30 + count: 0,
  31 + columns: [{
  32 + prop: "name",
  33 + label: "名称",
  34 + width: "350",
  35 + sortable: true,
  36 + align: 'center'
  37 + }, {
  38 + prop: "docNo",
  39 + label: "文档编号",
  40 + width: "100",
  41 + sortable: true,
  42 + align: 'center'
  43 + }, {
  44 + prop: "createUserName",
  45 + label: "创建用户",
  46 + width: "100",
  47 + sortable: true,
  48 + align: 'center'
  49 + }, {
  50 + prop: "localPath",
  51 + label: "文档地址",
  52 + sortable: true,
  53 + align: 'left'
  54 + }],
  55 + tableData: [],
  56 + // 表格选中
  57 + checkArr: []
  58 + })
  59 +
  60 +
  61 + const getList = () => {
  62 + proxy.$http.post(`/api-web/personnelChange/getList/fileManagePer`, data.value.searchParams, function (res) {
  63 + if (res && res.data) {
  64 + let dataVal = data.value;
  65 + let list = res.data;
  66 + let count = res.count;
  67 +
  68 + dataVal.tableData = list;
  69 + dataVal.count = count;
  70 + }
  71 + })
  72 + }
  73 +
  74 + // 展示用户选择
  75 + let showUserDialog = (flg) => {
  76 + data.value.userDialogFlag = flg;
  77 + }
  78 +
  79 + let saveRel = (obj) => {
  80 + // 获取选中
  81 + let arr = data.value.checkArr;
  82 + if (arr.length == 0) {
  83 + proxy.$global.showMsg('请至少选择一项', 'warning');
  84 + return;
  85 + }
  86 +
  87 + let params = {
  88 + targetUserName: obj.selectModel.join(''),
  89 + "userName": proxy.$route.query.username,
  90 + "docId": arr.join(',')
  91 + }
  92 + if (params.targetUserName == params.userName) {
  93 + proxy.$global.showMsg('变更用户不能与变更前用户一致，请修改！', 'warning');
  94 + return;
  95 + }
  96 + proxy.$http.post(`/api-web/personnelChange/update/fileManagePer`, params, function (res) {
  97 + if (res && res.success) {
  98 + proxy.$global.showMsg('变更成功！');
  99 + showUserDialog(false);
  100 + // 刷新表格
  101 + getList();
  102 + }
  103 + })
  104 + }
  105 +
  106 + // 变更
  107 + let changeUser = () => {
  108 + // 获取选中
  109 + let arr = data.value.checkArr;
  110 + if (arr.length == 0) {
  111 + proxy.$global.showMsg('请至少选择一项', 'warning');
  112 + return;
  113 + }
  114 +
  115 + showUserDialog(true);
  116 + }
  117 +
  118 + /**
  119 + * 取消
  120 + */
  121 + let removeRel = () => {
  122 + let arr = data.value.checkArr;
  123 + if (arr.length == 0) {
  124 + proxy.$global.showMsg('请至少选择一项', 'warning');
  125 + return;
  126 + }
  127 +
  128 + data.value.searchParams.docId = arr.join(',')
  129 + proxy.$global.confirm("确定取消相关资源？", function () {
  130 + proxy.$http.post(`/api-web/personnelChange/remove/fileManagePer`, data.value.searchParams, function (res) {
  131 + if (res && res.success) {
  132 + proxy.$global.showMsg('取消成功！');
  133 + getList()
  134 + }
  135 + })
  136 + });
  137 + }
  138 +
  139 + //重新加载表格数据
  140 + let loadTableDataList = ({page, limit}) => {
  141 + let dataVal = data.value;
  142 + dataVal.page = page;
  143 + dataVal.limit = limit;
  144 + getList();
  145 + }
  146 +
  147 + // 表格全选事件
  148 + let selectionChange = (val) => {
  149 + let checkArr = [];
  150 + val.map(item => {
  151 + checkArr.push(item.id)
  152 + })
  153 + data.value.checkArr = checkArr;
  154 + let isCheck = (list, checkArr) => {
  155 + list.forEach((v, i) => {
  156 + v.checked = checkArr.includes(v.id);
  157 + if (v.children) {
  158 + isCheck(v.children, checkArr);
  159 + }
  160 + });
  161 + }
  162 + isCheck(data.value.tableData, checkArr);
  163 + }
  164 +
  165 + // 挂载完
  166 + Vue.onMounted(() => {
  167 + getList();
  168 + })
  169 +
  170 + return {
  171 + height,
  172 + data,
  173 + getList,
  174 + changeUser,
  175 + showUserDialog,
  176 + removeRel,
  177 + loadTableDataList,
  178 + selectionChange,
  179 + saveRel
  180 + }
  181 + }
  182 +}
  1 +<div class="batchChange-container" style="padding:10px;">
  2 + <el-row >
  3 + <el-col :span="22">
  4 + <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
  5 + <el-tab-pane v-for="(item,index) in tabData" :key="index" :label="item.ddicName" :name="item.ddicCode">
  6 + </el-tab-pane>
  7 + </el-tabs>
  8 + </el-col>
  9 + <el-col :span="2">
  10 + <div style="padding:0 10px 6px;border-bottom: 2px solid var(--el-border-color-light);">
  11 + <el-button type="primary" @click="exportClick()" size="small" style="margin-left: 6px">导出</el-button>
  12 + </div>
  13 + </el-col>
  14 + </el-row>
  15 + <el-row>
  16 + <el-col :span="24">
  17 + <component :is="activeName" :item="itemInfo" ref="roomDetail" />
  18 + </el-col>
  19 + </el-row>
  20 +</div>
  21 +<cm-dialog :title="title" width="500px" :showDialogVisible="show" @hidedialog="hidedialog" @okfunc="okExport">
  22 + <template v-slot>
  23 + <el-row>
  24 + <el-col :span="24">
  25 + <el-radio-group v-model="isAll">
  26 + <el-radio :label="1">导出全部</el-radio>
  27 + <el-radio :label="0">导出部分</el-radio>
  28 + </el-radio-group>
  29 + </el-col>
  30 + </el-row>
  31 + <el-row v-if="isAll==0">
  32 + <el-col :span="24" class="table-height">
  33 + <el-select
  34 + v-model="selectModel"
  35 + placeholder="请选择需要导出的页签"
  36 + multiple
  37 + style="width:80%"
  38 + clearable
  39 + filterable>
  40 + <el-option
  41 + v-for="item in tabData"
  42 + :key="item.ddicCode"
  43 + :label="item.ddicName"
  44 + :value="item.ddicCode"
  45 + />
  46 + </el-select>
  47 + </el-col>
  48 + </el-row>
  49 +
  50 + </template>
  51 +</cm-dialog>
  1 +export default {
  2 + name: 'batchChangeLeaders',
  3 + template: '',
  4 + components: {
  5 + //选项卡组件
  6 + 'resourcePer': Vue.defineAsyncComponent(
  7 + () => myImport('views/batchChangeLeaders/resourcePer/index')
  8 + ),
  9 + 'resourceLeader': Vue.defineAsyncComponent(
  10 + () => myImport('views/batchChangeLeaders/resourceLeader/index')
  11 + ),
  12 + 'resourceTypePer': Vue.defineAsyncComponent(
  13 + () => myImport('views/batchChangeLeaders/resourceTypePer/index')
  14 + ),
  15 + 'bizPer': Vue.defineAsyncComponent(
  16 + () => myImport('views/batchChangeLeaders/bizPer/index')
  17 + ),
  18 + 'bizLeader': Vue.defineAsyncComponent(
  19 + () => myImport('views/batchChangeLeaders/bizLeader/index')
  20 + ),
  21 + 'alarmSubPer': Vue.defineAsyncComponent(
  22 + () => myImport('views/batchChangeLeaders/alarmSubPer/index')
  23 + ),
  24 + 'rolePer': Vue.defineAsyncComponent(
  25 + () => myImport('views/batchChangeLeaders/rolePer/index')
  26 + ),
  27 + 'topoPer': Vue.defineAsyncComponent(
  28 + () => myImport('views/batchChangeLeaders/topoPer/index')
  29 + ),
  30 + 'autoPatrolPortPer': Vue.defineAsyncComponent(
  31 + () => myImport('views/batchChangeLeaders/autoPatrolPortPer/index')
  32 + ),
  33 + 'fileManagePer': Vue.defineAsyncComponent(
  34 + () => myImport('views/batchChangeLeaders/fileManagePer/index')
  35 + ),
  36 + },
  37 + data() {
  38 + },
  39 + props: {
  40 + },
  41 + setup: function (props, {attrs, slots, emit}) {
  42 + const {proxy} = Vue.getCurrentInstance();
  43 + const tabData=Vue.ref();//页签列表数据
  44 + const activeName = Vue.ref('');//标签页显示的页签名称
  45 + let itemInfo = Vue.ref({});
  46 + let selectModel=Vue.ref([]);//导出列表选中的数据
  47 + let title=Vue.ref('导出列表');//导出列表弹框名称
  48 + let show=Vue.ref(false);//导出列表弹框是否显示
  49 + let isAll=Vue.ref(1);//导出全部或者部分
  50 + //页签点击事件
  51 + const handleClick = (tab, event) => {
  52 + //console.log(tab, event)
  53 + let code = tab.props.name;
  54 + tabData.value.filter((item) =>{
  55 + if(item.ddicCode == code) {
  56 + itemInfo.value = item;
  57 + }
  58 + })
  59 + }
  60 + //导出点击事件
  61 + const exportClick=()=>{
  62 + show.value=true;
  63 + }
  64 + //导出全部按钮点击事件
  65 + const clickAll=()=>{
  66 + let arr=[];
  67 + tabData.value.map(item=>{
  68 + arr.push(item.ddicCode)
  69 + })
  70 + selectModel.value=arr;
  71 + }
  72 + //导出弹框关闭事件
  73 + let hidedialog=(flag)=>{
  74 + show.value=flag;
  75 + }
  76 + //导出弹框确认事件
  77 + let okExport=()=>{
  78 + let params={
  79 + userName:proxy.$route.query.username,
  80 + }
  81 + if(isAll.value==0){
  82 + if(selectModel.value && selectModel.value.length>0){
  83 + params.code=selectModel.value.join(',');
  84 + }else{
  85 + proxy.$global.showMsg('请选择导出所需列表','warning');
  86 + return;
  87 + }
  88 + }else{
  89 + params.code='';
  90 + }
  91 + proxy.$http.downloadFile("/api-web/personnelChange/export", params);
  92 + }
  93 + //获取需变更的选项卡数据
  94 + let getBatchChangeData=()=>{
  95 + proxy.$http.post("/api-web/manage/ddic/findSucDdics/batch_change_leaders", {}, function (res) {
  96 + if (res && res.data && res.data.length>0) {
  97 + tabData.value = res.data.sort((a,b)=>a.ddicSort-b.ddicSort);
  98 + activeName.value=tabData.value[0].ddicCode;
  99 + itemInfo.value = tabData.value[0];
  100 + }
  101 + })
  102 + }
  103 + // 挂载完
  104 + Vue.onMounted(() => {
  105 + getBatchChangeData();
  106 + })
  107 + return {
  108 + getBatchChangeData,
  109 + activeName,
  110 + handleClick,
  111 + tabData,
  112 + selectModel,
  113 + title,
  114 + show,
  115 + exportClick,
  116 + hidedialog,
  117 + okExport,
  118 + clickAll,
  119 + isAll,
  120 + itemInfo
  121 + }
  122 + }
  123 +}
  1 +<el-row>
  2 + <el-col :span="24" class="search">
  3 + <div class="condition" >
  4 + <el-form ref=“form” style="display: flex;">
  5 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;width: 300px">
  6 + <el-input v-model="search.keyword" placeholder="关键字支持：资源名称、IP"></el-input>
  7 + </el-form-item>
  8 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  9 + <el-select filterable clearable v-model="search.resType" placeholder="请选择资源类型">
  10 + <el-option
  11 + v-for="item in resTypeOptions"
  12 + :key="item.resTypeCode"
  13 + :label="item.resTypeName"
  14 + :value="item.resTypeCode">
  15 + </el-option>
  16 + </el-select>
  17 + </el-form-item>
  18 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  19 + <el-button @click="getListData">查询</el-button>
  20 + </el-form-item>
  21 +
  22 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  23 + <el-button type="primary" @click="changeCancel()" >取消</el-button>
  24 + </el-form-item>
  25 +
  26 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  27 + <el-button type="primary" @click="changeAdmin()" style="margin-left: 6px">变更</el-button>
  28 + </el-form-item>
  29 + </el-form>
  30 + </div>
  31 + </el-col>
  32 +</el-row>
  33 +<!--<el-row style="margin-bottom: 10px;">
  34 + <div class="flex-div-start">
  35 + <el-button type="primary" @click="changeCancel()" size="small">取消</el-button>
  36 + <el-button type="primary" @click="changeAdmin()" size="small" style="margin-left: 6px">变更</el-button>
  37 + </div>
  38 +</el-row>-->
  39 +<el-row style="font-size: 12px;color: grey;padding: 6px;">
  40 + {{item.ddicDesc}}
  41 +</el-row>
  42 +<el-row class="margin-bottom-50" style="margin-top: 3px">
  43 + <el-col :span="24" class="table-height">
  44 + <cm-table-page :columns="columns"
  45 + :dataList="resourceData"
  46 + :total="count"
  47 + :pageSize="search.limit"
  48 + @loaddata="loadTableDataList"
  49 + @selectionChange="selectionChange"
  50 + :showIndex="true"
  51 + :showSelection="true"
  52 + :showBorder="true"
  53 + :loading="loading"
  54 + :showPage="true"
  55 + :showTools="false"
  56 + :height="(height - 200)">
  57 + <template #default="{row,prop,column}">
  58 + <div v-if="prop == 'paramDesc'">
  59 + <el-select v-if="row.resType == 'HOST_X86SERVER'" v-model="row.showType" placeholder="">
  60 + <el-option
  61 + v-for="item in showTypeList"
  62 + :key="item.value"
  63 + :label="item.name"
  64 + :value="item.value"
  65 + >
  66 + </el-option>
  67 + </el-select>
  68 + </div>
  69 + </template>
  70 + </cm-table-page>
  71 + </el-col>
  72 +</el-row>
  73 +
  74 +<ChangeUsersList :show="show" :isTwoGroup="isTwoGroup" :isMulti="isMulti" @hideDialog="hideDialog" @savebtn="savebtn"></ChangeUsersList>
  1 +export default {
  2 + name: 'resourceLeader',
  3 + template: '',
  4 + components: {
  5 + 'ChangeUsersList': Vue.defineAsyncComponent(
  6 + () => myImport('views/batchChangeLeaders/changeUsersList/index')
  7 + ),
  8 + },
  9 + data() {
  10 + },
  11 + props: {
  12 + item:{
  13 + type:Object,
  14 + default:{}
  15 + }
  16 + },
  17 + setup: function (props, {attrs, slots, emit}) {
  18 + const {proxy} = Vue.getCurrentInstance();
  19 + //接收从用户列表中选中的用户
  20 + let userName=Vue.ref(proxy.$route.query.username);
  21 + //变更人员弹框
  22 + let show=Vue.ref(false);
  23 + //变更人员列表是否多选
  24 + let isMulti=Vue.ref(false);
  25 + //变更人员列表是否是两组
  26 + let isTwoGroup=Vue.ref(false);
  27 + //配置列表总数
  28 + let count = Vue.ref(0);
  29 + //列表高度
  30 + let height = Vue.ref(window.innerHeight);
  31 + //加载
  32 + let loading = Vue.ref(true);
  33 + //选中数据
  34 + let pitch = Vue.ref([]);
  35 + let showTypeList=Vue.ref([]);
  36 + let search = Vue.ref({
  37 + resType: '',
  38 + keyword: '',
  39 + page: 1,
  40 + limit: 50,
  41 + });
  42 + let resTypeOptions=Vue.ref([])
  43 + const columns = [
  44 + {
  45 + prop: 'resName',
  46 + label: '资源名称',
  47 + sortable: true,
  48 + align: 'center',
  49 + render: function (row) {
  50 + if(!row.resName){
  51 + return row.resCode;
  52 + }
  53 + return row.resName;
  54 + }
  55 + },
  56 + {
  57 + prop: 'ip',
  58 + label: 'IP地址',
  59 + sortable: true,
  60 + align: 'center',
  61 + },
  62 + {
  63 + prop: 'port',
  64 + label: '端口号',
  65 + sortable: true,
  66 + align: 'center',
  67 + },
  68 + {
  69 + prop: 'resMainAdmin',
  70 + label: '负责人',
  71 + sortable: true,
  72 + align: 'center',
  73 + render: function (row) {
  74 + let text = "";
  75 + let preFix = "";
  76 + if(row.resMainAdmin && row.resMainAdmin.includes(userName.value)){
  77 + // 主要负责人
  78 + text = row.resMainAdmin
  79 + preFix = "主";
  80 + } else {
  81 + // 辅负责人
  82 + text = row.resAuxiliaryAdmin
  83 + preFix = "辅";
  84 + }
  85 +
  86 + return `<div style="display: flex">
  87 + <div style='width: 22px;height: 22px;border-radius: 50%;line-height: 22px;border: solid 1px #5fafff;font-size: 12px;font-weight: bold;margin-right: 3px'>
  88 + ${preFix}
  89 + </div>
  90 + ${text}
  91 + </div>`;
  92 + }
  93 + },
  94 + {
  95 + prop: 'resTypeName',
  96 + label: '资源类型',
  97 + sortable: true,
  98 + align: 'center',
  99 + },
  100 + {
  101 + prop: 'state',
  102 + label: '资源状态',
  103 + sortable: true,
  104 + align: 'center',
  105 + render: function (row) {
  106 + switch (row.state) {
  107 + case "new" :
  108 + return '<span style="background-color: #eee;color:#666;border-radius: 100px;padding:0 8px;display: inline-block;height:24px;line-height: 24px;">未监控</span>'
  109 + case "monitor" :
  110 + return '<span style="background-color: #0BAC33;color:#fff;border-radius: 100px;padding:0 8px;display: inline-block;height:24px;line-height: 24px;">监控中</span>'
  111 + case "stop" :
  112 + return '<span style="background-color: #d81e06;color:#fff;border-radius: 100px;padding:0 8px;display: inline-block;height:24px;line-height: 24px;">暂停</span>'
  113 + default :
  114 + return '<span style="background-color: #eee;color:#666;border-radius: 100px;padding:0 8px;display: inline-block;height:24px;line-height: 24px;">未监控</span>'
  115 + }
  116 + }
  117 + },
  118 + {
  119 + prop: 'resCategory',
  120 + label: '资源分类',
  121 + sortable: true,
  122 + align: 'center',
  123 + /* render: function (row) {
  124 +
  125 + }*/
  126 + }
  127 + ];
  128 +
  129 + //列表数据
  130 + let resourceData = Vue.ref([]);
  131 + //获取列表数据
  132 + const getListData = () => {
  133 + loading.value = true;
  134 + //定义列表参数
  135 + let getParams = {
  136 + resType:search.value.resType,
  137 + keywords:search.value.keyword,
  138 + userName:userName.value,
  139 + page: search.value.page,
  140 + limit: search.value.limit
  141 + };
  142 + proxy.$http.post("/api-web/personnelChange/getList/resourceLeader", getParams, function (res) {
  143 + if (res && res.data) {
  144 + resourceData.value = res.data ? res.data : [];
  145 + count.value = res.count;
  146 + loading.value = false;
  147 + }
  148 + })
  149 + }
  150 + //重新加载表格数据
  151 + let loadTableDataList = ({page, limit}) => {
  152 + search.value.page=page;
  153 + search.value.limit=limit;
  154 + getListData();
  155 + }
  156 + let resIds=Vue.ref('');//选中的ids
  157 + //表格全选事件
  158 + let selectionChange = (val) => {
  159 + pitch.value = val;
  160 + let arr=[];
  161 + pitch.value.map(item=>{
  162 + arr.push(item.resId)
  163 + })
  164 + resIds.value=arr.join(",");//选中的值
  165 + }
  166 + //获取资源类型数据
  167 + let getResourceTypoe=()=>{
  168 + proxy.$http.get(`/api-web/manage/restype/list`, {}, function (res) {
  169 + if (res && res.data) {
  170 + resTypeOptions.value=res.data
  171 + }
  172 + })
  173 + }
  174 + //获取展示类型的字典数据
  175 + let initShowType=()=>{
  176 + proxy.$http.post("/api-web/manage/ddic/findSucDdics/DETAILS_POWER", {}, function (res) {
  177 + if (res && res.data) {
  178 + let arr=res.data;
  179 + if(arr && arr.length>0){
  180 + arr.map(v=>{
  181 + showTypeList.value.push({
  182 + name: v.ddicName
  183 + ,value: v.ddicCode.substring(v.ddicCode.lastIndexOf("_")+1,v.ddicCode.length)
  184 + });
  185 + })
  186 + }
  187 +
  188 + }
  189 + })
  190 + }
  191 + //批量取消相关资源
  192 + let changeCancel = () => {
  193 + if(pitch.value.length<1){
  194 + proxy.$global.showMsg('请至少选择一项','warning');
  195 + }else{
  196 + proxy.$global.confirm("确定取消相关资源？", function () {
  197 + let parmas={
  198 + userName:userName.value,
  199 + resId:resIds.value
  200 + }
  201 + proxy.$http.post(`/api-web/personnelChange/remove/resourceLeader`, parmas, function (res) {
  202 + if (res && res.success) {
  203 + proxy.$global.showMsg('取消成功！');
  204 + getListData()
  205 + }
  206 + })
  207 + });
  208 + }
  209 + }
  210 + //变更负责人
  211 + let changeAdmin = () => {
  212 + if(pitch.value.length<1){
  213 + proxy.$global.showMsg('请至少选择一项','warning');
  214 +
  215 + }else{
  216 + show.value=true;
  217 + }
  218 +
  219 + }
  220 + //变更人员的弹框关闭后
  221 + let hideDialog =(flag)=>{
  222 + show.value=flag;
  223 + }
  224 + //变更人员的弹框保存后
  225 + let savebtn =(obj)=>{
  226 + show.value=false;
  227 + //obj.selectModel 选中的用户组（一个/主负责人) obj.selectModelSecond 辅负责人，都是数组
  228 + let targetUserName='';
  229 + if(obj.selectModel){
  230 + targetUserName=obj.selectModel.join(',')
  231 + }
  232 + let params={
  233 + resId:resIds.value,
  234 + targetUserName:targetUserName,
  235 + userName:userName.value,
  236 + }
  237 + proxy.$http.post(`/api-web/personnelChange/update/resourceLeader`, params, function (res) {
  238 + if (res && res.success) {
  239 + proxy.$global.showMsg('变更成功！');
  240 + getListData()
  241 + }
  242 + })
  243 + }
  244 + // 挂载完
  245 + Vue.onMounted(() => {
  246 + initShowType();
  247 + getResourceTypoe();
  248 + getListData();
  249 + })
  250 + return {
  251 + isMulti,
  252 + isTwoGroup,
  253 + show,
  254 + initShowType,
  255 + showTypeList,
  256 + search,
  257 + resTypeOptions,
  258 + changeCancel,
  259 + count,
  260 + hideDialog,
  261 + savebtn,
  262 + changeAdmin,
  263 + getResourceTypoe,
  264 +
  265 + resourceData,
  266 + columns,
  267 + height,
  268 + loading,
  269 +
  270 + selectionChange,
  271 +
  272 + getListData,
  273 + loadTableDataList,
  274 + userName
  275 + }
  276 + }
  277 +}
  1 +<el-row>
  2 + <el-col :span="24" class="search">
  3 + <div class="condition" >
  4 + <el-form ref=“form” style="display: flex;">
  5 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;width: 300px">
  6 + <el-input v-model="search.keyword" placeholder="关键字支持：资源名称、IP"></el-input>
  7 + </el-form-item>
  8 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  9 + <el-select filterable clearable v-model="search.resType" placeholder="请选择资源类型">
  10 + <el-option
  11 + v-for="item in resTypeOptions"
  12 + :key="item.resTypeCode"
  13 + :label="item.resTypeName"
  14 + :value="item.resTypeCode">
  15 + </el-option>
  16 + </el-select>
  17 + </el-form-item>
  18 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  19 + <el-button @click="getListData" >查询</el-button>
  20 + </el-form-item>
  21 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  22 + <el-button type="primary" @click="changeCancel()">取消</el-button>
  23 + </el-form-item>
  24 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  25 + <el-button type="primary" @click="changeAdmin()" style="margin-left: 6px">变更</el-button>
  26 + </el-form-item>
  27 + </el-form>
  28 + </div>
  29 + </el-col>
  30 +</el-row>
  31 +<!--<el-row style="margin-bottom: 10px;">
  32 + <div class="flex-div-start">
  33 + <el-button type="primary" @click="changeCancel()" size="small">取消</el-button>
  34 + <el-button type="primary" @click="changeAdmin()" size="small" style="margin-left: 6px">变更</el-button>
  35 + </div>
  36 +</el-row>-->
  37 +<el-row style="font-size: 12px;color: grey;padding: 6px;">
  38 + {{item.ddicDesc}}
  39 +</el-row>
  40 +<el-row class="margin-bottom-50" style="margin-top: 3px">
  41 + <el-col :span="24" class="table-height">
  42 + <cm-table-page :columns="columns"
  43 + :dataList="resourceData"
  44 + :total="count"
  45 + :pageSize="search.limit"
  46 + @loaddata="loadTableDataList"
  47 + @selectionChange="selectionChange"
  48 + :showIndex="true"
  49 + :showSelection="true"
  50 + :showBorder="true"
  51 + :loading="loading"
  52 + :showPage="true"
  53 + :showTools="false"
  54 + :height="(height - 200)">
  55 + <template #default="{row,prop,column}">
  56 + <div v-if="prop == 'paramDesc'">
  57 + <el-select v-if="row.resType == 'HOST_X86SERVER'" v-model="row.showType" placeholder="">
  58 + <el-option
  59 + v-for="item in showTypeList"
  60 + :key="item.value"
  61 + :label="item.name"
  62 + :value="item.value"
  63 + >
  64 + </el-option>
  65 + </el-select>
  66 + </div>
  67 + </template>
  68 + </cm-table-page>
  69 + </el-col>
  70 +</el-row>
  71 +
  72 +<ChangeUsersList :show="show" :isTwoGroup="isTwoGroup" :isMulti="isMulti" @hideDialog="hideDialog" @savebtn="savebtn"></ChangeUsersList>
  1 +export default {
  2 + name: 'resourcePer',
  3 + template: '',
  4 + components: {
  5 + 'ChangeUsersList': Vue.defineAsyncComponent(
  6 + () => myImport('views/batchChangeLeaders/changeUsersList/index')
  7 + ),
  8 + },
  9 + data() {
  10 + },
  11 + props: {
  12 + item:{
  13 + type:Object,
  14 + default:{}
  15 + }
  16 + },
  17 + setup: function (props, {attrs, slots, emit}) {
  18 + const {proxy} = Vue.getCurrentInstance();
  19 + //接收从用户列表中选中的用户
  20 + let userName=Vue.ref(proxy.$route.query.username);
  21 + //变更人员弹框
  22 + let show=Vue.ref(false);
  23 + //变更人员列表是否多选
  24 + let isMulti=Vue.ref(false);
  25 + //变更人员列表是否是两组
  26 + let isTwoGroup=Vue.ref(false);
  27 + //配置列表总数
  28 + let count = Vue.ref(0);
  29 + //列表高度
  30 + let height = Vue.ref(window.innerHeight);
  31 + //加载
  32 + let loading = Vue.ref(true);
  33 + //选中数据
  34 + let pitch = Vue.ref([]);
  35 + let showTypeList=Vue.ref([]);
  36 + let search = Vue.ref({
  37 + resType: '',
  38 + keyword: '',
  39 + page: 1,
  40 + limit: 50,
  41 + });
  42 + let resTypeOptions=Vue.ref([])
  43 + const columns = [
  44 + {
  45 + prop: 'resName',
  46 + label: '资源名称',
  47 + sortable: true,
  48 + align: 'center',
  49 + },
  50 + {
  51 + prop: 'ip',
  52 + label: 'IP地址',
  53 + sortable: true,
  54 + align: 'center',
  55 + },
  56 + {
  57 + prop: 'port',
  58 + label: '端口号',
  59 + sortable: true,
  60 + align: 'center',
  61 + },
  62 + {
  63 + prop: 'admin',
  64 + label: '负责人',
  65 + sortable: true,
  66 + align: 'center',
  67 + },
  68 + {
  69 + prop: 'resTypeName',
  70 + label: '资源类型',
  71 + sortable: true,
  72 + align: 'center',
  73 + },
  74 + {
  75 + prop: 'state',
  76 + label: '资源状态',
  77 + sortable: true,
  78 + align: 'center',
  79 + render: function (row) {
  80 + switch (row.state) {
  81 + case "new" :
  82 + return '<span style="background-color: #eee;color:#666;border-radius: 100px;padding:0 8px;display: inline-block;height:24px;line-height: 24px;">未监控</span>'
  83 + case "monitor" :
  84 + return '<span style="background-color: #0BAC33;color:#fff;border-radius: 100px;padding:0 8px;display: inline-block;height:24px;line-height: 24px;">监控中</span>'
  85 + case "stop" :
  86 + return '<span style="background-color: #d81e06;color:#fff;border-radius: 100px;padding:0 8px;display: inline-block;height:24px;line-height: 24px;">暂停</span>'
  87 + default :
  88 + return '<span style="background-color: #eee;color:#666;border-radius: 100px;padding:0 8px;display: inline-block;height:24px;line-height: 24px;">未监控</span>'
  89 + }
  90 + }
  91 + },
  92 + {
  93 + prop: 'paramDesc',
  94 + label: '展示类型',
  95 + sortable: true,
  96 + align: 'center',
  97 + /* render: function (row) {
  98 +
  99 + }*/
  100 + }
  101 + ];
  102 +
  103 + //列表数据
  104 + let resourceData = Vue.ref([]);
  105 + //获取列表数据
  106 + const getListData = () => {
  107 + // resourceData.value=[];
  108 + loading.value = true;
  109 + //定义列表参数
  110 + let getParams = {
  111 + resType:search.value.resType,
  112 + keywords:search.value.keyword,
  113 + userName:userName.value,
  114 + page: search.value.page,
  115 + limit: search.value.limit
  116 + };
  117 + proxy.$http.post("/api-web/personnelChange/getList/resourcePer", getParams, function (res) {
  118 + if (res && res.data) {
  119 + resourceData.value = res.data ? res.data : [];
  120 + count.value = res.count;
  121 + loading.value = false;
  122 + }
  123 + })
  124 + }
  125 + //重新加载表格数据
  126 + let loadTableDataList = ({page, limit}) => {
  127 + search.value.page=page;
  128 + search.value.limit=limit;
  129 + getListData();
  130 + }
  131 + let resIds=Vue.ref('');//选中的ids
  132 + //表格全选事件
  133 + let selectionChange = (val) => {
  134 + pitch.value = val;
  135 + let arr=[];
  136 + pitch.value.map(item=>{
  137 + arr.push(item.resId)
  138 + })
  139 + resIds.value=arr.join(",");//选中的值
  140 + /*proxy.resourceData.map((v, i) => {
  141 + v.checked = false;
  142 + });
  143 + let selectData = val;
  144 + if (selectData.length > 0) {
  145 + selectData.map((item, index) => {
  146 + proxy.resourceData.map((v, i) => {
  147 + if (item.id == v.id) {
  148 + v.checked = true;
  149 + }
  150 + })
  151 + })
  152 + } else {
  153 + proxy.resourceData.map((v, i) => {
  154 + v.checked = false;
  155 + })
  156 + }*/
  157 + }
  158 + //获取资源类型数据
  159 + let getResourceTypoe=()=>{
  160 + proxy.$http.get(`/api-web/manage/restype/list`, {}, function (res) {
  161 + if (res && res.data) {
  162 + resTypeOptions.value=res.data
  163 + }
  164 + })
  165 + }
  166 + //获取展示类型的字典数据
  167 + let initShowType=()=>{
  168 + proxy.$http.post("/api-web/manage/ddic/findSucDdics/DETAILS_POWER", {}, function (res) {
  169 + if (res && res.data) {
  170 + let arr=res.data;
  171 + if(arr && arr.length>0){
  172 + arr.map(v=>{
  173 + showTypeList.value.push({
  174 + name: v.ddicName
  175 + ,value: v.ddicCode.substring(v.ddicCode.lastIndexOf("_")+1,v.ddicCode.length)
  176 + });
  177 + })
  178 + }
  179 +
  180 + }
  181 + })
  182 + }
  183 + //批量取消相关资源
  184 + let changeCancel = () => {
  185 + if(pitch.value.length<1){
  186 + proxy.$global.showMsg('请至少选择一项','warning');
  187 + }else{
  188 + proxy.$global.confirm("确定取消相关资源？", function () {
  189 + let parmas={
  190 + userName:userName.value,
  191 + resId:resIds.value
  192 + }
  193 + proxy.$http.post(`/api-web/personnelChange/remove/resourcePer`, parmas, function (res) {
  194 + if (res && res.success) {
  195 + proxy.$global.showMsg('取消成功！');
  196 + getListData()
  197 + }
  198 + })
  199 + });
  200 + }
  201 + }
  202 + //变更负责人
  203 + let changeAdmin = () => {
  204 + if(pitch.value.length<1){
  205 + proxy.$global.showMsg('请至少选择一项','warning');
  206 +
  207 + }else{
  208 + show.value=true;
  209 + }
  210 +
  211 + }
  212 + //变更人员的弹框关闭后
  213 + let hideDialog =(flag)=>{
  214 + show.value=flag;
  215 + }
  216 + //变更人员的弹框保存后
  217 + let savebtn =(obj)=>{
  218 + show.value=false;
  219 + //obj.selectModel 选中的用户组（一个/主负责人) obj.selectModelSecond 辅负责人，都是数组
  220 + let targetUserName='';
  221 + if(obj.selectModel){
  222 + targetUserName=obj.selectModel.join(',')
  223 + }
  224 + let params={
  225 + resId:resIds.value,
  226 + targetUserName:targetUserName,
  227 + userName:userName.value,
  228 + }
  229 + proxy.$http.post(`/api-web/personnelChange/update/resourcePer`, params, function (res) {
  230 + if (res && res.success) {
  231 + proxy.$global.showMsg('变更成功！');
  232 + getListData()
  233 + }
  234 + })
  235 + }
  236 + // 挂载完
  237 + Vue.onMounted(() => {
  238 + initShowType();
  239 + getResourceTypoe();
  240 + getListData();
  241 + })
  242 + return {
  243 + isMulti,
  244 + isTwoGroup,
  245 + show,
  246 + initShowType,
  247 + showTypeList,
  248 + search,
  249 + resTypeOptions,
  250 + changeCancel,
  251 + count,
  252 + hideDialog,
  253 + savebtn,
  254 + changeAdmin,
  255 + getResourceTypoe,
  256 +
  257 + resourceData,
  258 + columns,
  259 + height,
  260 + loading,
  261 +
  262 + selectionChange,
  263 +
  264 + getListData,
  265 + loadTableDataList,
  266 + userName
  267 + }
  268 + }
  269 +}
  1 +<el-row>
  2 + <el-col :span="24" class="search">
  3 + <div class="condition" >
  4 + <el-form ref=“form” style="display: flex;">
  5 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;width: 300px">
  6 + <el-input v-model="search.keyword" placeholder="关键字支持：资源类型名称"></el-input>
  7 + </el-form-item>
  8 + <!-- <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  9 + <el-select filterable clearable v-model="search.resType" placeholder="请选择资源类型">
  10 + <el-option
  11 + v-for="item in resTypeOptions"
  12 + :key="item.resTypeCode"
  13 + :label="item.resTypeName"
  14 + :value="item.resTypeCode">
  15 + </el-option>
  16 + </el-select>
  17 + </el-form-item>-->
  18 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  19 + <el-button @click="getListData">查询</el-button>
  20 + </el-form-item>
  21 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  22 + <el-button type="primary" @click="changeCancel()" >取消</el-button>
  23 + </el-form-item>
  24 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  25 + <el-button type="primary" @click="changeAdmin()" style="margin-left: 6px">变更</el-button>
  26 + </el-form-item>
  27 + </el-form>
  28 + </div>
  29 + </el-col>
  30 +</el-row>
  31 +<!--<el-row style="margin-bottom: 10px;">
  32 + <div class="flex-div-start">
  33 + <el-button type="primary" @click="changeCancel()" size="small">取消</el-button>
  34 + <el-button type="primary" @click="changeAdmin()" size="small" style="margin-left: 6px">变更</el-button>
  35 + </div>
  36 +</el-row>-->
  37 +<el-row style="font-size: 12px;color: grey;padding: 6px;">
  38 + {{item.ddicDesc}}
  39 +</el-row>
  40 +<el-row class="margin-bottom-50" style="margin-top: 3px">
  41 + <el-col :span="24" class="table-height tree-table">
  42 + <cm-table-page :columns="columns"
  43 + :dataList="resourceData"
  44 + :total="count"
  45 + :pageSize="search.limit"
  46 + @loaddata="loadTableDataList"
  47 + @selectionChange="selectionChange"
  48 + :showIndex="true"
  49 + :showSelection="true"
  50 + :showBorder="true"
  51 + :loading="loading"
  52 + :showPage="true"
  53 + :showTools="false"
  54 + :getRowKeys="'resTypeId'"
  55 + :defaultExpand="true"
  56 + :height="(height - 200)">
  57 + <template #default="{row,prop,column}">
  58 + <div v-if="prop == 'showType'">
  59 + <el-select v-if="row.resType == 'HOST_X86SERVER'" v-model="row.showType" placeholder="">
  60 + <el-option
  61 + v-for="item in showTypeList"
  62 + :key="item.value"
  63 + :label="item.name"
  64 + :value="item.value"
  65 + >
  66 + </el-option>
  67 + </el-select>
  68 + </div>
  69 + </template>
  70 + </cm-table-page>
  71 + </el-col>
  72 +</el-row>
  73 +
  74 +<ChangeUsersList :show="show" :isTwoGroup="isTwoGroup" :isMulti="isMulti" @hideDialog="hideDialog" @savebtn="savebtn"></ChangeUsersList>
  1 +export default {
  2 + name: 'resourceTypePer',
  3 + template: '',
  4 + components: {
  5 + 'ChangeUsersList': Vue.defineAsyncComponent(
  6 + () => myImport('views/batchChangeLeaders/changeUsersList/index')
  7 + ),
  8 + },
  9 + data() {
  10 + },
  11 + props: {
  12 + item:{
  13 + type:Object,
  14 + default:{}
  15 + }
  16 + },
  17 + setup: function (props, {attrs, slots, emit}) {
  18 + const {proxy} = Vue.getCurrentInstance();
  19 + //接收从用户列表中选中的用户
  20 + let userName=Vue.ref(proxy.$route.query.username);
  21 + //变更人员弹框
  22 + let show=Vue.ref(false);
  23 + //变更人员列表是否多选
  24 + let isMulti=Vue.ref(false);
  25 + //变更人员列表是否是两组
  26 + let isTwoGroup=Vue.ref(false);
  27 + //配置列表总数
  28 + let count = Vue.ref(0);
  29 + //列表高度
  30 + let height = Vue.ref(window.innerHeight);
  31 + //加载
  32 + let loading = Vue.ref(true);
  33 + //选中数据
  34 + let pitch = Vue.ref([]);
  35 + //展示类型
  36 + let showTypeList=Vue.ref([]);
  37 + //采集类型
  38 + let ddicCollType = Vue.ref([]);
  39 +
  40 + let search = Vue.ref({
  41 + resType: '',
  42 + keyword: '',
  43 + page: 1,
  44 + limit: 50,
  45 + });
  46 + let resTypeOptions=Vue.ref([])
  47 + const columns = [
  48 + {
  49 + prop: 'resTypeName',
  50 + label: '资源类型名称',
  51 + sortable: true,
  52 + align: 'center',
  53 + },
  54 + {
  55 + prop: 'resTypeCode',
  56 + label: '编码',
  57 + sortable: true,
  58 + align: 'center',
  59 + },
  60 + {
  61 + prop: 'resTypeDesc',
  62 + label: '类别',
  63 + sortable: true,
  64 + align: 'center',
  65 + },
  66 + {
  67 + prop: 'collType',
  68 + label: '采集类型',
  69 + sortable: true,
  70 + align: 'center',
  71 + render: function (row) {
  72 + let collType='';
  73 + ddicCollType.value.map(item=>{
  74 + if(row.collType==item.value){
  75 + collType=item.name
  76 + }
  77 + })
  78 + return collType;
  79 + }
  80 + },
  81 + {
  82 + prop: 'forbidden',
  83 + label: '是否启用',
  84 + sortable: true,
  85 + align: 'center',
  86 + render: function (row) {
  87 + let str='';
  88 + if(row.forbidden==0){
  89 + str='启用';
  90 + }else{
  91 + str='禁用';
  92 + }
  93 + return str;
  94 + }
  95 + },
  96 + {
  97 + prop: 'showType',
  98 + label: '展示类型',
  99 + sortable: true,
  100 + align: 'center',
  101 + /* render: function (row) {
  102 +
  103 + }*/
  104 + },
  105 + {
  106 + prop: 'createTime',
  107 + label: '创建时间',
  108 + align: 'center'
  109 + },
  110 +
  111 + ];
  112 +
  113 + //列表数据
  114 + let resourceData = Vue.ref([]);
  115 + //获取列表数据
  116 + const getListData = () => {
  117 + // resourceData.value=[];
  118 + loading.value = true;
  119 + //定义列表参数
  120 + let getParams = {
  121 + resType:search.value.resType,
  122 + keywords:search.value.keyword,
  123 + userName: userName.value,
  124 + page: search.value.page,
  125 + limit: search.value.limit
  126 + };
  127 + proxy.$http.post("/api-web/personnelChange/getList/resourceTypePer", getParams, function (res) {
  128 + if (res && res.data) {
  129 + resourceData.value = handleTree(res.data, 'resTypeCode', 'parentId')
  130 + count.value = res.count;
  131 + loading.value = false;
  132 + }else{
  133 + resourceData.value=[];
  134 + }
  135 + })
  136 + }
  137 + //组装树结构
  138 + let handleTree=(data, id, parentId, children)=> {
  139 + let config = {
  140 + id: id || 'id',
  141 + parentId: parentId || 'parentId',
  142 + childrenList: children || 'children'
  143 + };
  144 +
  145 + var childrenListMap = {};
  146 + var nodeIds = {};
  147 + var tree = [];
  148 +
  149 + for (let d of data) {
  150 + let parentId = d[config.parentId];
  151 + if (childrenListMap[parentId] == null) {
  152 + childrenListMap[parentId] = [];
  153 + }
  154 + nodeIds[d[config.id]] = d;
  155 + childrenListMap[parentId].push(d);
  156 + }
  157 +
  158 + for (let d of data) {
  159 + let parentId = d[config.parentId];
  160 + if (nodeIds[parentId] == null) {
  161 + tree.push(d);
  162 + }
  163 + }
  164 +
  165 + for (let t of tree) {
  166 + adaptToChildrenList(t);
  167 + }
  168 +
  169 + function adaptToChildrenList(o) {
  170 + if (childrenListMap[o[config.id]] !== null) {
  171 + o[config.childrenList] = childrenListMap[o[config.id]];
  172 + }
  173 + if (o[config.childrenList]) {
  174 + for (let c of o[config.childrenList]) {
  175 + adaptToChildrenList(c);
  176 + }
  177 + }
  178 + }
  179 + return tree;
  180 + }
  181 + //重新加载表格数据
  182 + let loadTableDataList = ({page, limit}) => {
  183 + search.value.page=page;
  184 + search.value.limit=limit;
  185 + selectionChange([])
  186 + getListData();
  187 + }
  188 + let resTypeId=Vue.ref('');//选中的ids
  189 + //表格全选事件
  190 + let selectionChange = (val) => {
  191 + pitch.value = val;
  192 + let arr=[];
  193 + pitch.value.map(item=>{
  194 + arr.push(item.resTypeId)
  195 + })
  196 + resTypeId.value=arr.join(",");//选中的值
  197 + }
  198 +
  199 + //获取资源类型数据
  200 + let getResourceTypoe=()=>{
  201 + proxy.$http.get(`/api-web/manage/restype/list`, {}, function (res) {
  202 + if (res && res.data) {
  203 + resTypeOptions.value=res.data
  204 + }
  205 + })
  206 + }
  207 + //获取展示类型的字典数据
  208 + let initShowType=()=>{
  209 + proxy.$http.post("/api-web/manage/ddic/findSucDdics/DETAILS_POWER", {}, function (res) {
  210 + if (res && res.data) {
  211 + let arr=res.data;
  212 + if(arr && arr.length>0){
  213 + arr.map(v=>{
  214 + showTypeList.value.push({
  215 + name: v.ddicName
  216 + ,value: v.ddicCode.substring(v.ddicCode.lastIndexOf("_")+1,v.ddicCode.length)
  217 + });
  218 + })
  219 + }
  220 +
  221 + }
  222 + })
  223 + }
  224 + //获取采集类型的字典数据
  225 + let initCollType=()=>{
  226 + proxy.$http.post("/api-web/manage/ddic/findSucDdics/collType", {}, function (res) {
  227 + if (res && res.data) {
  228 + let arr=res.data;
  229 + if(arr && arr.length>0){
  230 + arr.map(v=>{
  231 + ddicCollType.value.push({
  232 + name: v.ddicName
  233 + ,value: v.ddicCode
  234 + });
  235 + })
  236 + }
  237 +
  238 + }
  239 + })
  240 + }
  241 + //批量取消负责的相关资源
  242 + let changeCancel = () => {
  243 + if(pitch.value.length<1){
  244 + proxy.$global.showMsg('请至少选择一项','warning');
  245 + }else{
  246 + proxy.$global.confirm("确定取消负责的相关资源？", function () {
  247 + let parmas={
  248 + userName:userName.value,
  249 + resTypeId:resTypeId.value
  250 + }
  251 + proxy.$http.post(`/api-web/personnelChange/remove/resourceTypePer`, parmas, function (res) {
  252 + if (res && res.success) {
  253 + proxy.$global.showMsg('取消成功！');
  254 + getListData()
  255 + }
  256 + })
  257 + });
  258 + }
  259 + }
  260 + //变更负责人
  261 + let changeAdmin = () => {
  262 + if(pitch.value.length<1){
  263 + proxy.$global.showMsg('请至少选择一项','warning');
  264 +
  265 + }else{
  266 + show.value=true;
  267 + }
  268 +
  269 + }
  270 + //变更人员的弹框关闭后
  271 + let hideDialog =(flag)=>{
  272 + show.value=flag;
  273 + }
  274 + //变更人员的弹框保存后
  275 + let savebtn =(obj)=>{
  276 + show.value=false;
  277 + //obj.selectModel 选中的用户组（一个/主负责人) obj.selectModelSecond 辅负责人，都是数组
  278 + let targetUserName='';
  279 + if(obj.selectModel){
  280 + targetUserName=obj.selectModel.join(',')
  281 + }
  282 + let params={
  283 + resTypeId:resTypeId.value,
  284 + targetUserName:targetUserName,
  285 + userName:userName.value,
  286 + }
  287 + proxy.$http.post(`/api-web/personnelChange/update/resourceTypePer`, params, function (res) {
  288 + if (res && res.success) {
  289 + proxy.$global.showMsg('变更成功！');
  290 + getListData()
  291 + }
  292 + })
  293 + }
  294 + // 挂载完
  295 + Vue.onMounted(() => {
  296 + initShowType();
  297 + initCollType();
  298 + getResourceTypoe();
  299 + getListData();
  300 + })
  301 + return {
  302 + isMulti,
  303 + isTwoGroup,
  304 + show,
  305 + initShowType,
  306 + initCollType,
  307 + showTypeList,
  308 + ddicCollType,
  309 + search,
  310 + resTypeOptions,
  311 + changeCancel,
  312 + count,
  313 + hideDialog,
  314 + savebtn,
  315 + changeAdmin,
  316 + getResourceTypoe,
  317 +
  318 + resourceData,
  319 + columns,
  320 + height,
  321 + loading,
  322 + selectionChange,
  323 +
  324 + getListData,
  325 + loadTableDataList,
  326 + }
  327 + }
  328 +}
  1 +<el-row>
  2 + <el-col :span="24" class="search">
  3 + <div class="condition" >
  4 + <el-form ref=“form” style="display: flex;">
  5 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;width: 300px">
  6 + <el-input v-model="search.keyword" placeholder="关键字支持：角色名称"></el-input>
  7 + </el-form-item>
  8 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  9 + <el-button @click="getListData" >查询</el-button>
  10 + </el-form-item>
  11 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  12 + <el-button type="primary" @click="changeCancel()" >取消</el-button>
  13 + </el-form-item>
  14 + </el-form>
  15 + </div>
  16 + </el-col>
  17 +</el-row>
  18 +<!--<el-row style="margin-bottom: 10px;">
  19 + <div class="flex-div-start">
  20 + <el-button type="primary" @click="changeCancel()" size="small">取消</el-button>
  21 +&lt;!&ndash; <el-button type="primary" @click="changeAdmin()" size="small" style="margin-left: 6px">变更</el-button>&ndash;&gt;
  22 + </div>
  23 +</el-row>-->
  24 +<el-row style="font-size: 12px;color: grey;padding: 6px;">
  25 + {{item.ddicDesc}}
  26 +</el-row>
  27 +<el-row class="margin-bottom-50" style="margin-top: 3px">
  28 + <el-col :span="24" class="table-height">
  29 + <cm-table-page :columns="columns"
  30 + :dataList="resourceData"
  31 + :total="count"
  32 + :pageSize="search.limit"
  33 + @loaddata="loadTableDataList"
  34 + @selectionChange="selectionChange"
  35 + :showIndex="true"
  36 + :showSelection="true"
  37 + :showBorder="true"
  38 + :loading="loading"
  39 + :showPage="true"
  40 + :showTools="false"
  41 + :height="(height - 200)">
  42 + <template #default="{row,prop,column}">
  43 + </template>
  44 + </cm-table-page>
  45 + </el-col>
  46 +</el-row>
  47 +
  48 +<ChangeUsersList :show="show" :isTwoGroup="isTwoGroup" :isMulti="isMulti" @hideDialog="hideDialog" @savebtn="savebtn"></ChangeUsersList>
  1 +export default {
  2 + name: 'rolePer',
  3 + template: '',
  4 + components: {
  5 + 'ChangeUsersList': Vue.defineAsyncComponent(
  6 + () => myImport('views/batchChangeLeaders/changeUsersList/index')
  7 + ),
  8 + },
  9 + data() {
  10 + },
  11 + props: {
  12 + item:{
  13 + type:Object,
  14 + default:{}
  15 + }
  16 + },
  17 + setup: function (props, {attrs, slots, emit}) {
  18 + const {proxy} = Vue.getCurrentInstance();
  19 + //接收从用户列表中选中的用户
  20 + let userName=Vue.ref(proxy.$route.query.username);
  21 + //变更人员弹框
  22 + let show=Vue.ref(false);
  23 + //变更人员列表是否多选
  24 + let isMulti=Vue.ref(false);
  25 + //变更人员列表是否是两组
  26 + let isTwoGroup=Vue.ref(false);
  27 + //配置列表总数
  28 + let count = Vue.ref(0);
  29 + //列表高度
  30 + let height = Vue.ref(window.innerHeight);
  31 + //加载
  32 + let loading = Vue.ref(true);
  33 + //选中数据
  34 + let pitch = Vue.ref([]);
  35 + let search = Vue.ref({
  36 + resType: '',
  37 + keyword: '',
  38 + page: 1,
  39 + limit: 50,
  40 + });
  41 + const columns = [
  42 + {
  43 + prop: 'name',
  44 + label: '角色名称',
  45 + sortable: true,
  46 + align: 'center',
  47 + },
  48 + {
  49 + prop: 'code',
  50 + label: '角色编码',
  51 + sortable: true,
  52 + align: 'center',
  53 + },
  54 + {
  55 + prop: 'remark',
  56 + label: '角色备注',
  57 + sortable: true,
  58 + align: 'center',
  59 + }
  60 + ];
  61 +
  62 + //列表数据
  63 + let resourceData = Vue.ref([]);
  64 + //获取列表数据
  65 + const getListData = () => {
  66 + resourceData.value=[];
  67 + loading.value = true;
  68 + //定义列表参数
  69 + let getParams = {
  70 + resType:search.value.resType,
  71 + keywords:search.value.keyword,
  72 + userName:userName.value,
  73 + page: search.value.page,
  74 + limit: search.value.limit
  75 + };
  76 + proxy.$http.post("/api-web/personnelChange/getList/rolePer", getParams, function (res) {
  77 + if (res && res.data) {
  78 + resourceData.value = res.data ? res.data : [];
  79 + count.value = res.count;
  80 + loading.value = false;
  81 + }
  82 + })
  83 + }
  84 + //重新加载表格数据
  85 + let loadTableDataList = ({page, limit}) => {
  86 + search.value.page=page;
  87 + search.value.limit=limit;
  88 + getListData();
  89 + }
  90 + let roleIds=Vue.ref('');//选中的ids
  91 + //表格全选事件
  92 + let selectionChange = (val) => {
  93 + pitch.value = val;
  94 + let arr=[];
  95 + pitch.value.map(item=>{
  96 + arr.push(item.id)
  97 + })
  98 + roleIds.value=arr.join(",");//选中的值
  99 + }
  100 +
  101 + //批量取消相关资源
  102 + let changeCancel = () => {
  103 + if(pitch.value.length<1){
  104 + proxy.$global.showMsg('请至少选择一项','warning');
  105 + }else{
  106 + proxy.$global.confirm("确定取消相关资源？", function () {
  107 + let parmas={
  108 + userName:userName.value,
  109 + roleId:roleIds.value
  110 + }
  111 + proxy.$http.post(`/api-web/personnelChange/remove/rolePer`, parmas, function (res) {
  112 + if (res && res.success) {
  113 + proxy.$global.showMsg('取消成功！');
  114 + getListData()
  115 + }
  116 + })
  117 + });
  118 + }
  119 + }
  120 + //变更负责人
  121 + let changeAdmin = () => {
  122 + if(pitch.value.length<1){
  123 + proxy.$global.showMsg('请至少选择一项','warning');
  124 +
  125 + }else{
  126 + show.value=true;
  127 + }
  128 +
  129 + }
  130 + //变更人员的弹框关闭后
  131 + let hideDialog =(flag)=>{
  132 + show.value=flag;
  133 + }
  134 + //变更人员的弹框保存后
  135 + let savebtn =(obj)=>{
  136 + show.value=false;
  137 + //obj.selectModel 选中的用户组（一个/主负责人) obj.selectModelSecond 辅负责人，都是数组
  138 + let targetUserName='';
  139 + if(obj.selectModel){
  140 + targetUserName=obj.selectModel.join(',')
  141 + }
  142 + let params={
  143 + roleId:roleIds.value,
  144 + targetUserName:targetUserName,
  145 + userName:userName.value,
  146 + }
  147 + proxy.$http.post(`/api-web/personnelChange/update/rolePer`, params, function (res) {
  148 + if (res && res.success) {
  149 + proxy.$global.showMsg('变更成功！');
  150 + getListData()
  151 + }
  152 + })
  153 + }
  154 + // 挂载完
  155 + Vue.onMounted(() => {
  156 + getListData();
  157 + })
  158 + return {
  159 + isMulti,
  160 + isTwoGroup,
  161 + show,
  162 + search,
  163 + changeCancel,
  164 + count,
  165 + hideDialog,
  166 + savebtn,
  167 + changeAdmin,
  168 + resourceData,
  169 + columns,
  170 + height,
  171 + loading,
  172 + selectionChange,
  173 + getListData,
  174 + loadTableDataList,
  175 + userName
  176 + }
  177 + }
  178 +}
  1 +<el-row>
  2 + <el-col :span="24" class="search">
  3 + <div class="condition" style="display: flex;">
  4 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;width: 300px">
  5 + <el-input v-model="data.searchParams.keywords" placeholder="关键字支持：名称、负责人、业务描述"></el-input>
  6 + </el-form-item>
  7 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  8 + <el-button @click="getList">查询</el-button>
  9 + </el-form-item>
  10 +
  11 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  12 + <el-button type="primary" @click="removeRel">取消</el-button>
  13 + </el-form-item>
  14 +
  15 + <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
  16 + <el-button type="primary" @click="changeUser">变更</el-button>
  17 + </el-form-item>
  18 +
  19 + </div>
  20 + </el-col>
  21 +</el-row>
  22 +<el-row style="font-size: 12px;color: grey;padding: 6px;">
  23 + {{item.ddicDesc}}
  24 +</el-row>
  25 +<el-row class="margin-bottom-50" style="margin-top: 3px">
  26 + <el-col :span="24" class="table-height">
  27 + <cm-table-page :columns="data.columns"
  28 + :dataList="data.tableData"
  29 + :treeProps="{ children: 'children', hasChildren: 'hasChildren' }"
  30 + :total="data.count"
  31 + :pageSize="data.searchParams.limit"
  32 + @loaddata="loadTableDataList"
  33 + @selectionChange="selectionChange"
  34 + :showIndex="true"
  35 + :showSelection="true"
  36 + :showBorder="true"
  37 + :loading="loading"
  38 + :showPage="true"
  39 + :showTools="false"
  40 + :height="(height - 200)">
  41 + <template #default="{row,prop,column}">
  42 + </template>
  43 + </cm-table-page>
  44 + </el-col>
  45 +</el-row>
  46 +
  47 +<ChangeUsersList :show="data.userDialogFlag" @hideDialog="showUserDialog" @savebtn="saveRel"></ChangeUsersList>
  1 +export default {
  2 + name: 'resourceTypePer',
  3 + template: '',
  4 + components: {
  5 + 'ChangeUsersList': Vue.defineAsyncComponent(
  6 + () => myImport('views/batchChangeLeaders/changeUsersList/index')
  7 + ),
  8 + },
  9 + data() {
  10 + },
  11 + props: {
  12 + item:{
  13 + type:Object,
  14 + default:{}
  15 + }
  16 + },
  17 + setup: function (props, {attrs, slots, emit}) {
  18 + const {proxy} = Vue.getCurrentInstance();
  19 + //列表高度
  20 + let height = Vue.ref(window.innerHeight);
  21 + let data = Vue.ref({
  22 + searchParams: {
  23 + "page": 1,
  24 + "limit": 50,
  25 + "keywords": "",
  26 + "userName": proxy.$route.query.username,
  27 + "jtopoId": ""
  28 + },
  29 + userDialogFlag : false,
  30 + count: 0,
  31 + columns: [{
  32 + prop: "topoName",
  33 + label: "名称",
  34 + width: "250",
  35 + sortable: true,
  36 + align: 'center'
  37 + },
  38 + {
  39 + prop: "isDefault",
  40 + label: "默认状态",
  41 + sortable: true,
  42 + align: 'center',
  43 + render: (row) => {
  44 + //1是默认，0为非默认
  45 + switch (row.isDefault) {
  46 + case 0:
  47 + return '非默认';
  48 + case 1:
  49 + return '默认';
  50 + default:
  51 + return '';
  52 + }
  53 + }
  54 + }, {
  55 + prop: "createUser",
  56 + label: "创建人",
  57 + sortable: true,
  58 + align: 'center',
  59 + }, {
  60 + prop: "createTime",
  61 + label: "创建时间",
  62 + sortable: true,
  63 + align: 'center'
  64 + }, {
  65 + prop: "remark",
  66 + label: "备注",
  67 + sortable: true,
  68 + align: 'center'
  69 + }],
  70 + tableData: [],
  71 + // 表格选中
  72 + checkArr:[]
  73 + })
  74 +
  75 +
  76 + const getList = () => {
  77 + proxy.$http.post(`/api-web/personnelChange/getList/topoPer`, data.value.searchParams, function (res) {
  78 + if (res && res.data) {
  79 + let dataVal = data.value;
  80 + let list = res.data;
  81 + let count = res.count;
  82 +
  83 + let tableData = list.filter(function (v) {
  84 + if (v.parentId == '0') {
  85 + // 获取子节点
  86 + let childs = list.filter(function (v1) {
  87 + if (v1.parentId != '0' && v1.parentId == v.jtopoId) {
  88 + // 获取子节点
  89 + return v1;
  90 + }
  91 + }).sort(function (a, b) {
  92 + return a.sort - b.sort
  93 + })
  94 + v.children = childs;
  95 + return v;
  96 + }
  97 + }).sort(function (a, b) {
  98 + return a.sort - b.sort
  99 + })
  100 +
  101 + dataVal.tableData = list;
  102 + dataVal.count = count;
  103 + }
  104 + })
  105 + }
  106 +
  107 + // 展示用户选择
  108 + let showUserDialog = (flg) =>{
  109 + data.value.userDialogFlag = flg;
  110 + }
  111 +
  112 + let saveRel = (obj) =>{
  113 + // 获取选中
  114 + let arr = data.value.checkArr;
  115 + if(arr.length == 0){
  116 + proxy.$global.showMsg('请至少选择一项','warning');
  117 + return;
  118 + }
  119 +
  120 + let params = {
  121 + targetUserName: obj.selectModel.join(''),
  122 + "userName": proxy.$route.query.username,
  123 + "jtopoId": arr.join(',')
  124 + }
  125 + if(params.targetUserName == params.userName){
  126 + proxy.$global.showMsg('变更用户不能与变更前用户一致，请修改！','warning');
  127 + return;
  128 + }
  129 + proxy.$http.post(`/api-web/personnelChange/update/topoPer`,params, function (res) {
  130 + if (res && res.success) {
  131 + proxy.$global.showMsg('变更成功！');
  132 + showUserDialog(false);
  133 + // 刷新表格
  134 + getList();
  135 + }
  136 + })
  137 + }
  138 +
  139 + // 变更
  140 + let changeUser = () =>{
  141 + // 获取选中
  142 + let arr = data.value.checkArr;
  143 + if(arr.length == 0){
  144 + proxy.$global.showMsg('请至少选择一项','warning');
  145 + return;
  146 + }
  147 +
  148 + showUserDialog(true);
  149 + }
  150 +
  151 + /**
  152 + * 取消
  153 + */
  154 + let removeRel = () =>{
  155 + let arr = data.value.checkArr;
  156 + if(arr.length == 0){
  157 + proxy.$global.showMsg('请至少选择一项','warning');
  158 + return;
  159 + }
  160 +
  161 + data.value.searchParams.jtopoId = arr.join(',')
  162 + proxy.$global.confirm("确定取消相关资源？", function () {
  163 + proxy.$http.post(`/api-web/personnelChange/remove/topoPer`, data.value.searchParams , function (res) {
  164 + if (res && res.success) {
  165 + proxy.$global.showMsg('取消成功！');
  166 + getList()
  167 + }
  168 + })
  169 + });
  170 + }
  171 +
  172 + //重新加载表格数据
  173 + let loadTableDataList = ({page, limit}) => {
  174 + let dataVal = data.value;
  175 + dataVal.page = page;
  176 + dataVal.limit = limit;
  177 + getList();
  178 + }
  179 +
  180 + // 表格全选事件
  181 + let selectionChange = (val) => {
  182 + let checkArr = [];
  183 + val.map(item => {
  184 + checkArr.push(item.jtopoId)
  185 + })
  186 + data.value.checkArr = checkArr;
  187 + let isCheck = (list, checkArr) => {
  188 + list.forEach((v, i) => {
  189 + v.checked = checkArr.includes(v.jtopoId);
  190 + if (v.children) {
  191 + isCheck(v.children, checkArr);
  192 + }
  193 + });
  194 + }
  195 + isCheck(data.value.tableData, checkArr);
  196 + }
  197 +
  198 + // 挂载完
  199 + Vue.onMounted(() => {
  200 + getList();
  201 + })
  202 +
  203 + return {
  204 + height,
  205 + data,
  206 + getList,
  207 + changeUser,
  208 + showUserDialog,
  209 + removeRel,
  210 + loadTableDataList,
  211 + selectionChange,
  212 + saveRel
  213 + }
  214 + }
  215 +}
@@ -68,7 +68,7 @@ @@ -68,7 +68,7 @@
68 :pageSize="search.limitUn" 68 :pageSize="search.limitUn"
69 :showPage="true" 69 :showPage="true"
70 :showTools="false" 70 :showTools="false"
71 - :height="height - 230"> 71 + :height="height - 300">
72 <template #default="{row,prop,column}"> 72 <template #default="{row,prop,column}">
73 <div v-if="prop=='showType'"> 73 <div v-if="prop=='showType'">
74 <el-select v-model="row.showType" placeholder=""> 74 <el-select v-model="row.showType" placeholder="">