整合代码 action管理

 Bin/tomcat/logs/host-manager.2024-03-04.log

 Source/plt-web/plt-web-ui/src/api/UI/Action/api.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,120 @@
import request from '@/router/axios';

// è¡¨å•å•æ¡æŸ¥è¯¢æŽ¥å£
export function getActionTree(params) {
  return request({
    url: "/api/actionController/getActionTree",
    method: "get",
    params
  });
}

// Action查询列表接口
export function getActionTableData(params) {
  return request({
    url: "/api/actionController/getActionTableData",
    method: "post",
    data: params
  });
}

// Action列表新建接口
export function saveAction(params) {
  return request({
    url: "/api/actionController/saveAction",
    method: "post",
    data: params
  });
}

// Action列表修改接口
export function updateAction(params) {
  return request({
    url: "/api/actionController/updateAction",
    method: "post",
    data: params
  });
}

// Action列表导出
export function exportAction(params) {
  return request({
    url: '/api/actionController/exportAction',
    method: 'post',
    headers: {'Content-Type': 'application/json;charset=UTF-8'},
    responseType: 'blob',
    data: params
  })
}

// Action列表删除接口
export function deleteAction(params) {
  return request({
    url: "/api/actionController/deleteAction",
    method: "delete",
    data: params
  });
}

// Action下方参数列表查询
export function getPLActionParam(params) {
  return request({
    url: "/api/actionController/getPLActionParam",
    method: "get",
    params
  });
}

// Action下方参数列表保存
export function savePLActionParam(params) {
  return request({
    url: "/api/actionController/savePLActionParam",
    method: "post",
    data: params
  });
}

// Action下方参数列表编辑
export function updatePLActionParam(params) {
  return request({
    url: "/api/actionController/updatePLActionParam",
    method: "post",
    data: params
  });
}

// Action下方参数列表删除
export function deletePLActionParam(params) {
  return request({
    url: "/api/actionController/deletePLActionParam",
    method: "delete",
    params
  });
}

// Action分类保存
export function saveActionCls(params) {
  return request({
    url: "/api/actionController/saveActionCls",
    method: "post",
    data: params
  });
}

// Action分类修改保存
export function updateActionCls(params) {
  return request({
    url: "/api/actionController/updateActionCls",
    method: "post",
    data: params
  });
}

// Action分类删除
export function deleteActionCls(params) {
  return request({
    url: "/api/actionController/deleteActionCls",
    method: "delete",
    data:params
  });
}

 Source/plt-web/plt-web-ui/src/api/UI/formDefine/api.js

@@ -1,14 +1,132 @@
import request from '@/router/axios';

// åˆ—表查询
export function gridPortalVIDatas(page,limit,params) {
export function gridPortalVIDatas(page, limit, params) {
  return request({
    url: "/api/portalVIController/gridPortalVIDatas",
    method: "get",
    params:{
    params: {
      page,
      limit,
      ...params
    }
  });
}

// è¡¨å•å•æ¡æŸ¥è¯¢æŽ¥å£
export function getPortalVIById(params) {
  return request({
    url: "/api/portalVIController/getPortalVIById",
    method: "get",
    params
  });
}

// å±žæ€§è¶…链接类型接口
export function getItemDblList() {
  return request({
    url: "/api/portalVIController/getItemDblList",
    method: "get",
  });
}

// è¡¨æ ¼è¡¨å•ä¿å­˜
export function savePortalVI(params) {
  return request({
    url: "/api/portalVIController/savePortalVI",
    method: "post",
    data: params
  });
}

// å±žæ€§æ ‘状接口
export function getTreeAttributes(params) {
  return request({
    url: "/api/attributeController/getTreeAttributes",
    method: "get",
    params
  })
}

// é€šè¿‡id删除
export function deleteByIds(params) {
  return request({
    url: "/api/portalVIController/deleteByIds",
    method: "delete",
    params
  })
}

// å¯¼å‡º
export function exportExcel (params) {
  return request({
    url: '/api/portalVIController/exportExcel',
    method: 'post',
    headers: {'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'},
    responseType: 'blob',
    params
  })
}

// è¡¨å•æŽ¥å£æµ‹è¯•æ•°æ®
const obj = {
  "itemAddFilter": "",
  "itemBat": "",
  "itemCols": "1",
  "itemCtrlDisplyCol": "",
  "itemCtrlDisplyCondition": "",
  "itemCustomClass": "",
  "itemCut": "",
  "itemDateFormat": "",
  "itemDbl": "",
  "itemEQ": "",
  "itemEditCondition": "",
  "itemEditableProgram": "",
  "itemField": "specialty",
  "itemFieldWidth": "",
  "itemFieldWidthList": [],
  "itemHrefConf": "",
  "itemHrefFields": "",
  "itemHttpPathField": "",
  "itemHttpVolumnPath": "",
  "itemImgWH": "",
  "itemInObj": "",
  "itemIsEditable": "0",
  "itemIsHidden": "1",
  "itemIsHttpSave": "0",
  "itemIsNavigatorExpand": "",
  "itemIsRequired": "0",
  "itemIsShowFolder": "",
  "itemKeyFieldList": [],
  "itemKeyFields": "",
  "itemListTable": "",
  "itemListTxt": "",
  "itemListVal": "",
  "itemName": "专业",
  "itemOR": "",
  "itemOutFieldList": [],
  "itemOutFields": "",
  "itemOutType": "",
  "itemPageSize": "",
  "itemParentFolderName": "",
  "itemQtName": "",
  "itemQueryRefFields": "",
  "itemQuerySql": "",
  "itemRight": "",
  "itemRows": "",
  "itemScript": "",
  "itemSearchFieldList": [],
  "itemSelectoutFieldList": [],
  "itemSeniorQueryBOS": [],
  "itemSeniorQueryCols": "",
  "itemSeniorQueryColsCounts": "",
  "itemShowExpression": "",
  "itemStyle": "",
  "itemTips": "",
  "itemTrim": "",
  "itemTxf": "",
  "itemType": "text",
  "itemTypeText": "单行文本框",
  "itemValue": "",
  "itemValueList": []
}

 Source/plt-web/plt-web-ui/src/components/PLT-basic-component/transfer.vue

@@ -73,6 +73,7 @@
  watch: {
    //渲染穿梭框
    leftRoleData: {
      // éœ€è¦åœ¨æ‰“开穿梭框组件的时候对leftRoleData进行赋值（可以参考action管理-action列表 å¯¼å‡ºåŠŸèƒ½ï¼‰ å¦‚果在data里面定义的数据，组件内watch会监听不到newVal
      handler(newval) {
        if (newval) {
          // æ¸…空data数组

 Source/plt-web/plt-web-ui/src/util/func.js

@@ -4,6 +4,28 @@
import CryptoJS from 'crypto-js'

export default class func {
  /**
   * å•é€‰è¡¨æ ¼è¡Œ
   * æ—¶é—´æˆ³æ ¼å¼åŒ–
   */
  static formattedDate(val) {
    // åˆ›å»ºä¸€ä¸ª Date å¯¹è±¡
    const date = new Date(val);

    // æ ¼å¼åŒ–时间的辅助函数
    const formatNumber = (number) => String(number).padStart(2, '0');

    // æå–并格式化年、月、日、小时、分钟和秒
    const year = date.getFullYear();
    const month = formatNumber(date.getMonth() + 1); // æœˆä»½ä»Ž0开始，需要+1
    const day = formatNumber(date.getDate());
    const hours = formatNumber(date.getHours());
    const minutes = formatNumber(date.getMinutes());
    const seconds = formatNumber(date.getSeconds());

    // æ ¼å¼åŒ–为 YYYY-MM-DD HH:MM:SS
    return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
  }

  /**
   * å•é€‰è¡¨æ ¼è¡Œ
@@ -223,7 +245,7 @@
      padding: CryptoJS.pad.Pkcs7
    });
    return encrypted.toString();
}
  }

  /**
   * HmacMD5加密
@@ -233,7 +255,7 @@
   * @constructor
   */
  static HmacMD5(message, key) {
    const encrypted = CryptoJS.HmacMD5(message,key);
    const encrypted = CryptoJS.HmacMD5(message, key);
    return encrypted.toString();
  }


 Source/plt-web/plt-web-ui/src/views/modelingMenu/modeling/attributePool/index.vue

@@ -18,7 +18,7 @@
          @current-change="currentChange"
        >
          <template slot="menuLeft" slot-scope="scope">
            <el-button icon="el-icon-plus" size="small" type="primary" @click="rowSaveHandlerClick">创建</el-button>
            <el-button icon="el-icon-plus" plain size="small" type="primary" @click="rowSaveHandlerClick">创建</el-button>
            <el-button icon="el-icon-delete" plain size="small" type="danger" @click="allDelHandler">删除</el-button>
            <el-button icon="el-icon-view" plain size="small" type="primary" @click="chekView">查看使用范围</el-button>
            <el-button icon="el-icon-download" plain size="small" type="primary" @click="downloadTemplateHandler">下载导入模板

 Source/plt-web/plt-web-ui/src/views/modelingMenu/modeling/businessType/index.vue

@@ -908,7 +908,8 @@
        props: {
          label: 'TreeName',
          value: 'id',
          children: 'children'
          children: 'children',
          name: 'name'
        }
      },
      treeData: [
@@ -927,7 +928,7 @@
        name: 'el-icon-tickets',
        desc: 'el-icon-chat-line-square'
      },
      treeLoading:false
      treeLoading: false
    }
  },
  created() {

 Source/plt-web/plt-web-ui/src/views/modelingMenu/modeling/enumType/index.vue

@@ -16,7 +16,7 @@
        >

          <template slot="menuLeft" slot-scope="scope">
            <el-button icon="el-icon-plus" size="small" type="primary" @click="rowSaveHandlerClick">创建</el-button>
            <el-button icon="el-icon-plus" plain size="small" type="primary" @click="rowSaveHandlerClick">创建</el-button>
            <el-button icon="el-icon-delete" plain size="small" type="danger" @click="allDelHandler">删除</el-button>
            <el-button icon="el-icon-view" plain size="small" type="primary" @click="chekView">查看使用范围</el-button>
            <el-button icon="el-icon-download" plain size="small" type="primary" @click="downloadTemplateHandler">下载导入模板

 Source/plt-web/plt-web-ui/src/views/modelingMenu/modeling/versioning/index.vue

@@ -18,7 +18,7 @@
                       @click="checkViewClickHandler">查看使用范围
            </el-button>
          </div>
          <!-- å·¦ä¾§æ ‘         -->
          <!-- å·¦ä¾§æ ‘ -->
          <div style="height:  calc(100vh - 260px);">
            <avue-tree :data="treeData" :option="treeOption" @node-click="nodeClick">
          <span slot-scope="{ node, data }" class="el-tree-node__label">
@@ -104,7 +104,7 @@
      </basic-container>
    </el-main>

    <!-- æ–°å¢ž ä¿®æ”¹   -->
    <!-- æ–°å¢ž ä¿®æ”¹ -->
    <el-dialog
      v-dialogDrag
      :title="dialogTitle === 'add' ? '创建' : '修改'"
@@ -164,11 +164,11 @@
        </span>
    </el-dialog>

    <!-- å¯¼å…¥    -->
    <!-- å¯¼å…¥ -->
    <upload-file ref="upload" :fileType="upFileType" :fileUrl="fileUrl" :tipList="tipList" title="导入"
                 @updata="getTreeList"></upload-file>

    <!-- æŸ¥çœ‹ä½¿ç”¨èŒƒå›´    -->
    <!-- æŸ¥çœ‹ä½¿ç”¨èŒƒå›´ -->
    <el-dialog
      v-dialogDrag
      :visible.sync="checkViewVisible"
@@ -302,7 +302,7 @@
    this.getTreeList();
  },
  methods: {
    //左侧树查询
    // å·¦ä¾§æ ‘查询
    getTreeList() {
      getVersionRuleAllList().then(res => {
        const data = res.data.data;
@@ -473,7 +473,6 @@
      width: 82px;
    }
  }

}

.headerCon {

 Source/plt-web/plt-web-ui/src/views/modelingMenu/modeling/versioning/option.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,37 @@
export const column = [
  {
    label: '名称',
    prop: 'id',
    sortable: true,
  },
  {
    label: '标签',
    prop: 'name',
    sortable: true,
  },
  {
    label: '跳跃字符',
    prop: 'jumpCharacter',
    sortable: true,
  },
  {
    label: '初始值',
    prop: 'initialValue',
    sortable: true,
  },
  {
    label: '前缀',
    prop: 'prefixion',
    sortable: true,
  },
  {
    label: '后缀',
    prop: 'suffix',
    sortable: true,
  },
  {
    label: '描述',
    prop: 'description',
    overHidden:true,
  },
];

 Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/Aciton/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,757 @@
<template>
  <el-container>

    <el-aside>
      <basic-container>
        <div ref="TreeBox" style="height: calc(100vh - 144px);!important;">
          <div class="headerCon">
            <el-button icon="el-icon-plus" plain size="small" type="primary" @click="addTreeClickHandler">创建
            </el-button>
            <el-button icon="el-icon-edit" plain size="small" type="primary" @click="editTreeClickHandler">修改
            </el-button>
            <el-button icon="el-icon-delete" plain size="small" type="danger" @click="delTreeClickHandler">删除
            </el-button>
            <el-button icon="el-icon-download" plain size="small" type="primary" @click="exportClickHandler">导出
            </el-button>
            <el-button icon="el-icon-upload2" plain size="small" type="primary" @click="uploadClickHandler">导入
            </el-button>
          </div>
          <!-- å·¦ä¾§æ ‘ -->
          <div style="height:  calc(100vh - 280px);">
            <avue-tree
              ref="tree"
              v-model="treeForm"
              :data="treeData"
              :option="treeOption"
              @save="rowTreeSaveHandler"
              @update="rowTreeUpdataHandler"
              @node-click="nodeClick">
          <span slot-scope="{ node, data }" class="el-tree-node__label">
           <span style="font-size: 15px">
              <i class="el-icon-s-promotion"></i>
                {{ (node || {}).label }}
            </span>
          </span>
            </avue-tree>
          </div>
        </div>
      </basic-container>
    </el-aside>

    <el-main>
      <basic-container>
        <div>
          <avue-crud
            ref="crud"
            v-model="form"
            :data="data"
            :option="option"
            :page.sync="page"
            :table-loading="tableLoading"
            @row-del="rowDelHandler"
            @row-save="rowSaveHandler"
            @row-update="rowUpdateHandler"
            @search-change="handleSearch"
            @search-reset="handleReset"
            @refresh-change="handleRefresh"
            @selection-change="selectChangeHandler"
            @row-click="rowClickHandler">
            <template slot="plTypeType" slot-scope="{row}">
              <el-tag :type="row.plTypeType === 'business' ? '' : 'success'">
                {{ row.plTypeType === 'business' ? '业务类型' : '链接类型' }}
              </el-tag>
            </template>
            <template slot="menuLeft" slot-scope="scope">
              <el-button v-if="treeNodeRow.id !== 'root'" icon="el-icon-plus" plain size="small" type="primary"
                         @click="addClickHandler">增加
              </el-button>
              <el-button icon="el-icon-download" plain size="small" type="success" @click="downLoadHandler">导出
              </el-button>
            </template>
          </avue-crud>
        </div>

        <div style="margin-top: 10px">
          <avue-crud
            ref="BottomCrud"
            :data="bottomData"
            :option="bottomOption"
            :table-loading="bottomTableLoading"
            @row-save="BottomRowSaveHandler"
            @row-update="BottomRowUpdateHandler"
            @row-del="BottomRowDelHandler"
          >
            <template slot="menuLeft" slot-scope="scope">
              <el-button icon="el-icon-plus" plain size="small" type="primary" @click="bottomAddClickHandler">增加
              </el-button>
            </template>

          </avue-crud>
        </div>
      </basic-container>
    </el-main>

    <transfer ref="transfer" :left-role-data="leftRoleData" :right-role-data="rightRoleData"
              :select-list="selectList" :top-methods-obj="topMethodsObj" :transferTitle="transferTitle" title="导出"
              @transferSend="exportSendHandler">
    </transfer>

    <transfer ref="actionTransfer" :left-role-data="leftRoleData" :right-role-data="rightRoleData"
              :select-list="selectList" :top-methods-obj="topMethodsObj" :transferTitle="transferTitle" title="导出"
              @transferSend="exportSendHandler">
    </transfer>

  </el-container>
</template>

<script>
import {
  getActionTree,
  getActionTableData,
  saveAction,
  updateAction,
  exportAction,
  deleteAction,
  getPLActionParam,
  savePLActionParam,
  updatePLActionParam,
  deletePLActionParam,
  saveActionCls,
  updateActionCls,
  deleteActionCls
} from '@/api/UI/Action/api'
import func from "@/util/func";
import basicOption from "@/util/basic-option";

export default {
  name: "index",
  data() {
    return {
      currenRow: {}, // action当前行信息
      topMethodsObj: {
        select: true,
        all: true,
        page: false
      },
      transferTitle: ['未选择', '已选择'],
      leftRoleData: [],
      rightRoleData: [],
      form: {},
      bottomTableLoading: false,
      bottomData: [],
      bottomOption: {
        ...basicOption,
        addBtn: false,
        calcHeight: -30,
        selection: false,
        refreshBtn: false,
        // height:'auto',
        column: [
          {
            label: '参数名称',
            prop: 'name',
            rules: [
              {
                required: true,
                message: '请输入参数名称',
                trigger: 'blur'
              }
            ]
          },
          {
            label: '默认值',
            prop: 'defaultValue',
          },
          {
            label: '提示信息',
            prop: 'description',
            span: 24,
            type: 'textarea',
            rows: 4
          },
        ],
      },
      tableLoading: false,
      lastIndex: null,
      selectList: [],
      data: [],
      option: {
        ...basicOption,
        addBtn: false,
        height: 350,
        highlightCurrentRow: true,
        column: [
          {
            label: '编号',
            prop: 'plCode',
            search: true,
            rules: [
              {
                required: true,
                message: '请输入编号',
                trigger: 'blur'
              }
            ]
          },
          {
            label: '名称',
            prop: 'plName',
            search: true,
            rules: [
              {
                required: true,
                message: '请输入名称',
                trigger: 'blur'
              }
            ]
          },
          {
            label: '类路径',
            prop: 'plCSClass',
            search: true,
            overHidden: true,
          },
          {
            label: '分类',
            prop: 'plActionCls',
            type: 'tree',
            hide: true,
            props: {
              label: 'name',
              value: 'id',
              children: 'childs'
            },
            rules: [
              {
                required: true,
                message: '请选择分类',
                trigger: 'blur'
              }
            ],
            dicData: []
          },
          {
            label: '链接地址',
            prop: 'plBSUrl',
            search: true,
          },
          {
            label: '类型',
            prop: 'plTypeType',
            search: true,
            type: 'select',
            dicData: [{
              label: '业务类型',
              value: 'business'
            }, {
              label: '链接类型',
              value: 'link'
            }],
            rules: [
              {
                required: true,
                message: '请选择类型',
                trigger: 'blur'
              }
            ]
          },
          {
            label: '描述',
            prop: 'plDesc',
            search: true,
            overHidden: true,
          },
        ]
      },
      treeNodeRow: {},
      treeForm: {},
      treeOption: {
        addBtn: false,
        defaultExpandedKeys: ['root'],
        props: {
          label: 'name',
          value: 'id',
          children: 'childs'
        },
        formOption: {
          column: [
            {
              label: '分类名称',
              prop: 'name',
              rules: [
                {
                  required: true,
                  message: '请输入分类名称',
                  trigger: 'blur'
                }
              ]
            },
            {
              label: '分类序号',
              prop: 'serialno',
              rules: [
                {
                  required: true,
                  message: '请输入分类序号',
                  trigger: 'blur'
                }
              ]
            },
            {
              label: '创建者',
              prop: 'creator',
              readonly: true,
            },
            {
              label: '创建时间',
              prop: 'createTime',
              readonly: true,
            },
            {
              label: '父主类',
              prop: 'pidName',
              readonly: true,
            },
            {
              label: '备注',
              prop: 'description'
            },
          ],
        }
      },
      treeData: [],
    }
  },
  created() {
    this.getTreeList();
  },
  methods: {
    // å·¦ä¾§æ ‘请求
    getTreeList(status) {
      const params = {
        isExp: status ? true : false
      }
      getActionTree(params).then(res => {
        const data = res.data.obj;
        this.treeData = [data];
        const selectTreeData = this.option.column.find(item => item.prop === 'plActionCls'); // æ‰¾åˆ°action添加分类树
        selectTreeData.dicData = [data];
      })
    },

    // å·¦ä¾§æ ‘行点击
    nodeClick(row) {
      this.treeNodeRow = row;
      this.getRightTableList(row);
      this.bottomData = [];
    },

    // å¤´éƒ¨åˆ·æ–°æŒ‰é’®
    handleRefresh() {
      if (func.isEmptyObject(this.treeNodeRow)) {
        return;
      }
      this.getRightTableList(this.treeNodeRow);
    },

    // å³ä¾§è¡¨æ ¼ä¿¡æ¯
    getRightTableList(row) {
      this.tableLoading = true;
      const params = {
        plactioncls: row.id
      }
      getActionTableData(params).then(res => {
        const data = res.data.data;
        this.data = data;
        this.tableLoading = false;
      })
    },

    // è¡¨æ ¼å¤šé€‰
    selectChangeHandler(row) {
      this.selectList = row;
    },

    // è¡Œç‚¹å‡»
    rowClickHandler(row) {
      this.currenRow = row;
      func.rowClickHandler(
        row,
        this.$refs.crud,
        this.lastIndex,
        (newIndex) => {
          this.lastIndex = newIndex;
        },
        () => {
          this.selectList = [];
        }
      );

      // è¯·æ±‚action下方参数列表数据
      this.getBottomList(row);
    },

    // æœç´¢
    handleSearch(params, done) {
      if (func.isEmptyObject(this.treeNodeRow)) {
        this.$message.error('请先在左侧选择节点后操作');
        return done();
      }
      this.tableLoading = true;
      const apiParams = {
        plactioncls: this.treeNodeRow.id === 'root' ? '' : this.treeNodeRow.id,
        ...params
      }

      getActionTableData(apiParams).then(res => {
        const data = res.data.data;
        this.data = data;
        this.tableLoading = false;
      })
      done();
    },

    // é‡ç½®æœç´¢æ¡ä»¶
    handleReset() {
      if (func.isEmptyObject(this.treeNodeRow)) {
        this.$message.error('请先在左侧选择节点后操作');
        return;
      }
      this.getRightTableList(this.treeNodeRow);
    },

    // action列表增加
    addClickHandler() {
      if (func.isEmptyObject(this.treeNodeRow)) {
        this.$message.error('请先在左侧选择节点后操作');
        return;
      }
      this.$refs.crud.rowAdd();
      this.form.plActionCls = this.treeNodeRow.id;
    },

    // action列表增加保存
    rowSaveHandler(form, done, loading) {
      saveAction(form).then(res => {
        if (res.data.code === 200) {
          this.$message.success('添加成功');
          this.getRightTableList(this.treeNodeRow);
        }
        done();
      })
      loading();
    },

    // action列表修改保存
    rowUpdateHandler(row, index, done, loading) {
      updateAction(row).then(res => {
        if (res.data.code === 200) {
          this.$message.success('修改成功');
          this.getRightTableList(this.treeNodeRow);
        }
        done();
      })
      loading();
    },

    // å¯¼å‡ºæŒ‰é’®
    downLoadHandler() {
      if (func.isEmptyObject(this.treeNodeRow)) {
        this.$message.error('请先在左侧选择节点后操作');
        return;
      }

      this.leftRoleData = [{
        name: '编号',
        oid: '编号'
      },
        {
          name: '类路径',
          oid: '类路径'
        },
        {
          name: '链接地址',
          oid: '链接地址'
        },
        {
          name: '类型',
          oid: '类型'
        },
        {
          name: '描述',
          oid: '描述'
        },]
      this.$refs.transfer.visible = true;
    },

    // ç©¿æ¢­æ¡†ä¿å­˜ index为0是选择 1是全部
    exportSendHandler(row, index) {
      console.log(row, index);
      const params = {
        dataType: index,
        chooseDataOid: index === 0 ? this.selectList.map(item => item.plOId) : [],
        columnName: row,
        fileName: 'Action列表数据'
      }

      exportAction(params).then(res => {
        func.downloadFileByBlobHandler(res);
        this.$message.success('导出成功');
      }).catch(err => {
        this.$message.error(err);
      })
    },

    // action列表行删除
    rowDelHandler(row, index) {
      this.$confirm('您确定要删除当前数据吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        deleteAction(row).then(res => {
          if (res.data.code === 200) {
            this.$message.success('删除成功');
            this.getRightTableList(this.treeNodeRow);
          }
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },

    // å‚数列表查询
    getBottomList() {
      this.bottomTableLoading = true;
      getPLActionParam({actionOid: this.currenRow.plOId}).then(res => {
        const data = res.data.data;
        this.bottomData = data;
        this.bottomTableLoading = false;
      })
    },

    // å‚数列表增加按钮
    bottomAddClickHandler() {
      if (this.selectList.length <= 0) {
        this.$message.error('清先选择action再进行参数创建');
        return;
      }
      this.$refs.BottomCrud.rowAdd();
    },

    // å‚数列表新增保存
    BottomRowSaveHandler(form, done, loading) {
      savePLActionParam(form).then(res => {
        if (res.data.code === 200) {
          this.$message.success('添加成功');
          this.getBottomList();
        }
        done();
      })
      loading();
    },

    // å‚数列表修改保存
    BottomRowUpdateHandler(row, index, done, loading) {
      updatePLActionParam(row).then(res => {
        if (res.data.code === 200) {
          this.$message.success('修改成功');
          this.getBottomList();
        }
        done();
      })
      loading();
    },

    // å‚数列表删除
    BottomRowDelHandler(row, index) {
      this.$confirm('您确定要删除当前数据吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        deletePLActionParam({oid: row.oid}).then(res => {
          if (res.data.code === 200) {
            this.$message.success('删除成功');
            this.getBottomList();
          }
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },

    // å·¦ä¾§æ ‘创建
    addTreeClickHandler() {
      if (func.isEmptyObject(this.treeNodeRow)) {
        this.$message.error('请选择一条分类进行添加');
        return;
      }

      const {createTime, creator, name, id, description} = this.treeNodeRow;
      this.$set(this.treeForm, 'createTime', func.formattedDate(createTime));
      this.$set(this.treeForm, 'creator', creator);
      this.$set(this.treeForm, 'pid', id);
      this.$set(this.treeForm, 'pidName', name);
      this.$refs.tree.rowAdd();

    },

    // action分类保存
    rowTreeSaveHandler(node, data, done, loading) {
      saveActionCls(data).then(res => {
        if (res.data.code === 200) {
          this.$message.success('分类创建成功');
          this.getTreeList();
        }
        done();
      })
      loading();
    },

    // action分类修改按钮
    editTreeClickHandler() {
      if (func.isEmptyObject(this.treeNodeRow)) {
        this.$message.error('请选择一条数据进行修改');
        return;
      }

      if (this.treeNodeRow.id === 'root') {
        this.$message.error('根节点不能修改');
        return;
      }
      const {name, serialno, creator, createTime, pid, description, id} = this.treeNodeRow;
      const pidName = this.findObjectNameById(this.treeData, pid);
      this.$set(this.treeForm, 'name', name);
      this.$set(this.treeForm, 'id', id);
      this.$set(this.treeForm, 'serialno', serialno);
      this.$set(this.treeForm, 'creator', creator);
      this.$set(this.treeForm, 'createTime', func.formattedDate(createTime));
      this.$set(this.treeForm, 'pid', pid);
      this.$set(this.treeForm, 'pidName', pidName);
      this.$set(this.treeForm, 'description', description);

      this.$refs.tree.rowEdit();
    },

    // action分类修改保存
    rowTreeUpdataHandler(node, data, done, loading) {
      updateActionCls(data).then(res => {
        if (res.data.code === 200) {
          this.$message.success('修改成功');
          this.getBottomList();
        }
        done();
      })
      loading();
    },

    // é€’归通过pid查找父主类名称
    findObjectNameById(data, id) {
      for (let item of data) {
        if (item.id === id) {
          return item.name;
        }
        if (item.childs && item.childs.length > 0) {
          const result = this.findObjectNameById(item.childs, id);
          if (result) {
            return result;
          }
        }
      }
      return 'null';
    },

    // action分类删除
    delTreeClickHandler() {
      if (func.isEmptyObject(this.treeNodeRow)) {
        this.$message.error('请选择一条数据进行删除');
        return;
      }

      if (this.treeNodeRow.id === 'root') {
        this.$message.error('根节点不能删除');
        return;
      }

      this.$confirm('您确定要删除当前数据吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        deleteActionCls(this.treeNodeRow).then(res => {
          if (res.data.code === 200) {
            this.$message.success('分类删除成功');
            this.getTreeList();
          }
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },

    // action分类导出
    exportClickHandler() {

    },

    // action分类导入
    uploadClickHandler() {

    }

  }
}
</script>

<style lang="scss" scoped>
::v-deep {
  .el-scrollbar__wrap {
    overflow: auto !important;
  }

  .headerCon {
    .el-button {
      width: 82px;
    }
  }
}

.headerCon {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 5px;

  .el-button + .el-button {
    margin-left: 5px;
  }

  .el-button {
    margin-top: 5px;
  }
}

.headerCon > .el-button:nth-child(4) {
  margin-left: 0;
}

.headerCon > .el-button:nth-child(7) {
  margin-left: 0;
}

.smallBtn {
  width: 82px;
  text-align: center;
  padding-left: 4.5px;
}

</style>

 Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/Action/index.vue

ÎļþÒÑɾ³ý

 Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/formDefine/components/formDialog.vue

@@ -11,12 +11,12 @@
  >
    <el-container>
      <div style="height: 79vh;display: flex;width: 100%;">

        <el-aside width="15%">
        <el-aside width="17%">
          <basic-container>
            <div style="height:650px;">
              <avue-tree
                :data="treeData"
                :loading="treeLoading"
                :option="treeOption"
                @node-drag-start="handleDragStart">
              </avue-tree>
@@ -26,48 +26,52 @@

        <el-main>
          <basic-container>
            <div style="height: 645px" @drop="drop" @dragover.prevent>
            <div style="height: 645px;overflow-y: auto;padding-right: 5px" @drop="drop" @dragover.prevent>
              <div style="display: flex;justify-content: center">
                <span style="display: flex;align-items: center; margin-right: 5px;">
                 <p class="tableTopLabel">名称：</p>
                 <el-input v-model="name" placeholder="请输入内容" size="mini"></el-input>
                 <el-input v-model="topForm.viName" placeholder="请输入内容" size="mini"></el-input>
                </span>

                <span style="display: flex;align-items: center; margin-right: 5px;">
                 <p class="tableTopLabel">查询模板名称：</p>
                 <el-input v-model="name" placeholder="请输入内容" size="mini"></el-input>
                 <el-input v-model="form.itemQtName" placeholder="请输入查询模板名称" size="mini"></el-input>
                </span>

                <span style="display: flex;align-items: center; margin-right: 5px;">
                 <p class="tableTopLabel">显示列数：</p>
                 <el-input v-model="name" placeholder="请输入内容" size="mini"></el-input>
                  <el-button plain size="mini" style="margin-left: 3px" type="success">设置</el-button>
                 <el-input v-model="topForm.showColumn" placeholder="请输入内容" size="mini"></el-input>
                  <el-button plain size="mini" style="margin-left: 3px" type="success"
                             @click="setColumnHandler">设置</el-button>
                </span>

                <span style="display: flex;align-items: center; margin-right: 5px;">
                 <p class="tableTopLabel">位置：</p>
                 <el-input v-model="name" placeholder="请输入内容" size="mini"></el-input>
                  <el-button plain size="mini" style="margin-left: 3px" type="success">调整位置</el-button>
                 <el-input v-model="topForm.position" placeholder="请输入内容" size="mini"></el-input>
                  <el-button plain size="mini" style="margin-left: 3px" type="success" @click="positionClickHandler">调整位置</el-button>
                </span>
              </div>
              <h3>页面定义</h3>
              <el-form ref="form" :model="form" :rules="rules" label-width="100px">
                <el-row>
                  <el-col v-for="(item,index) in formList" :key="index" :span="columnNumber">
                    <el-tooltip :content="item.name" placement="top">
                      <el-form-item :label="item.name + '：'" class="hiddenLabel">
                        <el-input v-model="item.value" :splaceholder="item.name" size="mini"></el-input>
                      </el-form-item>
                    </el-tooltip>
                  <el-col v-for="(item,index) in formList" :key="index" :span="topForm.columnNumber">
                    <el-form-item :class="['hiddenLabel', { 'active-border': activeItem.text === item.text }]"
                                  :label="item.text + '：'"
                                  style="padding-left: 5px" @click.native="formItemClick(item,index)">
                      <el-input v-model="item.value" :placeholder="item.text" size="mini"></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
              </el-form>
            </div>
            <div style="display: flex;justify-content: center;margin-top: 15px">
              <el-button icon="el-icon-check" size="small" type="primary">保存</el-button>
              <el-button icon="el-icon-delete" plain size="small" type="danger">清空</el-button>
              <el-button icon="el-icon-el-icon-close" plain size="small" type="primary">删除组件</el-button>
              <el-button icon="el-icon-plus" plain size="small" type="primary">添加自定义组件</el-button>
              <el-button icon="el-icon-check" size="small" type="primary" @click="saveClickHandler">保存</el-button>
              <el-button icon="el-icon-delete" plain size="small" type="danger" @click="emptyClickHandler">清空
              </el-button>
              <el-button icon="el-icon-close" plain size="small" type="primary" @click="delModuleClickHandler">删除组件
              </el-button>
              <el-button icon="el-icon-plus" plain size="small" type="primary" @click="addCustomClickHandler">添加自定义组件
              </el-button>
              <el-button icon="el-icon-zoom-in" plain size="small" type="primary">预览</el-button>
            </div>
          </basic-container>
@@ -82,24 +86,26 @@
                  <el-col :span="24">
                    <el-form-item label="使用字段">
                      <div style="display: flex">
                        <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
                        <el-checkbox v-model="checked" style="margin-left: 5px; margin-right: 5px">只读</el-checkbox>
                        <el-checkbox v-model="checked" style="margin-left: 5px;margin-right: 0px">必填</el-checkbox>
                        <el-input v-model="form.text" placeholder="请输入使用字段" size="mini"></el-input>
                        <el-checkbox v-model="form.itemIsEditable" style="margin-left: 5px; margin-right: 5px">只读
                        </el-checkbox>
                        <el-checkbox v-model="form.itemIsRequired" style="margin-left: 5px;margin-right: 0px">必填
                        </el-checkbox>
                      </div>
                    </el-form-item>
                  </el-col>

                  <el-col :span="12">
                    <el-form-item label="显示名称">
                      <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
                      <el-input v-model="form.itemName" placeholder="请输入内容" size="mini"></el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="12">
                    <el-form-item class="rightLabel" label="显示类型">
                      <el-select v-model="form.region" placeholder="请选择活动区域" size="mini">
                        <el-option label="区域一" value="shanghai"></el-option>
                        <el-option label="区域二" value="beijing"></el-option>
                      <el-select v-model="form.itemType" placeholder="请选择类型" size="mini">
                        <el-option v-for="(item,index) in showSelectList" :key="index" :label="item.label"
                                   :value="item.value"></el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>
@@ -107,38 +113,38 @@
                  <el-col :span="24">
                    <el-tooltip content="默认值表达式" placement="top">
                      <el-form-item class="hiddenLabel" label="默认值表达式">
                        <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
                        <el-input v-model="form.itemValue" placeholder="请输入内容" size="mini"></el-input>
                      </el-form-item>
                    </el-tooltip>
                  </el-col>

                  <el-col :span="24">
                    <!--                    <el-tooltip content="显示表达式" placement="top">-->
                    <!-- <el-tooltip content="显示表达式" placement="top">-->
                    <el-form-item label="显示表达式">
                      <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
                      <el-input v-model="form.itemShowExpression" placeholder="请输入内容" size="mini"></el-input>
                    </el-form-item>
                    <!--                    </el-tooltip>-->
                    <!-- </el-tooltip>-->
                  </el-col>

                  <el-col :span="24">
                    <el-tooltip content="日期格式化字符串" placement="top">
                      <el-form-item class="hiddenLabel" label="日期格式化字符串：">
                        <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
                        <el-input v-model="form.itemDateFormat" placeholder="请输入内容" size="mini"></el-input>
                      </el-form-item>
                    </el-tooltip>
                  </el-col>

                  <el-col :span="24">
                    <el-form-item label="占位方式">
                      <el-radio v-model="treeRadio" label="0">显示</el-radio>
                      <el-radio v-model="treeRadio" label="1">不显示</el-radio>
                      <el-radio v-model="form.itemCols" label="1">显示</el-radio>
                      <el-radio v-model="form.itemCols" label="2">不显示</el-radio>
                    </el-form-item>
                  </el-col>

                  <el-col :span="24" style="height: 90px">
                    <el-form-item label="字段表达式">
                      <el-input
                        v-model="textarea2"
                        v-model="form.itemAddFilter"
                        :rows="3"
                        placeholder="请输入内容"
                        resize="none"
@@ -151,7 +157,7 @@
                    <el-tooltip content="只读选择条件" placement="top">
                      <el-form-item class="hiddenLabel" label="只读选择条件">
                        <el-input
                          v-model="textarea2"
                          v-model="form.itemEditableProgram"
                          :rows="3"
                          placeholder="请输入内容"
                          resize="none"
@@ -163,20 +169,20 @@

                  <el-col :span="12">
                    <el-form-item label="控制列">
                      <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
                      <el-input v-model="form.itemCtrlDisplyCol" placeholder="请输入内容" size="mini"></el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="12">
                    <el-form-item class="rightLabel" label="显示列条件" label-width="95px">
                      <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
                      <el-input v-model="form.itemCtrlDisplyCondition" placeholder="请输入内容" size="mini"></el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="24">
                    <el-form-item label="权限控制">
                      <div style="display: flex;align-items: center">
                        <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
                        <el-input v-model="form.itemRight" placeholder="请输入内容" size="mini"></el-input>
                        <el-button plain size="mini" style="margin-left: 3px" type="success">选择</el-button>
                      </div>
                    </el-form-item>
@@ -187,7 +193,7 @@
                  <el-col :span="24" style="height: 90px">
                    <el-form-item label="脚本验证">
                      <el-input
                        v-model="textarea2"
                        v-model="form.itemScript"
                        :rows="3"
                        placeholder="请输入内容"
                        resize="none"
@@ -199,7 +205,7 @@
                  <el-col :span="24" style="height: 90px">
                    <el-form-item label="提示文字">
                      <el-input
                        v-model="textarea2"
                        v-model="form.itemTips"
                        :rows="3"
                        placeholder="请输入内容"
                        resize="none"
@@ -210,19 +216,19 @@

                  <el-col :span="24">
                    <el-form-item label="查询关联列">
                      <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
                      <el-input v-model="form.itemQueryRefFields" placeholder="请输入内容" size="mini"></el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="24">
                    <el-form-item label="自定义类">
                      <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
                      <el-input v-model="form.itemCustomClass" placeholder="请输入内容" size="mini"></el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="24">
                    <el-form-item label="存储路径">
                      <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
                      <el-input v-model="form.itemHttpVolumnPath" placeholder="请输入内容" size="mini"></el-input>
                    </el-form-item>
                  </el-col>

@@ -230,8 +236,8 @@
                    <el-tooltip content="存储路径字段" placement="top">
                      <el-form-item class="hiddenLabel" label="存储路径字段">
                        <div style="display: flex">
                          <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
                          <el-checkbox v-model="checked" style="margin-left: 5px">http存储</el-checkbox>
                          <el-input v-model="form.itemHttpPathField" placeholder="请输入内容" size="mini"></el-input>
                          <el-checkbox v-model="form.itemIsHttpSave" style="margin-left: 5px">http存储</el-checkbox>
                        </div>
                      </el-form-item>
                    </el-tooltip>
@@ -239,17 +245,18 @@

                </el-row>

                <el-row style="margin-top: 10px;border-bottom: 1px solid #878585;padding-bottom: 10px">
                <el-row v-if="form.itemType ? optionTypeStatus : true"
                        style="margin-top: 10px;border-bottom: 1px solid #878585;padding-bottom: 10px">
                  <h4>选项列表</h4>
                  <el-col :span="12">
                    <el-form-item label="名称">
                      <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
                      <el-input v-model="optionObj.optionName" placeholder="请输入名称" size="mini"></el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="12">
                    <el-form-item class="rightLabel" label="值" label-width="95px">
                      <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
                      <el-input v-model="optionObj.optionValue" placeholder="请输入内容" size="mini"></el-input>
                    </el-form-item>
                  </el-col>

@@ -257,18 +264,19 @@
                    <el-form-item>
                      <div style="height: 150px; width: 100%; border: 1px solid #bdbbbb;overflow-y: auto">
                        <el-table
                          :data="optionRightData"
                          :data="form.itemValueList"
                          :highlight-current-row="true"
                          :show-header="false"
                          border
                          stripe
                          style="width: 100%">
                          style="width: 100%"
                          @row-click="optionTableClick">
                          <el-table-column
                            align="center"
                            label="名称"
                            prop="name">
                            prop="key">
                            <template slot-scope="scope">
                              <el-tag size="medium">{{ scope.row.name }}</el-tag>
                              <el-tag size="medium">{{ scope.row.key }}</el-tag>
                            </template>
                          </el-table-column>
                          <el-table-column
@@ -282,36 +290,39 @@
                        </el-table>
                      </div>
                      <div style="display: flex;align-items: center;justify-content: center;margin-top: 5px">
                        <el-button plain size="mini" style="margin-right: 5px" type="success">添加</el-button>
                        <el-button plain size="mini" style="margin-left: 5px" type="danger">删除</el-button>
                        <el-button plain size="mini" style="margin-right: 5px" type="success"
                                   @click="optionAddClickHandler">添加
                        </el-button>
                        <el-button plain size="mini" style="margin-left: 5px" type="danger"
                                   @click="optionDeleteClickHandler">删除
                        </el-button>
                      </div>
                    </el-form-item>
                  </el-col>

                  <el-col :span="24">
                    <el-form-item label="一级参照">
                      <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
                      <el-input v-model="form.itemListTable" placeholder="请输入内容" size="mini"></el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="24">
                    <el-form-item label="二级参照">
                      <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
                      <el-input v-model="form.itemListTxt" placeholder="请输入内容" size="mini"></el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="24">
                    <el-form-item label="参照值">
                      <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
                      <el-input v-model="form.itemListVal" placeholder="请输入内容" size="mini"></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>

                <el-row style="margin-top: 10px">
                <el-row v-if="form.itemType ? itemStyleTypeStatus : true" style="margin-top: 10px">
                  <el-col :span="24" style="height: 90px">
                    <el-form-item label="附加属性">
                      <el-input
                        v-model="textarea2"
                        v-model="form.itemStyle"
                        :rows="3"
                        placeholder="请输入内容"
                        resize="none"
@@ -325,19 +336,392 @@
            </div>
          </basic-container>
        </el-aside>

      </div>

    </el-container>

    <!-- æ·»åŠ è‡ªå®šä¹‰ç»„件 -->
    <el-dialog
      v-dialogDrag
      v-loading="customLoading"
      :visible.sync="customVisible"
      append-to-body="true"
      class="avue-dialog"
      title="表单"
      width="40%"
      @close="closeCustomDialog">
      <el-form ref="form" :model="customForm" :rules="rules" label-position="left" label-width="85px">
        <el-row style="border-bottom: 1px solid #878585;padding-bottom: 10px">
          <el-col :span="24">
            <el-form-item label="使用字段">
              <div style="display: flex">
                <el-input v-model="customForm.text" placeholder="请输入使用字段" size="mini"></el-input>
                <el-checkbox v-model="customForm.itemIsEditable" style="margin-left: 5px; margin-right: 5px">只读
                </el-checkbox>
                <el-checkbox v-model="customForm.itemIsRequired" style="margin-left: 5px;margin-right: 0px">必填
                </el-checkbox>
              </div>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="显示名称">
              <el-input v-model="customForm.itemName" placeholder="请输入内容" size="mini"></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item class="rightLabel" label="显示类型">
              <el-select v-model="customForm.itemType" placeholder="请选择类型" size="mini">
                <el-option v-for="(item,index) in showSelectList" :key="index" :label="item.label"
                           :value="item.value"></el-option>
              </el-select>
            </el-form-item>
          </el-col>

          <el-col :span="24">
            <el-tooltip content="默认值表达式" placement="top">
              <el-form-item class="hiddenLabel" label="默认值表达式">
                <el-input v-model="customForm.itemValue" placeholder="请输入内容" size="mini"></el-input>
              </el-form-item>
            </el-tooltip>
          </el-col>

          <el-col :span="24">
            <!--                    <el-tooltip content="显示表达式" placement="top">-->
            <el-form-item label="显示表达式">
              <el-input v-model="customForm.itemShowExpression" placeholder="请输入内容" size="mini"></el-input>
            </el-form-item>
            <!--                    </el-tooltip>-->
          </el-col>

          <el-col :span="24">
            <el-tooltip content="日期格式化字符串" placement="top">
              <el-form-item class="hiddenLabel" label="日期格式化字符串：">
                <el-input v-model="customForm.itemDateFormat" placeholder="请输入内容" size="mini"></el-input>
              </el-form-item>
            </el-tooltip>
          </el-col>

          <el-col :span="24">
            <el-form-item label="占位方式">
              <el-radio v-model="customForm.itemCols" label="1">显示</el-radio>
              <el-radio v-model="customForm.itemCols" label="2">不显示</el-radio>
            </el-form-item>
          </el-col>

          <el-col :span="24" style="height: 90px">
            <el-form-item label="字段表达式">
              <el-input
                v-model="customForm.itemAddFilter"
                :rows="3"
                placeholder="请输入内容"
                resize="none"
                type="textarea">
              </el-input>
            </el-form-item>
          </el-col>

          <el-col :span="24" style="height: 90px">
            <el-tooltip content="只读选择条件" placement="top">
              <el-form-item class="hiddenLabel" label="只读选择条件">
                <el-input
                  v-model="customForm.itemEditableProgram"
                  :rows="3"
                  placeholder="请输入内容"
                  resize="none"
                  type="textarea">
                </el-input>
              </el-form-item>
            </el-tooltip>
          </el-col>

          <el-col :span="12">
            <el-form-item label="控制列">
              <el-input v-model="customForm.itemCtrlDisplyCol" placeholder="请输入内容" size="mini"></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item class="rightLabel" label="显示列条件" label-width="95px">
              <el-input v-model="customForm.itemCtrlDisplyCondition" placeholder="请输入内容" size="mini"></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="24">
            <el-form-item label="权限控制">
              <div style="display: flex;align-items: center">
                <el-input v-model="customForm.itemRight" placeholder="请输入内容" size="mini"></el-input>
                <el-button plain size="mini" style="margin-left: 3px" type="success">选择</el-button>
              </div>
            </el-form-item>
          </el-col>

        </el-row>
        <el-row style="margin-top: 10px;border-bottom: 1px solid #878585;padding-bottom: 10px">
          <el-col :span="24" style="height: 90px">
            <el-form-item label="脚本验证">
              <el-input
                v-model="customForm.itemScript"
                :rows="3"
                placeholder="请输入内容"
                resize="none"
                type="textarea">
              </el-input>
            </el-form-item>
          </el-col>

          <el-col :span="24" style="height: 90px">
            <el-form-item label="提示文字">
              <el-input
                v-model="customForm.itemTips"
                :rows="3"
                placeholder="请输入内容"
                resize="none"
                type="textarea">
              </el-input>
            </el-form-item>
          </el-col>

          <el-col :span="24">
            <el-form-item label="查询关联列">
              <el-input v-model="customForm.itemQueryRefFields" placeholder="请输入内容" size="mini"></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="24">
            <el-form-item label="自定义类">
              <el-input v-model="customForm.itemCustomClass" placeholder="请输入内容" size="mini"></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="24">
            <el-form-item label="存储路径">
              <el-input v-model="customForm.itemHttpVolumnPath" placeholder="请输入内容" size="mini"></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="24">
            <el-tooltip content="存储路径字段" placement="top">
              <el-form-item class="hiddenLabel" label="存储路径字段">
                <div style="display: flex">
                  <el-input v-model="customForm.itemHttpPathField" placeholder="请输入内容" size="mini"></el-input>
                  <el-checkbox v-model="customForm.itemIsHttpSave" style="margin-left: 5px">http存储</el-checkbox>
                </div>
              </el-form-item>
            </el-tooltip>
          </el-col>

        </el-row>

        <el-row style="margin-top: 10px;border-bottom: 1px solid #878585;padding-bottom: 10px">
          <h4>选项列表</h4>
          <el-col :span="12">
            <el-form-item label="名称">
              <el-input v-model="customOptionObj.optionName" placeholder="请输入名称" size="mini"></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item class="rightLabel" label="值" label-width="95px">
              <el-input v-model="customOptionObj.optionValue" placeholder="请输入内容" size="mini"></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="24" style="height: 190px">
            <el-form-item>
              <div style="height: 150px; width: 100%; border: 1px solid #bdbbbb;overflow-y: auto">
                <el-table
                  :data="customForm.itemValueList"
                  :highlight-current-row="true"
                  :show-header="false"
                  border
                  stripe
                  style="width: 100%">
                  <el-table-column
                    align="center"
                    label="名称"
                    prop="key">
                    <template slot-scope="scope">
                      <el-tag size="medium">{{ scope.row.key }}</el-tag>
                    </template>
                  </el-table-column>
                  <el-table-column
                    align="center"
                    label="值"
                    prop="value">
                    <template slot-scope="scope">
                      <el-tag size="medium">{{ scope.row.value }}</el-tag>
                    </template>
                  </el-table-column>
                </el-table>
              </div>
              <div style="display: flex;align-items: center;justify-content: center;margin-top: 5px">
                <el-button plain size="mini" style="margin-right: 5px" type="success"
                           @click="optionAddClickHandler('dialog')">添加
                </el-button>
                <el-button plain size="mini" style="margin-left: 5px" type="danger">删除</el-button>
              </div>
            </el-form-item>
          </el-col>

          <el-col :span="24">
            <el-form-item label="一级参照">
              <el-input v-model="customForm.itemListTable" placeholder="请输入内容" size="mini"></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="24">
            <el-form-item label="二级参照">
              <el-input v-model="customForm.itemListTxt" placeholder="请输入内容" size="mini"></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="24">
            <el-form-item label="参照值">
              <el-input v-model="customForm.itemListVal" placeholder="请输入内容" size="mini"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row style="margin-top: 10px">
          <el-col :span="24" style="height: 90px">
            <el-form-item label="附加属性">
              <el-input
                v-model="customForm.itemStyle"
                :rows="3"
                placeholder="请输入内容"
                resize="none"
                type="textarea">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>

      </el-form>
      <span slot="footer" class="dialog-footer">
         <el-button @click="customVisible = false">取 æ¶ˆ</el-button>
         <el-button type="primary">ç¡® å®š</el-button>
    </span>
    </el-dialog>
  </el-dialog>
</template>

<script>
import {getTreeAttributes} from "@/api/UI/formDefine/api";
import func from "@/util/func";

export default {
  name: "formDialog",
  props: {
    TreeNodeRow: {
      type: Object,
      default: () => {
      }
    },
    treeRadio: {
      type: String,
      default: ""
    }
  },
  data() {
    return {
      optionObj: {
        optionName: '',
        optionValue: ''
      },
      customOptionObj: {
        optionName: '',
        optionValue: ''
      },
      customForm: {
        itemValueList: [],
      },
      customLoading: false,
      customVisible: false,
      treeLoading: false,
      showSelectList: [
        {
          label: '单行文本框',
          value: 'text'
        },
        {
          label: '文本按钮框',
          value: 'textbtn'
        },
        {
          label: '多行文本框',
          value: 'textarea'
        },
        {
          label: '富文本框',
          value: 'richtext'
        },
        {
          label: '数字输入框',
          value: 'number'
        },
        {
          label: '密码框',
          value: 'password'
        },
        {
          label: '单选按钮',
          value: 'radio'
        },
        {
          label: '多选按钮',
          value: 'checkbox'
        },
        {
          label: '下拉菜单',
          value: 'select'
        },
        {
          label: '多选下拉菜单',
          value: 'multiselect'
        },
        {
          label: '日期输入框',
          value: 'date'
        },
        {
          label: '时间输入框',
          value: 'time'
        },
        {
          label: '日期时间输入框',
          value: 'datetime'
        },
        {
          label: '文件上传',
          value: 'file'
        },
        {
          label: '多文件上传',
          value: 'multiFile'
        },
        {
          label: '自定义',
          value: 'custom'
        },
        {
          label: '自定义表单',
          value: 'customform'
        },
        {
          label: '隐藏或普通文字',
          value: 'hidden'
        },
        {
          label: 'Web编辑器',
          value: 'webeditor'
        },
        {
          label: '特殊字符',
          value: 'specialCharacter'
        },
      ],
      activeItem: {}, // ç”¨äºŽå­˜å‚¨å½“前点击的 item çš„节点信息
      activeItemIndex: null, // ç”¨äºŽå­˜å‚¨å½“前点击节点的 index ä¸‹æ ‡
      formList: [],
      optionRightData: [
        {
@@ -346,208 +730,71 @@
        }
      ],
      form: {},
      topForm: {
        columnNumber: 8,
        showColumn: '',
        viName: '',
        position: ''
      },
      rules: {},
      columnNumber: 3,
      loading: false,
      visible: false,
      treeOption: {
        height: 'auto',
        menu: false,
        addBtn: false,
        draggable: true,
        defaultExpandedKeys: ['root'],
        allowDrop: () => {
          return false;
        },
        allowDrag: () => {
          return true;
        },
        // props: {
        //   label: 'name',
        //   value: 'id',
        //   children: 'children',
        // },
        props: {
          label: 'text',
          value: 'oid',
          children: 'children',
        },
      },
      treeData: [
        {
          value: 0,
          label: '一级部门',
          children: [
            {
              value: 1,
              label: '一级部门1',
            }, {
              value: 2,
              label: '一级部门2',
            }
          ]
        }, {
          value: 3,
          label: '二级部门',
          children: [
            {
              value: 4,
              label: '二级部门1',
            }, {
              value: 5,
              label: '二级部门2',
            }
          ]
        },
        {
          value: 0,
          label: '一级部门',
          children: [
            {
              value: 1,
              label: '一级部门1',
            }, {
              value: 2,
              label: '一级部门2',
            }
          ]
        }, {
          value: 3,
          label: '二级部门',
          children: [
            {
              value: 4,
              label: '二级部门1',
            }, {
              value: 5,
              label: '二级部门2',
            }
          ]
        },
        {
          value: 0,
          label: '一级部门',
          children: [
            {
              value: 1,
              label: '一级部门1',
            }, {
              value: 2,
              label: '一级部门2',
            }
          ]
        }, {
          value: 3,
          label: '二级部门',
          children: [
            {
              value: 4,
              label: '二级部门1',
            }, {
              value: 5,
              label: '二级部门2',
            }
          ]
        },
        {
          value: 0,
          label: '一级部门',
          children: [
            {
              value: 1,
              label: '一级部门1',
            }, {
              value: 2,
              label: '一级部门2',
            }
          ]
        }, {
          value: 3,
          label: '二级部门',
          children: [
            {
              value: 4,
              label: '二级部门1',
            }, {
              value: 5,
              label: '二级部门2',
            }
          ]
        },
        {
          value: 0,
          label: '一级部门',
          children: [
            {
              value: 1,
              label: '一级部门1',
            }, {
              value: 2,
              label: '一级部门2',
            }
          ]
        }, {
          value: 3,
          label: '二级部门',
          children: [
            {
              value: 4,
              label: '二级部门1',
            }, {
              value: 5,
              label: '二级部门2',
            }
          ]
        },
        {
          value: 0,
          label: '一级部门',
          children: [
            {
              value: 1,
              label: '一级部门1',
            }, {
              value: 2,
              label: '一级部门2',
            }
          ]
        }, {
          value: 3,
          label: '二级部门',
          children: [
            {
              value: 4,
              label: '二级部门1',
            }, {
              value: 5,
              label: '二级部门2',
            }
          ]
        },
        {
          value: 0,
          label: '一级部门',
          children: [
            {
              value: 1,
              label: '一级部门1',
            }, {
              value: 2,
              label: '一级部门2',
            }
          ]
        }, {
          value: 3,
          label: '二级部门',
          children: [
            {
              value: 4,
              label: '二级部门1',
            }, {
              value: 5,
              label: '二级部门2',
            }
          ]
        }
      ]
      treeData: []
    }
  },
  computed: {
    optionTypeStatus() {
      const types = ['radio', 'checkbox', 'select'];
      return types.includes(this.form.itemType); // å±•ç¤º
    },

    itemStyleTypeStatus() {
      const types = ['hidden', 'webeditor', 'radio', 'checkbox'];
      return !types.includes(this.form.itemType); // ä¸å±•ç¤º
    }
  },
  created() {
    // this.getTreeList();
  },
  methods: {
    // å…³é—­å¯¹è¯æ¡†
    closeDialog() {
      this.formList = [];

    },

    getTreeList() {
      this.treeLoading = true;
      const params = {
        'conditionMap[typeName]': this.treeRadio === '0' ? this.TreeNodeRow.id : this.TreeNodeRow.name,
        'conditionMap[isDefault]': true,
        'conditionMap[typeFlag]': this.treeRadio === '0' ? 'BtmType' : this.treeRadio === '1' ? 'LinkType' : '',
      }
      getTreeAttributes(params).then(res => {
        if (res.data.code === 200) {
          const data = res.data.data;
          this.treeData = data;
          this.treeLoading = false;
        }
      })
    },

    // å¼€å§‹æ‹–拽树节点事件
@@ -560,13 +807,183 @@
    drop(event) {
      // ä½¿ç”¨ getData æ–¹æ³•èŽ·å–数据
      const data = JSON.parse(event.dataTransfer.getData('item'));
      console.log('data', data);
      const params = {
        name: data.label,
        value: '',
        type: ''
        text: data.text,
        oid: data.oid,
      }
      this.formList.push(params)
      const isDuplicate = this.formList.some(item => item.text === data.text);

      if (isDuplicate) {
        this.$message.error('请检查是否添加相同项！')
      } else {
        this.formList.push(params);
      }
    },

    // é¡µé¢å®šä¹‰é€‰é¡¹ç‚¹å‡»
    formItemClick(item, index) {
      this.activeItem = item;
      this.activeItemIndex = index;
      this.form = {...item};
    },

    // è®¾ç½®æ˜¾ç¤ºè¡Œæ•°
    setColumnHandler() {
      const number = /^[0-9]*\.?[0-9]+$/.test(this.topForm.showColumn);

      if (!number) {
        this.$message.error('值必须是数字字符');
        return;
      }
      this.topForm.columnNumber = this.getValueBasedOnInput(this.topForm.showColumn);
    },

    // æ ¹æ®ä¼ å…¥æ¯è¡Œåˆ—æ•° æ¥åˆ¤æ–­el-col :span是多少
    getValueBasedOnInput(val) {
      const n = JSON.parse(val ? val : '3');
      switch (n) {
        case 1:
          return 24;
        case 2:
          return 12;
        case 3:
          return 8;
        case 4:
          return 6;
        case 5:
          return 4;
        case 6:
          return 4;
        case 7:
        case 8:
          return 3;
        case 9:
          return 2;
        default:
          return n > 10 ? 1 : 8; // é»˜è®¤ç»™8
      }
    },

    // æ¸…空页面定义
    emptyClickHandler() {
      this.$confirm('您确定要清空所有数据吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.formList = [];
        this.activeItem = {};
        this.form = {};
        this.$message({
          type: 'success',
          message: '删除成功!'
        });
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },

    // åˆ é™¤ç»„件
    delModuleClickHandler() {
      if (func.isEmptyObject(this.activeItem)) {
        this.$message.error('请选择一条数据进行删除');
        return;
      }
      this.formList = this.formList.filter(item => item.text != this.activeItem.text);
      this.activeItem = {};
      this.form = {};
    },

    // è°ƒæ•´ä½ç½®
    positionClickHandler() {
      if (!this.topForm.position) {
        this.$message.error('请输入调整位置');
        return;
      }

      if (func.isEmptyObject(this.activeItem)) {
        this.$message.error('请选择一条数据进行调整位置');
        return;
      }

      const number = /^[0-9]*\.?[0-9]+$/.test(this.topForm.position);

      if (!number) {
        this.$message.error('值必须是数字字符');
        return;
      }

      // å…ˆå°†è¦æ›´æ¢ä½ç½®çš„项通过 activeItemIndex è¿›è¡Œç§»é™¤
      this.formList.splice(this.activeItemIndex, 1);
      // å°†å½“前点击对象 activeItem æ’入到数组中对应位置
      this.formList.splice(JSON.parse(this.topForm.position) - 1, 0, this.activeItem);
      this.activeItem = {};
      this.activeItemIndex = null;
    },

    // é€‰é¡¹è¡¨æ ¼è¡Œç‚¹å‡»
    optionTableClick(row) {
      console.log(row);
    },

    // é€‰é¡¹æ·»åŠ 
    optionAddClickHandler(val) {
      let optionObj, itemValueList;

      if (val === 'dialog') {
        optionObj = this.customOptionObj;
        itemValueList = this.customForm.itemValueList;
      } else {
        if (func.isEmptyObject(this.activeItem)) {
          this.$message.error('请选择一条数据进行添加选项');
          return;
        }
        optionObj = this.optionObj;
        itemValueList = this.form.itemValueList;
      }

      if (!optionObj.optionName) {
        this.$message.error('请输入选项名称');
        return;
      }

      if (!optionObj.optionValue) {
        this.$message.error('请输入选项值');
        return;
      }

      const params = {
        key: optionObj.optionName,
        value: optionObj.optionValue
      };

      itemValueList.push(params);
    },

    // é€‰é¡¹åˆ é™¤
    optionDeleteClickHandler() {

    },

    // æ·»åŠ è‡ªå®šä¹‰ç»„件
    addCustomClickHandler() {
      this.customVisible = true;
    },

    // ä¿å­˜æŒ‰é’®
    saveClickHandler() {
      if (!this.topForm.viName) {
        this.$message.error('名称不能为空');
        return;
      }
      if (this.formList.length <= 0) {
        this.$message.error('页面不能为空');
        return;
      }

    }
  }
}
@@ -582,6 +999,12 @@
    }
  }

  .active-border {
    .el-form-item__label {
      color: #f56c6c; /* è®¾ç½®è¾¹æ¡†çš„样式 */
    }
  }

  .el-col {
    margin-bottom: 0px;
    height: 40px;

 Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/formDefine/components/tableDialog.vue

@@ -9,35 +9,35 @@
    width="60%"
    @close="closeDialog"
  >
    <el-form :model="form" :rules="rules" label-position="right" label-width="100px">
    <el-form v-loading="formLoading" :model="form" :rules="rules" label-position="right" label-width="100px">
      <el-row>
        <el-col :span="12">
          <el-form-item label="名称">
            <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
            <el-input v-model="form.viName" placeholder="请输入名称" size="mini"></el-input>
          </el-form-item>
        </el-col>


        <el-col :span="12">
          <el-form-item label="每页行数">
            <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
            <el-input v-model="form.itemPageSize" placeholder="请输入每页行数" size="mini" type="number"></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="24">
          <el-form-item label="附加查询条件">
            <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
            <el-input v-model="form.itemAddFilter" placeholder="请输入查询条件" size="mini"></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="绑定表单">
            <div style="display: flex;align-items: center;">
              <el-select v-model="form.region" placeholder="请选择活动区域" size="mini">
                <el-option label="区域一" value="shanghai"></el-option>
                <el-option label="区域二" value="beijing"></el-option>
              <el-select v-model="form.itemInObj" clearable placeholder="请选择绑定表单" size="mini">
                <el-option v-for="(item,index) in selectList" :key="index" :label="item.viName"
                           :value="item.id"></el-option>
              </el-select>
              <el-button plain size="mini" style="margin-left: 3px" type="success">选择</el-button>
              <el-button plain size="mini" style="margin-left: 3px" type="success" @click="formSelectClickHandler">选择
              </el-button>
            </div>
          </el-form-item>
        </el-col>
@@ -45,9 +45,11 @@
        <el-col :span="12">
          <el-form-item label="父名称">
            <div style="display: flex;align-items: center;">
              <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
              <el-checkbox v-model="checked" style="margin-left: 5px; margin-right: 5px">显示查询区域</el-checkbox>
              <el-checkbox v-model="checked" style="margin-left: 5px;margin-right: 0px">显示文件夹</el-checkbox>
              <el-input v-model="form.itemParentFolderName" placeholder="请输入父名称" size="mini"></el-input>
              <el-checkbox v-model="form.itemIsNavigatorExpand" style="margin-left: 5px; margin-right: 5px">显示查询区域
              </el-checkbox>
              <el-checkbox v-model="form.itemIsShowFolder" style="margin-left: 5px;margin-right: 0px">显示文件夹
              </el-checkbox>
            </div>
          </el-form-item>
        </el-col>
@@ -57,8 +59,10 @@
            <div style="display: flex; align-items: center">
              <div style="height: 260px; width: 160px; border: 1px solid #bdbbbb;overflow-y: auto">
                <el-table
                  :data="showLifeTable"
                  style="width: 100%">
                  :data="form.itemSelectOutFieldList"
                  :highlight-current-row="true"
                  style="width: 100%"
                  @row-click="showLabelLeftRowClick">
                  <el-table-column
                    align="center"
                    label="可使用字段"
@@ -67,13 +71,16 @@
                </el-table>
              </div>
              <div style="margin-left: 10px; margin-right: 10px">
                <el-button circle icon="el-icon-back" style="margin-right: 10px"></el-button>
                <el-button circle icon="el-icon-right"></el-button>
                <el-button circle icon="el-icon-back" style="margin-right: 10px"
                           @click="showLeftTransferClick"></el-button>
                <el-button circle icon="el-icon-right" @click="showRightTransferClick"></el-button>
              </div>
              <div style="height: 260px; width: 160px; border: 1px solid #bdbbbb;overflow-y: auto">
                <el-table
                  :data="showRightTable"
                  style="width: 100%">
                  :data="form.itemOutFieldList"
                  :highlight-current-row="true"
                  style="width: 100%"
                  @row-click="showLabelRightRowClick">
                  <el-table-column
                    align="center"
                    label="需要使用字段"
@@ -90,8 +97,10 @@
            <div style="display: flex; align-items: center">
              <div style="height: 260px; width: 160px; border: 1px solid #bdbbbb;overflow-y: auto">
                <el-table
                  :data="searchLifeTable"
                  style="width: 100%">
                  :data="form.itemSearchFieldList"
                  :highlight-current-row="true"
                  style="width: 100%"
                  @row-click="searchLeftRowClick">
                  <el-table-column
                    align="center"
                    label="可供搜索字段"
@@ -100,13 +109,16 @@
                </el-table>
              </div>
              <div style="margin-left: 10px; margin-right: 10px">
                <el-button circle icon="el-icon-back" style="margin-right: 10px"></el-button>
                <el-button circle icon="el-icon-right"></el-button>
                <el-button circle icon="el-icon-back" style="margin-right: 10px"
                           @click="searchLeftTransferClick"></el-button>
                <el-button circle icon="el-icon-right" @click="searchRightTransferClick"></el-button>
              </div>
              <div style="height: 260px; width: 160px; border: 1px solid #bdbbbb;overflow-y: auto">
                <el-table
                  :data="searchRightTable"
                  style="width: 100%">
                  :data="form.itemKeyFieldList"
                  :highlight-current-row="true"
                  style="width: 100%"
                  @row-click="searchRightRowClick">
                  <el-table-column
                    align="center"
                    label="需搜索字段"
@@ -120,9 +132,9 @@

        <el-col :span="12">
          <el-form-item label="列">
            <el-select v-model="form.region" placeholder="请选择列" size="mini">
              <el-option label="区域一" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            <el-select v-model="form.itemFileWidthSelect" placeholder="请选择列" size="mini" @change="itemFileWidthChange">
              <el-option v-for="(item,index) in form.itemFieldWidthList" :key="index" :label="item.key"
                         :value="item.key"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
@@ -130,8 +142,10 @@
        <el-col :span="12">
          <el-form-item label="宽度">
            <div style="display: flex;align-items: center;">
              <el-input v-model="user" placeholder="请输入内容" size="mini" style="width: 193px"></el-input>
              <el-button plain size="mini" style="margin-left: 3px" type="success">设置</el-button>
              <el-input v-model="form.itemWidth" placeholder="请输入宽度" size="mini" style="width: 193px"
                        type="number"></el-input>
              <el-button plain size="mini" style="margin-left: 3px" type="success" @click="widthSetUpClickHandler">设置
              </el-button>
            </div>
          </el-form-item>
        </el-col>
@@ -141,25 +155,26 @@
        <el-form-item label="设置列宽">
          <div style="height: 150px; width: 100%; border: 1px solid #bdbbbb;overflow-y: auto">
            <el-table
              :data="columnWidthData"
              :data="form.itemFieldWidthList"
              :highlight-current-row="true"
              border
              stripe
              style="width: 100%">
              style="width: 100%"
              @row-click="itemFileWidthRowClick">
              <el-table-column
                align="center"
                label="列名"
                prop="id">
                prop="key">
                <template slot-scope="scope">
                  <el-tag size="medium">{{ scope.row.id }}</el-tag>
                  <el-tag size="medium">{{ scope.row.key }}</el-tag>
                </template>
              </el-table-column>
              <el-table-column
                align="center"
                label="列宽"
                prop="width">
                prop="value">
                <template slot-scope="scope">
                  <el-tag size="medium">{{ scope.row.width }}</el-tag>
                  <el-tag size="medium">{{ scope.row.value }}</el-tag>
                </template>
              </el-table-column>
            </el-table>
@@ -169,22 +184,24 @@

      <el-col :span="8">
        <el-form-item label="查询字段">
          <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
          <el-input v-model="form.searchLabel" placeholder="请输入查询字段" size="mini"></el-input>
        </el-form-item>
      </el-col>

      <el-col :span="8">
        <el-form-item label="查询次数">
          <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
          <el-input v-model="form.searchNumber" placeholder="请输入查询次数" size="mini"></el-input>
        </el-form-item>
      </el-col>

      <el-col :span="8">
        <el-form-item label="查询sql">
          <div style="display: flex;align-items: center">
            <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
            <el-button plain size="mini" style="margin-left: 3px" type="success">添加</el-button>
            <el-button plain size="mini" style="margin-left: 3px" type="danger">删除</el-button>
            <el-input v-model="form.searchSql" placeholder="请输入sql" size="mini"></el-input>
            <el-button plain size="mini" style="margin-left: 3px" type="success" @click="searchAddClickHandler">添加
            </el-button>
            <el-button plain size="mini" style="margin-left: 3px" type="danger" @click="searchDelClickHandler">删除
            </el-button>
          </div>
        </el-form-item>
      </el-col>
@@ -193,33 +210,34 @@
        <el-form-item label="查询字段">
          <div style="height: 150px; width: 100%; border: 1px solid #bdbbbb;overflow-y: auto">
            <el-table
              :data="columnSearchData"
              :data="form.itemSeniorQueryBOS"
              :highlight-current-row="true"
              border
              stripe
              style="width: 100%">
              style="width: 100%"
              @row-click="itemSeniorRowClick">
              <el-table-column
                align="center"
                label="查询字段"
                prop="id">
                prop="itemSeniorQueryCols">
                <template slot-scope="scope">
                  <el-tag size="medium">{{ scope.row.id }}</el-tag>
                  <el-tag size="medium">{{ scope.row.itemSeniorQueryCols }}</el-tag>
                </template>
              </el-table-column>
              <el-table-column
                align="center"
                label="查询次数"
                prop="name">
                prop="itemSeniorQueryColsCounts">
                <template slot-scope="scope">
                  <el-tag size="medium">{{ scope.row.name }}</el-tag>
                  <el-tag size="medium">{{ scope.row.itemSeniorQueryColsCounts }}</el-tag>
                </template>
              </el-table-column>
              <el-table-column
                align="center"
                label="查询sql"
                prop="sql">
                prop="itemQuerySql">
                <template slot-scope="scope">
                  <el-tag size="medium">{{ scope.row.sql }}</el-tag>
                  <el-tag size="medium">{{ scope.row.itemQuerySql }}</el-tag>
                </template>
              </el-table-column>
            </el-table>
@@ -229,9 +247,9 @@

      <el-col :span="24">
        <el-form-item label="双击操作">
          <el-select v-model="form.region" placeholder="请选择双击操作" size="mini">
            <el-option label="区域一" value="shanghai"></el-option>
            <el-option label="区域二" value="beijing"></el-option>
          <el-select v-model="form.itemDbl" placeholder="请选择双击操作" size="mini">
            <el-option v-for="(item,index) in itemDblList" :key="index" :label="item.value"
                       :value="item.key"></el-option>
          </el-select>
        </el-form-item>
      </el-col>
@@ -241,11 +259,11 @@
          <div style="display: flex;align-items: center">
            <div style="display: flex;align-items: center;width: 100%;">
              <span>长：</span>
              <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
              <el-input v-model="itemImgHeight" placeholder="请输入长度" size="mini"></el-input>
            </div>
            <div style="display: flex;align-items: center;width: 100%;margin-left: 30px">
              <span>宽：</span>
              <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
              <el-input v-model="itemImgWidth" placeholder="请输入宽度" size="mini"></el-input>
            </div>
          </div>
        </el-form-item>
@@ -253,19 +271,19 @@

      <el-col :span="12">
        <el-form-item label="字符串截取">
          <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
          <el-input v-model="form.itemCut" placeholder="请输入字符串" size="mini"></el-input>
        </el-form-item>
      </el-col>

      <el-col :span="8">
        <el-form-item label="超链接">
          <el-input v-model="user" placeholder="请输入内容" size="mini"></el-input>
          <el-input v-model="form.itemHrefConf" placeholder="请输入超链接" size="mini"></el-input>
        </el-form-item>
      </el-col>

      <el-col :span="24">
        <el-form-item label="查询模板">
          <el-select v-model="form.region" placeholder="请选择查询模板" size="mini">
          <el-select v-model="form.itemQtName" placeholder="请选择查询模板" size="mini">
            <el-option label="区域一" value="shanghai"></el-option>
            <el-option label="区域二" value="beijing"></el-option>
          </el-select>
@@ -274,62 +292,432 @@
    </el-form>

    <span slot="footer" class="dialog-footer">
         <el-button>取 æ¶ˆ</el-button>
         <el-button type="primary">ç¡® å®š</el-button>
         <el-button @click="closeDialog">取 æ¶ˆ</el-button>
         <el-button type="primary" @click="dialogSaveClickHandler">ç¡® å®š</el-button>
    </span>

    <el-dialog
      v-dialogDrag
      v-loading="selectFormLoading"
      :visible.sync="selectFormVisible"
      append-to-body="true"
      class="avue-dialog"
      title="表单选择"
      width="50%">
      <avue-crud
        ref="crud"
        :data="selectFormData"
        :option="selectFormOption"
        @selection-change="selectionChange"
        @row-click="rowClick">

      </avue-crud>

      <span slot="footer" class="dialog-footer">
         <el-button @click="selectFormVisible = false">取 æ¶ˆ</el-button>
         <el-button type="primary" @click="selectFormAddClickHandler">ç¡® å®š</el-button>
    </span>
    </el-dialog>
  </el-dialog>

</template>

<script>
import basicOption from "@/util/basic-option";
import {gridPortalVIDatas, getPortalVIById, getItemDblList, savePortalVI} from "@/api/UI/formDefine/api";
import func from "@/util/func";

export default {
  name: "tableDialog",
  props: {
    TreeNodeRow: {
      type: Object,
      default: () => {
      }
    },
    treeRadio: {
      type: String,
      default: ""
    }
  },
  created() {
    // this.getDbList();
  },
  data() {
    return {
      columnSearchData: [
        {
          id: 'test',
          name: '3',
          sql: 'xxxxx'
        }
      ],
      columnWidthData: [
        {
          id: 'test',
          width: '250'
        }
      ],
      searchLifeTable: [],
      searchRightTable: [],
      showRightTable: [],
      showLifeTable: [
        {
          id: 'test1'
        },
        {
          id: 'test2'
        },
        {
          id: 'test1'
        },
        {
          id: 'test2'
        },
        {
          id: 'test1'
        },
        {
          id: 'test2'
        }
      ],
      formLoading: false,
      itemImgHeight: '',
      itemImgWidth: '',
      itemSeniorRow: {},
      itemDblList: [],
      selectFormOption: {
        ...basicOption,
        addBtn: false,
        menu: false,
        refreshBtn: false,
        column: [
          {
            label: '业务名称',
            prop: 'typeName',

          },
          {
            label: '名称',
            prop: 'viName',
            sortable: true,
          },
          {
            label: '类型',
            prop: 'viTypeText',
          },
        ]
      },
      selectFormData: [],
      selectFormLoading: false,
      selectFormVisible: false,
      rules: {},
      form: {},
      form: {
        viName: '', // åç§°
        itemPageSize: '', // æ¯é¡µå¯æ˜¾ç¤ºè¡Œæ•°
        itemAddFilter: '', // é™„加查询条件
        itemInObj: '', // ç»‘定表单
        itemParentFolderName: '', // çˆ¶åç§°
        itemIsShowFolder: false, // æ˜¯å¦æ˜¾ç¤ºæ–‡ä»¶å¤¹
        itemIsNavigatorExpand: false, // æ˜¾ç¤ºæŸ¥è¯¢åŒºåŸŸ
        itemSelectOutFieldList: [], // å¯ä½¿ç”¨å­—段
        itemOutFieldList: [], // éœ€è¦ä½¿ç”¨å­—段 // åˆ—下拉框
        itemSearchFieldList: [], // å¯ä¾›æœç´¢ä½¿ç”¨å­—段
        itemKeyFieldList: [], // éœ€è¦æœç´¢å­—段
        itemWidth: '250', // å®½åº¦
        itemFieldWidthList: [], // è®¾ç½®åˆ—宽数组 ä¸Ž itemOutFieldList ç›¸åŒ¹é…
        itemFileWidthSelect: '', // åˆ—下拉框
        searchLabel: '', // æŸ¥è¯¢å­—段
        searchNumber: '1', // æŸ¥è¯¢æ¬¡æ•°
        searchSql: '', // æŸ¥è¯¢sql
        itemSeniorQueryBOS: [], // æŸ¥è¯¢å­—段列表
        itemDbl: [], // åŒå‡»æ“ä½œ
        itemImgWH: '', // å›¾ç‰‡å®½é«˜ w,h
        itemCut: '', // å­—符串截取
        itemHrefConf: '', // è¶…链接
        itemQtName: '', // æŸ¥è¯¢æ¨¡æ¿
      },
      defaultForm: {
        viName: '', // åç§°
        itemPageSize: '', // æ¯é¡µå¯æ˜¾ç¤ºè¡Œæ•°
        itemAddFilter: '', // é™„加查询条件
        itemInObj: '', // ç»‘定表单
        itemParentFolderName: '', // çˆ¶åç§°
        itemIsShowFolder: false, // æ˜¯å¦æ˜¾ç¤ºæ–‡ä»¶å¤¹
        itemIsNavigatorExpand: false, // æ˜¾ç¤ºæŸ¥è¯¢åŒºåŸŸ
        itemSelectOutFieldList: [], // å¯ä½¿ç”¨å­—段
        itemOutFieldList: [], // éœ€è¦ä½¿ç”¨å­—段 // åˆ—下拉框
        itemSearchFieldList: [], // å¯ä¾›æœç´¢ä½¿ç”¨å­—段
        itemKeyFieldList: [], // éœ€è¦æœç´¢å­—段
        itemWidth: '250', // å®½åº¦
        itemFieldWidthList: [], // è®¾ç½®åˆ—宽数组 ä¸Ž itemOutFieldList ç›¸åŒ¹é…
        itemFileWidthSelect: '', // åˆ—下拉框
        searchLabel: '', // æŸ¥è¯¢å­—段
        searchNumber: '1', // æŸ¥è¯¢æ¬¡æ•°
        searchSql: '', // æŸ¥è¯¢sql
        itemSeniorQueryBOS: [], // æŸ¥è¯¢å­—段列表
        itemDbl: [], // åŒå‡»æ“ä½œ
        itemImgWH: '', // å›¾ç‰‡å®½é«˜ w,h
        itemCut: '', // å­—符串截取
        itemHrefConf: '', // è¶…链接
        itemQtName: '', // æŸ¥è¯¢æ¨¡æ¿
      },
      loading: false,
      visible: false
      visible: false,
      selectList: [],
      lastIndex: null,
      showLabelLeftRow: {},
      showLabelRightRow: {},
      searchLeftRow: {},
      searchRightRow: {},
      itemFileWidthRow: {},
      itemFileWidthChangeVal: '',
    }
  },
  methods: {
    // å…³é—­å¯¹è¯æ¡†
    closeDialog() {
      this.visible = false;
      this.form = {...this.defaultForm};
    },

    // é€‰æ‹©è¡¨å•å…³é—­å¯¹è¯æ¡†
    closeSelectFormDialog() {

    },

    // é€‰æ‹©ç»‘定表单
    formSelectClickHandler() {
      this.selectFormVisible = true;
      const params = {
        'conditionMap[typeName]': this.TreeNodeRow.attributes.id,
        'conditionMap[viType]': 'Form',
        'conditionMap[viTypeFlag]': this.treeRadio === '0' ? 'BtmType' : this.treeRadio === '1' ? 'LinkType' : '',
      }
      gridPortalVIDatas(1, -1, params).then(res => {
        if (res.data.code === 200) {
          const data = res.data.data;
          this.selectFormData = data;
        }
      });
    },

    // èŽ·å–初始化表格里需要的默认数据
    getFormSelectList() {
      this.formLoading = true;
      const params = {
        'conditionMap[typeName]': this.TreeNodeRow.id,
        'conditionMap[viType]': 'Form',
        'conditionMap[viTypeFlag]': this.treeRadio === '0' ? 'BtmType' : this.treeRadio === '1' ? 'LinkType' : '',
      };

      // å‘起第一个请求
      gridPortalVIDatas(1, -1, params).then(res => {
        if (res.data.code === 200) {
          const data = res.data.data;
          this.selectList = data;

          // ç¡®ä¿ this.selectList å·²ç»èµ‹å€¼ä¸”不为空
          if (this.selectList && this.selectList.length > 0) {
            const param = {
              id: this.selectList[0].id,
              viType: '1'
            };

            // å‘起第二个请求
            return getPortalVIById(param);
          }
        }
      }).then(res => {
        if (res.data.code === 200) {
          const data = res.data.obj.prm.prmItemList.map(item => ({
            id: item.itemField
          }));
          // è¿‡æ»¤å‡ºæ¥éœ€è¦ä½¿ç”¨å­—段 èµ‹å€¼ç»™ å¯ä½¿ç”¨å­—段渲染 ï¼ˆä½¿ç”¨å­—段由编辑接口传递）
          const list = data.filter(item =>
            !this.form.itemOutFieldList.some(outItem => outItem.id === item.id)
          );
          this.$set(this.form, 'itemSelectOutFieldList', list);
          this.formLoading = false;
        }
      })
    },

    // è¡¨æ ¼å¤šé€‰
    selectionChange(list) {
      this.selectList = list;
    },

    // è¡Œç‚¹å‡»
    rowClick(row) {
      func.rowClickHandler(
        row,
        this.$refs.crud,
        this.lastIndex,
        (newIndex) => {
          this.lastIndex = newIndex;
        },
        () => {
          this.selectList = [];
        }
      );
    },

    // è¡¨å•é€‰æ‹©ç¡®å®š
    selectFormAddClickHandler() {
      if (this.selectList.length <= 0) {
        this.$message.error('请至少选择一条数据');
        return;
      }

      if (this.selectList.length > 1) {
        this.$message.error('只能选择一条数据');
        return;
      }
      const params = {
        id: this.selectList[0].id,
        viType: '1'
      }
      getPortalVIById(params).then(res => {
        if (res.data.code === 200) {
          const data = res.data.obj.prm.prmItemList.map(item => {
            return {
              id: item.itemField
            }
          });
          this.form.itemSelectOutFieldList = data;
          this.selectFormVisible = false;
        }
      })
      this.form.itemInObj = this.selectList[0].id;
    },

    // æ˜¾ç¤ºå­—段左侧表格行点击
    showLabelLeftRowClick(row) {
      this.showLabelLeftRow = row;
    },

    // æ˜¾ç¤ºå­—段右侧表格行点击
    showLabelRightRowClick(row) {
      this.showLabelRightRow = row;
    },

    // æœç´¢å­—段左侧表格行点击
    searchLeftRowClick(row) {
      this.searchLeftRow = row;
    },

    // æœç´¢å­—段右侧表格行点击
    searchRightRowClick(row) {
      this.searchRightRow = row;
    },

    // æ˜¾ç¤ºå­—段穿梭框左移
    showLeftTransferClick() {
      if (func.isEmptyObject(this.showLabelRightRow)) {
        this.$message.error('请选择一条数据');
        return;
      }
      this.form.itemSelectOutFieldList.unshift(this.showLabelRightRow);
      this.form.itemOutFieldList = this.form.itemOutFieldList.filter(item => item.id !== this.showLabelRightRow.id);
      this.form.itemSearchFieldList = this.form.itemOutFieldList;
      this.form.itemFieldWidthList = this.form.itemFieldWidthList.filter(item => item.key !== this.showLabelRightRow.id);
      this.form.itemFileWidthSelect = this.form.itemFieldWidthList.length >= 1 ? this.form.itemFieldWidthList[0].key : '';
      this.showLabelRightRow = {};
    },

    // æ˜¾ç¤ºå­—段穿梭框右移
    showRightTransferClick() {
      if (func.isEmptyObject(this.showLabelLeftRow)) {
        this.$message.error('请选择一条数据');
        return;
      }
      this.form.itemOutFieldList.push(this.showLabelLeftRow);
      this.form.itemSearchFieldList = this.form.itemOutFieldList;

      // è¿‡æ»¤ itemSelectOutFieldList，移除 id ä¸Ž showLabelLeftRow.id ç›¸åŒçš„对象
      this.form.itemSelectOutFieldList = this.form.itemSelectOutFieldList.filter(item => item.id !== this.showLabelLeftRow.id);
      this.form.itemFieldWidthList.push({
        key: this.showLabelLeftRow.id,
        value: this.form.itemWidth
      });
      this.form.itemFileWidthSelect = this.form.itemFieldWidthList[0].key;
      this.showLabelLeftRow = {};

    },

    // æœç´¢å­—段穿梭框左移
    searchLeftTransferClick() {
      if (func.isEmptyObject(this.searchRightRow)) {
        this.$message.error('请选择一条数据');
        return;
      }
      this.form.itemSearchFieldList.unshift(this.searchRightRow);
      this.form.itemKeyFieldList = this.form.itemKeyFieldList.filter(item => item.id !== this.searchRightRow.id)
      this.searchRightRow = {};
    },

    // æœç´¢è‡ªåŠ¨ç©¿æ¢­æ¡†å³ç§»
    searchRightTransferClick() {
      if (func.isEmptyObject(this.searchLeftRow)) {
        this.$message.error('请选择一条数据');
        return;
      }

      this.form.itemKeyFieldList.push(this.searchLeftRow);

      this.form.itemSearchFieldList = this.form.itemSearchFieldList.filter(item => item.id !== this.searchLeftRow.id);
      this.searchLeftRow = {};
    },

    // è®¾ç½®åˆ—宽行点击
    itemFileWidthRowClick(row) {
      this.itemFileWidthRow = row;
      this.form.itemFileWidthSelect = row.key;
      this.form.itemWidth = row.value;
    },

    // åˆ—下拉change
    itemFileWidthChange(val) {
      this.itemFileWidthChangeVal = val;
    },

    // è®¾ç½®å®½åº¦
    widthSetUpClickHandler() {
      if (this.form.itemFileWidthSelect) {
        const item = this.form.itemFieldWidthList.find(item => item.key === this.form.itemFileWidthSelect);
        item.value = this.form.itemWidth;
      }
    },

    // èŽ·å–双击操作数据
    getDbList() {
      getItemDblList().then(res => {
        if (res.data.code === 200) {
          const data = res.data.data;
          this.itemDblList = data;
        }
      })
    },

    // æŸ¥è¯¢æ¨¡æ¿è¡¨æ ¼è¡Œç‚¹å‡»
    itemSeniorRowClick(row) {
      this.itemSeniorRow = row;
    },

    // æŸ¥è¯¢æ¨¡æ¿æ·»åŠ 
    searchAddClickHandler() {
      this.form.itemSeniorQueryBOS.push({
        itemSeniorQueryCols: this.form.searchLabel,
        itemSeniorQueryColsCounts: this.form.searchNumber,
        itemQuerySql: this.form.searchSql
      });
    },

    // æŸ¥è¯¢æ¨¡æ¿åˆ é™¤
    searchDelClickHandler() {
      if (func.isEmptyObject(this.itemSeniorRow)) {
        this.$message.error('请选择一条数据进行删除');
        return;
      }

      this.form.itemSeniorQueryBOS = this.form.itemSeniorQueryBOS.filter(item => item.itemSeniorQueryCols != this.itemSeniorRow.id);
      this.itemSeniorRow = {};
    },

    // è¡¨æ ¼å¯¹è¯æ¡†ä¿å­˜
    dialogSaveClickHandler() {
      this.form.itemSelectOutFieldList = this.form.itemSelectOutFieldList.map(item => item.id); // å¯ä½¿ç”¨å­—段
      this.form.itemOutFieldList = this.form.itemOutFieldList.map(item => item.id); // éœ€è¦ä½¿ç”¨å­—段
      this.form.itemSearchFieldList = this.form.itemSearchFieldList.map(item => item.id); // å¯ä¾›æœç´¢å­—段
      this.form.itemKeyFieldList = this.form.itemKeyFieldList.map(item => item.id); // éœ€è¦ä½¿ç”¨å­—段
      this.form.itemImgWH = `${this.itemImgHeight},${this.itemImgWidth}`;
      const params = {
        id: this.form.editNodeId,
        prm: {
          formQtName: '',
          prmItemList: [
            this.form
          ],
        },
        typeFlag: this.treeRadio,
        typeFlagText: this.treeRadio === '0' ? "业务类型的表单" : '链接类型的表单',
        typeName: this.TreeNodeRow.attributes.id,
        viName: this.form.viName,
        viType: 0,
        viTypeText: "表格"
      }
      savePortalVI(params).then(res => {
        if (res.data.code === 200) {
          this.$message.success('保存成功');
          this.closeDialog();
          this.$emit('updataTable');
        }
      })
    }
  }
}
@@ -342,3 +730,4 @@
  }
}
</style>


 Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/formDefine/index.vue

@@ -27,11 +27,14 @@
      <basic-container>
        <avue-crud
          v-if="!tableStatus"
          ref="crud"
          :data="data"
          :option="option"
          :page.sync="page"
          @size-change="sizeChange"
          @current-change="currentChange">
          @current-change="currentChange"
          @selection-change="selectChangeHandler"
          @row-click="rowClickHandler">
          <template slot="menuLeft">
            <div style="display: flex; align-items: center;">
               <span style="display: inline-block; margin-right: 10px;">
@@ -40,7 +43,8 @@
               </span>
              <span style="display: flex;align-items: center; margin-right: 10px;">
                <p style="display: flex; flex-shrink: 0;font-size: 14px">名称：</p>
                <el-input v-model="input" placeholder="请输入内容" size="mini"></el-input>
                <el-input v-model="topName" placeholder="请输入内容" size="mini" style="margin-right: 10px;"></el-input>
                <el-button plain size="mini" type="success" @click="nameSearchHandler">查询</el-button>
              </span>
              <span style="display: flex; align-items: center;">
                <p
@@ -59,23 +63,28 @@
        </avue-crud>
        <div v-if="!tableStatus" style="display: flex;justify-content: center;margin-top: 15px">
          <el-button icon="el-icon-plus" plain size="small" type="primary" @click="addClickHandler">增加</el-button>
          <el-button icon="el-icon-delete" plain size="small" type="danger">删除</el-button>
          <el-button icon="el-icon-delete" plain size="small" type="danger" @click="deleteClickHandler">删除</el-button>
          <el-button icon="el-icon-document-add" plain size="small" type="primary">克隆</el-button>
          <el-button icon="el-icon-upload2" plain size="small" type="primary" @click="upLoadHandler">导入</el-button>
          <el-button icon="el-icon-download" plain size="small" type="primary" @click="downLoadHandler">导出</el-button>
          <el-button icon="el-icon-upload2" plain size="small" type="primary" @click="upLoadClickHandler">导入</el-button>
          <el-button icon="el-icon-download" plain size="small" type="primary" @click="exportClickHandler">导出
          </el-button>
        </div>
      </basic-container>
    </el-main>
    <form-dialog ref="formDialog"></form-dialog>
    <table-dialog ref="tableDialog"></table-dialog>
    <form-dialog ref="formDialog" :TreeNodeRow="this.nodeRow" :treeRadio="treeRadio"></form-dialog>
    <table-dialog ref="tableDialog" :TreeNodeRow="this.nodeRow" :treeRadio="treeRadio"
                  @updataTable="getRightPortalVIDatas"></table-dialog>
    <!-- å¯¼å…¥ -->
    <upload-file ref="upload" :fileType="upFileType" :fileUrl="fileUrl" :tipList="tipList" title="导入"
                 @updata="getRightPortalVIDatas"></upload-file>
  </el-container>
</template>

<script>
import basicOption from "@/util/basic-option";
import FormDialog from "@/views/modelingMenu/ui/formDefine/components/formDialog";
import TableDialog from "@/views/modelingMenu/ui/formDefine/components/tableDialog"
import {gridPortalVIDatas} from "@/api/UI/formDefine/api"
import TableDialog from "@/views/modelingMenu/ui/formDefine/components/tableDialog";
import {gridPortalVIDatas, getPortalVIById, deleteByIds, exportExcel} from "@/api/UI/formDefine/api";
import {getBizTypes} from "@/api/modeling/businessType/api";
import {gridLink} from "@/api/modeling/linkType/api";
import func from "@/util/func";
@@ -85,6 +94,16 @@
  components: {FormDialog, TableDialog},
  data() {
    return {
      tipList: [
        "导入业务类型名称不可为空",
        "导入名称不可为空且名称只能为英文字母",
        "上传的文件为压缩文件，且压缩格式仅能为zip格式"
      ],
      upFileType: ['zip'],
      fileUrl: 'api/portalVIController/importData',
      lastIndex: null,
      selectList: [],
      topName: '',
      page: {
        currentPage: 1,
        pageSize: 10,
@@ -119,8 +138,15 @@
      treeRadio: "0",
      treeData: [],
      treeOption: {
        addBtn: false
      }
        addBtn: false,
        props: {
          label: 'id',
          value: 'id',
          children: 'children'
        }
      },
      dbClickList: [],
      defaultData: [], // ç”¨äºŽæŸ¥è¯¢æ¢å¤åŽŸå§‹å€¼
    }
  },
  created() {
@@ -128,7 +154,7 @@
  },
  computed: {
    tableStatus() {
      return func.isEmptyObject(this.nodeRow)
      return func.isEmptyObject(this.nodeRow);
    }
  },
  methods: {
@@ -138,8 +164,13 @@
        this.$message.error('请在表格上方选择新增类型');
        return;
      }

      this.tableRadio === "0" ? this.$refs.formDialog.visible = true : this.$refs.tableDialog.visible = true;
      if (this.tableRadio === "0") {
        this.$refs.formDialog.visible = true;
        this.$refs.formDialog.getTreeList();
      } else {
        this.$refs.tableDialog.visible = true;
        this.$refs.tableDialog.getDbList();
      }
    },

    // åˆå§‹åŒ–树请求
@@ -147,12 +178,13 @@
      this.treeLoading = true;
      getBizTypes().then(res => {
        const data = res.data.data.map(item => {
          item.label = item.attributes.id;
          return item;
          this.processChildren(item); // å¤„理每个节点
          item.attributes.id = item.attributes.id;
          return item.attributes; // è¿”回处理后的 attributes
        });
        this.treeData = data;
        this.treeLoading = false;
      })
      });
    },

    // å·¦ä¾§ä¸šåŠ¡ç±»åž‹åˆ‡æ¢
@@ -162,12 +194,12 @@
      if (val === "0") {
        getBizTypes().then(res => {
          const data = res.data.data.map(item => {
            item.label = item.attributes.id;
            return item;
            this.processChildren(item); // å¤„理每个节点
            item.attributes.id = item.attributes.id;
            return item.attributes; // è¿”回处理后的 attributes
          });
          this.treeData = data;
          this.treeLoading = false;
        })
        });
      } else {
        gridLink().then(res => {
          const data = res.data.data.map(item => {
@@ -180,9 +212,19 @@
      }
    },

    // å¤„理树形结构
    processChildren(item) {
      if (item.children && item.children.length > 0) {
        item.attributes.children = item.children.map(child => {
          child.attributes.id = child.attributes.id;
          this.processChildren(child); // é€’归处理每个子节点
          return child.attributes; // åªè¿”回子节点的 attributes
        });
      }
    },

    // å·¦ä¾§æ ‘点击
    nodeClick(row) {
      console.log(row);
      this.tableRadio = null;
      this.nodeRow = row;
      this.getRightPortalVIDatas(row);
@@ -197,15 +239,15 @@
    // å³ä¾§ è¡¨æ ¼ è¡¨å• ä¿¡æ¯æŸ¥è¯¢
    getRightPortalVIDatas() {
      const params = {
        'conditionMap[typeName]': this.treeRadio === '0' ? this.nodeRow.attributes.id : this.nodeRow.name,
        'conditionMap[typeName]': this.treeRadio === '0' ? this.nodeRow.id : this.nodeRow.name,
        'conditionMap[viType]': this.tableRadio === '0' ? 'Form' : this.tableRadio === '1' ? 'Table' : '',
        'conditionMap[viTypeFlag]': this.treeRadio === '0' ? 'BtmType' : this.treeRadio === '1' ? 'LinkType' : '',
      }
      gridPortalVIDatas(this.page.currentPage, this.page.pageSize, params).then(res => {
        console.log(res);
        if (res.data.code === 200) {
          const data = res.data.data;
          this.data = data;
          this.defaultData = data;
          this.page.total = res.data.total;
        }
      })
@@ -227,6 +269,177 @@
      this.getRightPortalVIDatas();
    },

    // ç¼–辑按钮
    editBtnClick(row) {
      // è¡¨æ ¼
      if (row.viType === 0) {
        const params = {
          id: row.id,
          viType: row.viType
        };

        getPortalVIById(params).then(res => {
          if (res.data.code === 200) {
            const data = res.data.obj.prm;
            const prmItem = data.prmItemList[0] || {}; // å–出第一个元素并提供默认值

            // èŽ·å–初始化表格里需要的默认数据
            this.$refs.tableDialog.getFormSelectList();

            // æ›´æ–°è¡¨å•
            this.$refs.tableDialog.form = {
              ...prmItem,
              viName: res.data.obj.viName,
              editNodeId: row.id,
              itemOutFieldList: (prmItem.itemOutFieldList || []).map(item => ({id: item})),
              itemSearchFieldList: (prmItem.itemSearchFieldList || []).map(item => ({id: item})),
              itemKeyFieldList: (prmItem.itemKeyFieldList || []).map(item => ({id: item})),
              searchLabel: prmItem.itemSeniorQueryCols || '',
              searchNumber: prmItem.itemSeniorQueryColsCounts || '1',
              searchSql: prmItem.itemQuerySql || '',
              itemFileWidthSelect: (prmItem.itemFieldWidthList && prmItem.itemFieldWidthList.length > 0) ? prmItem.itemFieldWidthList[0].key : '',
              itemWidth: (prmItem.itemFieldWidthList && prmItem.itemFieldWidthList.length > 0) ? prmItem.itemFieldWidthList[0].value : '250'
            };

            // å¤„理图片宽高
            const [width = '0', height = '0'] = (prmItem.itemImgWH || '0,0').split(',');
            this.$refs.tableDialog.itemImgWidth = width;
            this.$refs.tableDialog.itemImgHeight = height;

            // åŒå‡»æ“ä½œèŽ·å–数据方法
            this.$refs.tableDialog.getDbList();

            // æ˜¾ç¤ºå¯¹è¯æ¡†
            this.$refs.tableDialog.visible = true;
          }
        });
      } else {
        const params = {
          id: row.id,
          viType: row.viType
        };

        getPortalVIById(params).then(res => {
          if (res.data.code === 200) {
            const data = res.data.obj.prm.prmItemList;

            const updatedData = data.map(item => {
              const {itemField, ...rest} = item;
              return {
                text: itemField,
                ...rest
              };
            });
            this.$refs.formDialog.formList = updatedData;
            this.$refs.formDialog.getTreeList();
            this.$refs.formDialog.topForm.viName = res.data.obj.viName;
            this.$refs.formDialog.topForm.columnNumber = this.getValueBasedOnInput(res.data.obj.prm.showCols);

            this.$refs.formDialog.visible = true;
          }
        })
      }
    },

    // æ ¹æ®ä¼ å…¥æ¯è¡Œåˆ—æ•° æ¥åˆ¤æ–­el-col :span是多少
    getValueBasedOnInput(val) {
      const n = JSON.parse(val ? val : '3');
      switch (n) {
        case 1:
          return 24;
        case 2:
          return 12;
        case 3:
          return 8;
        case 4:
          return 6;
        case 5:
          return 4;
        case 6:
          return 4;
        case 7:
        case 8:
          return 3;
        case 9:
          return 2;
        default:
          return n > 10 ? 1 : 8; // é»˜è®¤ç»™8
      }
    },

    // åç§°æŸ¥è¯¢
    nameSearchHandler() {
      if (!this.topName) {
        this.data = this.defaultData;
        return;
      }

      const list = this.data.filter(item => item.viName.includes(this.topName.trim()));
      this.data = list;
    },

    // åˆ é™¤æŒ‰é’®
    deleteClickHandler() {
      if (this.selectList.length <= 0) {
        this.$message.error('请至少选择一条数据');
        return;
      }
      console.log(this.selectList);
      const params = {
        ids: this.selectList.map(item => item.id).join(',')
      }
      deleteByIds(params).then(res => {
        console.log(res);
        if (res.data.code === 200) {
          this.$message.success('删除成功');
          this.getRightPortalVIDatas();
        }
      })

    },

    // å¤šé€‰
    selectChangeHandler(row) {
      this.selectList = row;
    },

    // è¡Œç‚¹å‡»
    rowClickHandler(row) {
      func.rowClickHandler(
        row,
        this.$refs.crud,
        this.lastIndex,
        (newIndex) => {
          this.lastIndex = newIndex;
        },
        () => {
          this.selectList = [];
        }
      );
    },

    // å¯¼å‡º
    exportClickHandler() {
      if (this.selectList.length <= 0) {
        this.$message.error('请至少选择一条数据');
        return;
      }

      const params = {
        ids: this.selectList.map(item => item.id).join(',')
      }
      exportExcel(params).then(res => {
        func.downloadFileByBlobHandler(res);
        this.$message.success('导出成功');
      }).catch(err => {
        this.$message.error(err);
      });
    },

    // å¯¼å…¥
    upLoadClickHandler() {
      this.$refs.upload.visible = true;
    }
  }
}
</script>
@@ -265,7 +478,6 @@
.headerCon > .el-button:nth-child(7) {
  margin-left: 0;
}


.smallBtn {
  width: 82px;

 Source/plt-web/plt-web-ui/src/views/systemModel/systemConfig/index.vue

@@ -306,24 +306,35 @@
        ids: row.id,
        isConfCategorys: this.nodeRow.id === 'firstNode' ? true : false
      }
      getAppConfigCategoryInfo(params).then(res => {
        console.log(res)
        if (res.data.code === 200) {
          this.$message.success('删除成功');
          if (this.nodeRow.id === 'firstNode') {
            this.getTreeList('save');
          } else {
            this.configLoading = true;
            getAppConfigDetailsByID({clsId: this.nodeRow.id}).then(res => {
              if (res.data.code === 200) {
                const data = res.data.data;
                this.configData = data;
                this.configLoading = false;
              }
            })
      this.$confirm('您确定要删除当前数据吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        getAppConfigCategoryInfo(params).then(res => {
          console.log(res)
          if (res.data.code === 200) {
            this.$message.success('删除成功');
            if (this.nodeRow.id === 'firstNode') {
              this.getTreeList('save');
            } else {
              this.configLoading = true;
              getAppConfigDetailsByID({clsId: this.nodeRow.id}).then(res => {
                if (res.data.code === 200) {
                  const data = res.data.data;
                  this.configData = data;
                  this.configLoading = false;
                }
              })
            }
          }
        }
      })
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },

    // é€‰æ‹©æ¡†
@@ -352,30 +363,43 @@
        this.$message.error('请至少选择一条数据');
        return;
      }

      const params = {
        ids: this.selectList.map(item => {
          return item.id
        }).join(','),
        isConfCategorys: this.nodeRow.id === 'firstNode' ? true : false
      }
      getAppConfigCategoryInfo(params).then(res => {
        console.log(res)
        if (res.data.code === 200) {
          this.$message.success('删除成功');
          if (this.nodeRow.id === 'firstNode') {
            this.getTreeList('save');
          } else {
            this.configLoading = true;
            getAppConfigDetailsByID({clsId: this.nodeRow.id}).then(res => {
              if (res.data.code === 200) {
                const data = res.data.data;
                this.configData = data;
                this.configLoading = false;
              }
            })

      this.$confirm('您确定要删除当前数据吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        getAppConfigCategoryInfo(params).then(res => {
          console.log(res)
          if (res.data.code === 200) {
            this.$message.success('删除成功');
            if (this.nodeRow.id === 'firstNode') {
              this.getTreeList('save');
            } else {
              this.configLoading = true;
              getAppConfigDetailsByID({clsId: this.nodeRow.id}).then(res => {
                if (res.data.code === 200) {
                  const data = res.data.data;
                  this.configData = data;
                  this.configLoading = false;
                }
              })
            }
          }
        }
      })
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },

    // å¯¼å‡ºæŒ‰é’®