Merge remote-tracking branch 'origin/master'

ruoyi-admin/src/main/java/com/ruoyi/web/controller/system/SysBpmNodeScriptController.java

@@ -2,6 +2,8 @@ package com.ruoyi.web.controller.system;
 
 import java.util.List;
 import javax.servlet.http.HttpServletResponse;
+
+import com.ruoyi.common.annotation.Anonymous;
 import io.swagger.annotations.Api;
 import io.swagger.annotations.ApiOperation;
 import org.springframework.security.access.prepost.PreAuthorize;
@@ -110,4 +112,13 @@ public class SysBpmNodeScriptController extends BaseController
     {
         return toAjax(sysBpmNodeScriptService.deleteSysBpmNodeScriptByIds(ids));
     }
+
+    /**
+     *  根据scriptKey获取流程节点脚本详细信息
+     */
+    @Anonymous
+    @GetMapping("/selectSysBpmNodeScriptByScriptKey/{scriptKey}")
+    public AjaxResult selectSysBpmNodeScriptByScriptKey(@PathVariable("scriptKey") String scriptKey){
+        return success(sysBpmNodeScriptService.selectSysBpmNodeScriptByScriptKey(scriptKey));
+    }
 }

ruoyi-admin/src/main/java/com/ruoyi/web/controller/system/SysRoleController.java

@@ -2,6 +2,8 @@ package com.ruoyi.web.controller.system;
 
 import java.util.List;
 import javax.servlet.http.HttpServletResponse;
+
+import com.ruoyi.common.annotation.Anonymous;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.security.access.prepost.PreAuthorize;
 import org.springframework.validation.annotation.Validated;
@@ -263,4 +265,13 @@ public class SysRoleController extends BaseController
         ajax.put("depts", deptService.selectDeptTreeList(new SysDept()));
         return ajax;
     }
+
+    /**
+     * 根据角色权限字符查询该角色下是否存在真实用户
+     */
+    @Anonymous
+    @GetMapping("/selectUserByRoleKey/{roleKeys}")
+    public AjaxResult selectUserByRoleKey(@PathVariable("roleKeys") List<String> roleKeys){
+        return AjaxResult.success(roleService.selectUserByRoleKey(roleKeys));
+    }
 }

ruoyi-admin/src/main/java/com/ruoyi/web/controller/system/SysUserController.java

@@ -282,4 +282,13 @@ public class SysUserController extends BaseController
     public AjaxResult selectAllUser(){
         return AjaxResult.success(userService.selectAllUser());
     }
+
+    /**
+     * 查询这组用户中是否存在真实用户
+     */
+    @Anonymous
+    @GetMapping("/selectUserByUserIds/{userIds}")
+    public AjaxResult selectUserByUserIds(@PathVariable("userIds") List<Long> userIds){
+        return AjaxResult.success(userService.selectUserByUserIds(userIds));
+    }
 }

ruoyi-system/src/main/java/com/ruoyi/system/mapper/SysBpmNodeScriptMapper.java

@@ -58,4 +58,11 @@ public interface SysBpmNodeScriptMapper
      * @return 结果
      */
     int deleteSysBpmNodeScriptByIds(Long[] ids);
+
+    /**
+     * 根据scriptKey查询流程节点脚本
+     * @param scriptKey 唯一标识
+     * @return
+     */
+    SysBpmNodeScript selectSysBpmNodeScriptByScriptKey(String scriptKey);
 }

ruoyi-system/src/main/java/com/ruoyi/system/mapper/SysUserMapper.java

@@ -136,4 +136,11 @@ public interface SysUserMapper
      * 根据租户编号查询用户编号
      */
     Long[] selectUserIdByTenantIds(Long[] tenantIds);
+
+    /**
+     * 查询这组用户中是否存在真实用户
+     * @param userIds
+     * @return
+     */
+    int selectUserByUserIds(List<Long> userIds);
 }

ruoyi-system/src/main/java/com/ruoyi/system/mapper/SysUserRoleMapper.java

@@ -59,4 +59,11 @@ public interface SysUserRoleMapper
      * @return 结果
      */
     public int deleteUserRoleInfos(@Param("roleId") Long roleId, @Param("userIds") Long[] userIds);
+
+    /**
+     * 根据角色权限字符查询该角色下是否存在真实用户
+     * @param roleKeys
+     * @return
+     */
+    int selectUserByRoleKey(List<String> roleKeys);
 }

ruoyi-system/src/main/java/com/ruoyi/system/service/ISysBpmNodeScriptService.java

@@ -58,4 +58,11 @@ public interface ISysBpmNodeScriptService
      * @return 结果
      */
     int deleteSysBpmNodeScriptById(Long id);
+
+    /**
+     * 根据scriptKey查询流程节点脚本
+     * @param scriptKey 唯一标识
+     * @return
+     */
+    SysBpmNodeScript selectSysBpmNodeScriptByScriptKey(String scriptKey);
 }

ruoyi-system/src/main/java/com/ruoyi/system/service/ISysRoleService.java

@@ -178,4 +178,11 @@ public interface ISysRoleService
      * @return 结果
      */
     public int insertAuthUsers(Long roleId, Long[] userIds);
+
+    /**
+     * 根据角色权限字符查询该角色下是否存在真实用户
+     * @param roleKeys
+     * @return
+     */
+    int selectUserByRoleKey(List<String> roleKeys);
 }

ruoyi-system/src/main/java/com/ruoyi/system/service/ISysUserService.java

@@ -209,4 +209,11 @@ public interface ISysUserService
      */
     List<SysUser> selectAllUser();
 
+    /**
+     * 查询这组用户中是否存在真实用户
+     * @param userIds
+     * @return
+     */
+    int selectUserByUserIds(List<Long> userIds);
+
 }

ruoyi-system/src/main/java/com/ruoyi/system/service/impl/SysBpmNodeScriptServiceImpl.java

@@ -98,4 +98,9 @@ public class SysBpmNodeScriptServiceImpl implements ISysBpmNodeScriptService
     {
         return sysBpmNodeScriptMapper.deleteSysBpmNodeScriptById(id);
     }
+
+    @Override
+    public SysBpmNodeScript selectSysBpmNodeScriptByScriptKey(String scriptKey) {
+        return sysBpmNodeScriptMapper.selectSysBpmNodeScriptByScriptKey(scriptKey);
+    }
 }

ruoyi-system/src/main/java/com/ruoyi/system/service/impl/SysRoleServiceImpl.java

@@ -394,4 +394,9 @@ public class SysRoleServiceImpl implements ISysRoleService {
         }
         return userRoleMapper.batchUserRole(list);
     }
+
+    @Override
+    public int selectUserByRoleKey(List<String> roleKeys) {
+        return userRoleMapper.selectUserByRoleKey(roleKeys);
+    }
 }

ruoyi-system/src/main/java/com/ruoyi/system/service/impl/SysUserServiceImpl.java

@@ -546,4 +546,9 @@ public class SysUserServiceImpl implements ISysUserService
     public List<SysUser> selectAllUser() {
         return userMapper.selectAllUser();
     }
+
+    @Override
+    public int selectUserByUserIds(List<Long> userIds) {
+        return userMapper.selectUserByUserIds(userIds);
+    }
 }

ruoyi-system/src/main/resources/mapper/system/SysBpmNodeScriptMapper.xml

@@ -96,4 +96,9 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
             #{id}
         </foreach>
     </update>
+
+    <select id="selectSysBpmNodeScriptByScriptKey" parameterType="String" resultMap="SysBpmNodeScriptResult">
+        <include refid="selectSysBpmNodeScriptVo"/>
+        where script_key = #{scriptKey}
+    </select>
 </mapper>

ruoyi-system/src/main/resources/mapper/system/SysUserMapper.xml

@@ -314,5 +314,12 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
 			#{tenantId}
 		</foreach>
 	</select>
+
+	<select id="selectUserByUserIds" resultType="int">
+		select count(1) from sys_user where `status` = '0' and del_flag = '0' and user_id in
+		<foreach collection="list" item="userId" open="(" close=")" separator=",">
+			#{userId}
+		</foreach>
+	</select>
 	
 </mapper> 

ruoyi-system/src/main/resources/mapper/system/SysUserRoleMapper.xml

@@ -41,4 +41,16 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
  	        #{userId}
             </foreach> 
 	</delete>
+
+	<select id="selectUserByRoleKey" resultType="int">
+		SELECT count(1) from sys_user where `status` = '0' and del_flag = '0' and user_id in
+			(
+				select user_id from sys_user_role where role_id in (
+					select role_id from sys_role where `status` = '0' and del_flag = '0' and role_key in
+					<foreach collection="list" item="roleKey" open="(" close=")" separator=",">
+						#{roleKey}
+					</foreach>
+				)
+			)
+	</select>
 </mapper> 

ruoyi-ui/src/api/bussiness/bpmExcuteProcess.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询流程执行任务表列表
+export function listProcess(query) {
+  return request({
+    url: '/system/process/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询流程执行任务表详细
+export function getProcess(id) {
+  return request({
+    url: '/system/process/' + id,
+    method: 'get'
+  })
+}
+
+// 新增流程执行任务表
+export function addProcess(data) {
+  return request({
+    url: '/system/process',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改流程执行任务表
+export function updateProcess(data) {
+  return request({
+    url: '/system/process',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除流程执行任务表
+export function delProcess(id) {
+  return request({
+    url: '/system/process/' + id,
+    method: 'delete'
+  })
+}

ruoyi-ui/src/api/relateTable/index.js

@@ -5,7 +5,9 @@ export function listGroup(query) {
   return request({
     url: '/system/group/list',
     method: 'get',
-    params: query
+    params: query,
+    baseURL: process.env.VUE_APP_BASE_API3
+
   })
 }
 
@@ -28,11 +30,12 @@ export function addGroup(data) {
 }
 
 // 修改拖拽格组
-export function updateGroup(data) {
+export function getTable(query) {
   return request({
-    url: '/system/group',
-    method: 'put',
-    data: data
+    url: '/system/group/listDetail',
+    method: 'get',
+    params: query,
+    baseURL: process.env.VUE_APP_BASE_API3
   })
 }
 
@@ -40,16 +43,27 @@ export function updateGroup(data) {
 export function delGroup(id) {
   return request({
     url: '/system/group/' + id,
-    method: 'delete'
+    method: 'delete',
+    baseURL: process.env.VUE_APP_BASE_API3
   })
 }
 
 // 查询联动表格列表
 export function dragGroupTableInfo(query) {
   return request({
-    url: '/dragform/common/dragGroupTableInfo',
+    url: '/system/group/dragGroupTableInfo',
     method: 'get',
     params: query,
     baseURL: process.env.VUE_APP_BASE_API3
   })
 }
+
+// 修改表格
+export function updataGroup(data){
+  return request({
+    url: '/system/group',
+    method: 'put',
+    data: data,
+    baseURL: process.env.VUE_APP_BASE_API3
+  })
+}

ruoyi-ui/src/assets/styles/sidebar.scss

@@ -21,7 +21,7 @@
     top: 96px;
     bottom: 0;
     left: 0;
-    z-index: 1001;
+    z-index: 1000;
     overflow: hidden;
     -webkit-box-shadow: 2px 0 6px rgba(0, 21, 41, 0.35);
     box-shadow: 2px 0 6px rgba(0, 21, 41, 0.35);

ruoyi-ui/src/components/kFormDesign/OptionsEdit.vue

@@ -0,0 +1,498 @@
+<template>
+  <div class="option-edit-wrap">
+    <el-button
+      type="info"
+      size="default"
+      icon="el-icon-edit"
+      @click="editHandler"
+    >
+    </el-button>
+    <el-dialog
+      title="设置下拉选项数据"
+      :visible.sync="isShow"
+      width="50%"
+      :before-close="cancleHandler"
+    >
+      <el-form
+        ref="formDataRef"
+        :model="formData"
+        :rules="rules"
+        label-width="140px"
+      >
+        <el-row type="flex" style="flex-wrap: wrap">
+          <el-col :span="12">
+            <el-form-item label="选项数据名" prop="dynamicName">
+              <el-input
+                v-model="formData.dynamicName"
+                placeholder="请输入动态数据名"
+                size="normal"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="表名" prop="tableName">
+              <el-select
+                class="mr10"
+                v-model="formData.tableName"
+                placeholder="请选择表名"
+                clearable
+                filterable
+                @change="
+                  (value) => {
+                    getFieldOptions(value);
+                  }
+                "
+              >
+                <el-option
+                  v-for="item in tableList"
+                  :key="item.tableName"
+                  :label="item.tableComment"
+                  :value="item.tableName"
+                >
+                  <span style="float: left">{{ item.tableComment }}</span>
+                  <span style="float: right; color: #8492a6; font-size: 13px">{{
+                    item.tableName
+                  }}</span>
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="描述字段(label)" prop="optLabelData">
+              <el-select
+                v-model="formData.optLabelData"
+                placeholder="请选择字段"
+                clearable
+                filterable
+              >
+                <el-option
+                  v-for="item in fieldList"
+                  :key="item.fieldName"
+                  :label="item.fieldDescription"
+                  :value="item.fieldName"
+                >
+                  <span style="float: left">{{ item.fieldDescription }}</span>
+                  <span style="float: right; color: #8492a6; font-size: 13px">{{
+                    item.fieldName
+                  }}</span>
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="值字段(value)" prop="optValueData">
+              <el-select
+                v-model="formData.optValueData"
+                placeholder="请选择字段"
+                clearable
+                filterable
+              >
+                <el-option
+                  v-for="item in fieldList"
+                  :key="item.fieldName"
+                  :label="item.fieldDescription"
+                  :value="item.fieldName"
+                >
+                  <span style="float: left">{{ item.fieldDescription }}</span>
+                  <span style="float: right; color: #8492a6; font-size: 13px">{{
+                    item.fieldName
+                  }}</span>
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <div class="filter-table-wrap">
+              <span class="title">添加数据过滤条件</span>
+              <el-table :data="filterTableData" style="width: 100%">
+                <el-table-column label="序号" type="index" width="50">
+                </el-table-column>
+                <!-- <el-table-column prop="tableName" label="表名" width="150">
+                  <template slot-scope="scope">
+                    <el-select
+                      v-model="scope.row.tableName"
+                      @change="
+                        (value) => {
+                          getFieldOptions(value, scope.row);
+                        }
+                      "
+                      placeholder="请选择"
+                    >
+                      <el-option
+                        v-for="item in tableList"
+                        :key="item.tableName"
+                        :label="item.tableComment"
+                        :value="item.tableName"
+                      >
+                        <span style="float: left">{{ item.tableComment }}</span>
+                        <span
+                          style="float: right; color: #8492a6; font-size: 13px"
+                          >{{ item.tableName }}</span
+                        >
+                      </el-option>
+                    </el-select>
+                  </template>
+                </el-table-column> -->
+                <el-table-column prop="fieldName" label="字段名" width="150">
+                  <template slot-scope="scope">
+                    <el-select
+                      v-model="scope.row.fieldName"
+                      placeholder="请选择"
+                    >
+                      <el-option
+                        v-for="item in fieldList"
+                        :key="item.fieldName"
+                        :label="item.fieldDescription"
+                        :value="item.fieldName"
+                      >
+                        <span style="float: left">{{
+                          item.fieldDescription
+                        }}</span>
+                        <span
+                          style="float: right; color: #8492a6; font-size: 13px"
+                          >{{ item.fieldName }}</span
+                        >
+                      </el-option>
+                    </el-select>
+                  </template>
+                </el-table-column>
+                <el-table-column prop="flagValue" label="参照值" width="100">
+                  <template slot-scope="scope">
+                    <el-button
+                      type="info"
+                      size="small"
+                      icon="el-icon-edit"
+                      @click="editFlagHandler(scope.row, scope.$index)"
+                    >
+                    </el-button>
+                  </template>
+                </el-table-column>
+                <el-table-column label="操作">
+                  <template slot-scope="scope">
+                    <el-button
+                      size="mini"
+                      type="danger"
+                      icon="el-icon-delete"
+                      @click="deleteFilterItem(scope.$index)"
+                      >删除
+                    </el-button>
+                  </template>
+                </el-table-column>
+              </el-table>
+              <el-button
+                type="primary"
+                class="inline-large-button mb10"
+                icon="el-icon-plus"
+                size="mini"
+                style="width: 100%"
+                @click="addFilterHandler"
+              >
+                添加条件
+              </el-button>
+            </div>
+          </el-col>
+        </el-row>
+      </el-form>
+
+      <template #footer>
+        <span>
+          <el-button @click="cancleHandler">取消</el-button>
+          <el-button type="primary" @click="conformHandler">确认</el-button>
+        </span>
+      </template>
+    </el-dialog>
+    <el-dialog title="编辑参照值" :visible.sync="flagShow" width="30%">
+      <el-form
+        :model="flagFormData"
+        ref="flagFormDataRef"
+        :rules="rules"
+        label-width="100px"
+        :inline="false"
+        size="normal"
+      >
+        <el-form-item label="参照类型">
+          <el-select
+            v-model="flagFormData.flagType"
+            placeholder="请选择参照类型"
+            filterable
+          >
+            <el-option
+              v-for="item in flagTypeList"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item
+          prop="flagValue"
+          v-show="flagFormData.flagType == 0"
+          label="自定义值"
+        >
+          <el-input v-model="flagFormData.flagValue"></el-input>
+        </el-form-item>
+        <el-form-item
+          prop="tableField"
+          v-show="flagFormData.flagType == 1"
+          label="关联表格字段"
+        >
+          <el-select
+            class="mr10"
+            v-model="flagFormData.tableField.tableName"
+            placeholder="请选择表名"
+            clearable
+            filterable
+            @change="
+              (value) => {
+                getFieldOptions(value, flagFormData.tableField);
+              }
+            "
+          >
+            <el-option
+              v-for="item in tableList"
+              :key="item.tableName"
+              :label="item.tableComment"
+              :value="item.tableName"
+            >
+              <span style="float: left">{{ item.tableComment }}</span>
+              <span style="float: right; color: #8492a6; font-size: 13px">{{
+                item.tableName
+              }}</span>
+            </el-option>
+          </el-select>
+          <el-select
+            v-model="flagFormData.tableField.fieldName"
+            placeholder="请选择字段"
+            clearable
+            filterable
+          >
+            <el-option
+              v-for="item in flagFormData.tableField.fieldOptions"
+              :key="item.fieldName"
+              :label="item.fieldDescription"
+              :value="item.fieldName"
+            >
+              <span style="float: left">{{ item.fieldDescription }}</span>
+              <span style="float: right; color: #8492a6; font-size: 13px">{{
+                item.fieldName
+              }}</span>
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item
+          v-show="flagFormData.flagType == 2"
+          label="固定值"
+          size="normal"
+        >
+          <el-select
+            v-model="flagFormData.flagValue"
+            placeholder="请选择固定值"
+            filterable
+          >
+            <el-option
+              v-for="item in constFlagList"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+      </el-form>
+
+      <template #footer>
+        <span>
+          <el-button @click="flagShow = false">取消</el-button>
+          <el-button type="primary" @click="flagConfirm">确认</el-button>
+        </span>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { getFormName, getListName } from "@/api/dragform/form.js";
+import { mapState } from "vuex";
+import getOptionsSqlString from "@/utils/sqlString";
+export default {
+  name: "OptionsEdit",
+  props: ["options", "selectItem"],
+  components: {},
+  data() {
+    return {
+      isShow: false,
+      flagShow: false,
+      flagEditIndex: "",
+      formData: {
+        dynamicName: "", //英文字符串
+        tableName: "",
+        optLabelData: "",
+        optValueData: "",
+      },
+      filterTableData: [
+        {
+          fieldName: "",
+          flagValue: "",
+          fieldOptions: [],
+          flagFormData: {
+            flagType: 0,
+            tableField: {
+              tableName: "",
+              fieldName: "",
+              fieldOptions: [],
+            },
+            flagValue: "",
+          },
+        },
+      ],
+
+      flagFormData: {
+        flagType: 0,
+        tableField: {
+          tableName: "",
+          fieldName: "",
+          fieldOptions: [],
+        },
+        flagValue: "",
+      },
+      flagTypeList: [
+        {
+          value: 0,
+          label: "自定义",
+        },
+        // {
+        //   value: 1,
+        //   label: "关联其他字段",
+        // },
+        {
+          value: 2,
+          label: "固定值",
+        },
+      ],
+      tableList: [],
+      fieldList: [],
+      rules: {},
+      constFlagList: [
+        {
+          value: "#{USERID}",
+          label: "当前用户相关数据",
+        },
+      ],
+    };
+  },
+  computed: {
+    ...mapState({
+      databaseName: (state) => state.user.dataSource.databaseName,
+      databaseType: (state) => state.user.dataSource.databaseType,
+    }),
+  },
+  methods: {
+    // 重置条件表单数据
+    resetFlagFormData() {
+      Object.assign(this.flagFormData, {
+        flagType: 0,
+        tableField: {
+          tableName: "",
+          fieldName: "",
+          fieldOptions: [],
+        },
+        flagValue: "",
+      });
+    },
+    // 开始编辑回调
+    async editHandler() {
+      await this.getAllTable();
+      this.isShow = true;
+    },
+    // 弹窗取消回调
+    cancleHandler() {
+      this.isShow = false;
+    },
+    // 弹窗确认回调
+    conformHandler() {
+      console.log(this.formData, this.filterTableData);
+      let sql = getOptionsSqlString(this.formData, this.filterTableData);
+      let sqlData = {};
+      sqlData[this.formData.dynamicName] = sql;
+      this.$emit("setDynamicKey", this.formData.dynamicName, sqlData);
+
+      console.log(sql);
+      this.isShow = false;
+    },
+    // 获取所有表格
+    async getAllTable() {
+      let data = {
+        databaseName: this.databaseName,
+        databaseType: this.databaseType,
+      };
+      let res = await getFormName(data);
+
+      this.tableList = res.data;
+    },
+    async getFieldOptions(value, tempData) {
+      let data = {
+        databaseName: this.databaseName,
+        databaseType: this.databaseType,
+        tableName: value,
+      };
+      try {
+        let res = await getListName(data);
+        if (tempData) {
+          tempData.fieldOptions = res;
+        } else {
+          this.fieldList = res;
+        }
+      } catch (error) {
+        this.$message.error("网络异常,请稍后再试");
+      }
+    },
+    // 删除一条筛选条件
+    deleteFilterItem(index) {
+      this.filterTableData.splice(index, 1);
+    },
+    // 新增一条筛选条件
+    addFilterHandler() {
+      this.filterTableData.push({
+        // tableName: "",
+        fieldName: "",
+        flagValue: "",
+        fieldOptions: [],
+        flagFormData: {
+          flagType: 0,
+          tableField: {
+            tableName: "",
+            fieldName: "",
+            fieldOptions: [],
+          },
+          flagValue: "",
+        },
+      });
+    },
+    // 编辑参照回调
+    editFlagHandler(row, index) {
+      this.flagEditIndex = index;
+      this.flagFormData = JSON.parse(JSON.stringify(row.flagFormData));
+      this.flagShow = true;
+    },
+    // 确认参照回调
+    flagConfirm() {
+      this.filterTableData[this.flagEditIndex].flagFormData = JSON.parse(
+        JSON.stringify(this.flagFormData)
+      );
+      this.flagShow = false;
+    },
+  },
+  async mounted() {
+    console.log(this.options, this.selectItem);
+  },
+};
+</script>
+
+<style scoped lang="scss">
+.filter-table-wrap {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+</style>

ruoyi-ui/src/components/updateModule/k-form-design/packages/components/KFormDesign/module/formItemProperties.vue

@@ -146,6 +146,8 @@
             v-model="options.dynamicKey"
             placeholder="动态数据变量名"
           />
+          <OptionsEdit v-show="options.dynamic" @setDynamicKey="setDynamicKey" :options="options" :selectItem="selectItem"></OptionsEdit>
+          
 
           <KChangeOption v-show="!options.dynamic" v-model="options.options" />
         </a-form-item>
@@ -570,7 +572,8 @@ import KChangeOption from "../../KChangeOption/index.vue";
 import kCheckbox from "../../KCheckbox/index.vue";
 import { pluginManager } from "../../../utils/index";
 import { getListName, getFormName } from "@/api/dragform/form";
-import {getUncommonTable} from '@/utils/other'
+import { getUncommonTable } from '@/utils/other';
+import OptionsEdit from '@/components/kFormDesign/OptionsEdit.vue'
 const Input = pluginManager.getComponent("input").component;
 const InputNumber = pluginManager.getComponent("number").component;
 const Rate = pluginManager.getComponent("rate").component;
@@ -598,7 +601,8 @@ export default {
     RadioItem,
     RadioButton,
     Textarea,
-    Select
+    Select,
+    OptionsEdit
   },
   data() {
     return {
@@ -703,6 +707,11 @@ export default {
     }
   },
   methods: {
+    setDynamicKey(key,sqlData) {
+      this.options.dynamicKey = key;
+      this.options.sqlData=sqlData
+      console.log(this.options.dynamicKey,key,111);
+    },
     /**
      * 判断是否已定义
      * @param {*} value

ruoyi-ui/src/components/updateModule/k-form-design/packages/components/KFormItem/index.vue

@@ -219,6 +219,7 @@ export default {
       if (e && e.target) {
         value = e.target.value;
       }
+      console.log(this.record);
       // 传递change事件
       this.$emit("change", value, this.record.model);
     },

ruoyi-ui/src/utils/sqlString.js

@@ -0,0 +1,45 @@
+
+export default function getOptionsSqlString(baseData, conditions) {
+  let res = {}
+  let { dynamicName, tableName, optLabelData, optValueData } = baseData
+  // res[baseData.dynamicName] = ''
+  let sqlString = 'SELECT '   //起始
+  let labelValueStr = tableName + '.' + optLabelData + ' AS `label`,' + tableName + '.' + optValueData + ' AS `value`,' + tableName + '.* FROM '      //查询字段
+  let allTable = []
+  allTable.push(tableName);
+  conditions.forEach(item => {
+    if (item.flagFormData.flagType == 1) {
+      allTable.push(item.flagFormData.tableField.tableName)
+    }
+  })
+  let set = new Set(allTable);
+  allTable = [...set];
+  console.log(allTable);
+  let tableNickNameStr = ''    //表格别名
+  allTable.forEach(item => {
+    tableNickNameStr += `${item} AS ${item} `
+  })
+  tableNickNameStr += 'WHERE '
+  // 拼接条件
+  let conditionArr = [];
+  conditions.forEach(condition => {
+    switch (condition.flagFormData.flagType) {
+      case 0://自定义
+        conditionArr.push(`${tableName}.${condition.fieldName} = ${condition.flagFormData.flagValue}`)
+        break;
+      case 1://关联其他字段
+        conditionArr.push(`${tableName}.${condition.fieldName} = #{${condition.flagFormData.tableField.tableName}.${condition.flagFormData.tableField.fieldName}}`)
+        break;
+      case 2://固定值
+        conditionArr.push(`${tableName}.${condition.fieldName} = ${condition.flagFormData.flagValue}`)
+        break;
+      default:
+        break;
+    }
+  })
+  let conditionStr = conditionArr.join(' AND ') //条件sql
+
+  return sqlString + labelValueStr + tableNickNameStr + conditionStr
+
+
+}

ruoyi-ui/src/views/dialogTemplate/components/index.vue

@@ -0,0 +1,290 @@
+<template>
+  <div class="bigBox">
+   <div class="info">
+    <p class="tt">基础信息</p>
+    <div v-for="item in infoData" :key="item.title">
+      <span class="titlestyle">{{ item.title }}</span>
+      <span class="infostyle">{{ item.info }}</span>
+    </div>
+   </div>
+   <div class="tableBox">
+    <div class="top">
+      <div class="left">
+        <p>工序状态:</p>
+        <i>初始</i>
+      </div>
+      <div class="right">
+        <p>是否外协</p>
+        <el-checkbox v-model="checked"></el-checkbox>
+      </div>
+    </div>
+    <!-- 按钮组 -->
+    <el-button-group>
+      <el-button icon="el-icon-caret-right" class="custom">开始</el-button>
+      <el-button icon="el-icon-switch-button" class="custom">暂停</el-button>
+      <el-button icon="el-icon-finished" class="custom">完成</el-button>
+      <el-button icon="el-icon-refresh" class="custom">重置</el-button>
+    </el-button-group>
+    
+    <el-table
+      border
+      :data="tableData"
+      style="width: 100%">
+      <el-table-column
+        prop="date"
+        label="日期"
+        width="180">
+      </el-table-column>
+      <el-table-column
+        prop="name"
+        label="姓名"
+        width="180">
+      </el-table-column>
+      <el-table-column
+        prop="address"
+        label="地址">
+      </el-table-column>
+    </el-table>
+
+    <el-form ref="tableform" :model="tableDataForm">
+      <div class="titleitem">人员及工时分配</div>
+      <el-table
+      class="addTable"
+      border
+      :data="editData"
+      style="width: 100%">
+      <el-table-column prop="date" label="日期" width="180">
+        <template slot-scope="scope">
+          <el-input v-model="scope.row.date"></el-input>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="name"
+        label="姓名"
+        width="180">
+        <template slot-scope="scope">
+          <el-input v-model="scope.row.name"></el-input>
+        </template>
+      </el-table-column>
+        <el-table-column
+          label="操作"
+          align="center"
+          class-name="small-padding fixed-width"
+        >
+        <template slot-scope="scope">
+          <el-dropdown>
+            <el-button type="warning" plain size="small">
+              处理<i class="el-icon-arrow-down el-icon--right"></i>
+            </el-button>
+            <el-dropdown-menu slot="dropdown">
+              <el-dropdown-item>
+                <el-button
+                  size="mini"
+                  type="text"
+                  icon="el-icon-edit"
+                  >修改
+                </el-button>
+              </el-dropdown-item>
+              <el-dropdown-item>
+                <el-button
+                  size="mini"
+                  type="text"
+                  icon="el-icon-delete"
+                  >删除
+                </el-button>
+              </el-dropdown-item>
+            </el-dropdown-menu>
+          </el-dropdown>
+        </template>
+        </el-table-column>
+      </el-table>
+
+      <el-form-item>
+        <el-button class="addBtn" icon="el-icon-plus"
+        @click="addBtnHandler"
+        >新增</el-button>
+        <el-button 
+        class="saveBtn"
+        icon="el-icon-document-checked"
+        @click="saveBtnHandler"
+        >保存</el-button>
+      </el-form-item>
+    </el-form>
+   
+    <div>
+      
+    </div>
+   </div>
+  </div>
+</template>
+
+<script>
+
+export default {
+  data () {
+   return {
+    // 基础信息行数据
+    infoData: [
+      {
+        title: '任务',
+        info: '154ccxz5'
+      },
+      {
+        title: '固号',
+        info: '1545'
+      },
+      {
+        title: '名称',
+        info: '1545'
+      },
+      {
+        title: '数量',
+        info: '1545'
+      },
+      {
+        title: '工艺',
+        info: '指控'
+      },
+    ],
+    // 是否外协
+    checked: false,
+    tableData: [{
+      date: '2016-05-02',
+      name: '王小虎',
+      address: '上海市普陀区金沙江路 1518 弄'
+    }, {
+      date: '2016-05-04',
+      name: '王小虎',
+      address: '上海市普陀区金沙江路 1517 弄'
+    }, {
+      date: '2016-05-01',
+      name: '王小虎',
+      address: '上海市普陀区金沙江路 1519 弄'
+    }, {
+      date: '2016-05-03',
+      name: '王小虎',
+      address: '上海市普陀区金沙江路 1516 弄'
+    }],
+    // 动态增加表格数据
+    editData: [],
+    tableDataForm: {}
+   }
+ },
+  methods: {
+    // 新增
+    addBtnHandler(){
+      if (this.editData == undefined) {
+        this.editData = new Array();
+      }
+
+      let obj = {
+        date: '',
+        name: ''
+      }
+
+      this.editData.push(obj);
+    },
+    // 保存
+    saveBtnHandler(){
+      this.editData.forEach(item => {
+        this.tableData.push(item)
+      })
+      this.editData = []
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+  .bigBox{
+    width: 800px;
+    margin: auto;
+    display: flex;
+  
+    .info{
+      margin-right: 60px;
+      .tt{
+      font-size: 18px;
+      font-weight: 700;
+    }
+      span{
+        display: inline-block;
+      }
+      .titlestyle{
+        background-color: #34bfa3;
+        width: 50px;
+        margin-bottom: 20px;
+        margin-right: 5px;
+        text-align: center;
+        color: white;
+        border-radius: 20px;
+      }
+      .infostyle{
+        background-color: #ebedf2;
+        color: #e84e95;
+      }
+    }
+
+    .tableBox{
+      width: 500px;
+      .addTable{
+        margin: 0px 0px 20px 0px
+      }
+      .titleitem{
+        text-align: center;
+        font-size: 20px;
+        margin-top: 20px;
+      }
+      .addBtn{
+        background-color: #0275d8;
+        color: white;
+      }
+      .saveBtn{
+        background-color: #34bfa3;
+        color: white;
+      }
+      .top{
+        padding: 20px;
+        box-sizing: border-box;
+        background-color: #53b0f8;
+        display: flex;
+        justify-content: space-around;
+        color: white;
+        flex: 1;
+        /* width: 90%; */
+      
+      }
+      .el-button-group{
+        width: 100%;
+        margin: 10px;
+        background-color: white;
+        
+        .el-button:first-child{
+          border-radius: 20px 0px 0px 20px;
+          color: blue;
+          border: 1px solid blue;
+        }
+        .el-button:nth-child(2){
+          color: palevioletred;
+          border: 1px solid palevioletred;
+        }
+        .el-button:nth-child(3){
+          color:green;
+          border: 1px solid green;
+        }
+        .el-button:last-child{
+          border-radius: 0px 20px 20px 0px;
+          color:burlywood;
+          border: 1px solid burlywood;
+        }
+        .custom{
+          width: 120px;
+
+        }
+      }
+      
+    }
+
+    
+  }
+</style>

ruoyi-ui/src/views/dialogTemplate/indexTable.vue

@@ -0,0 +1,809 @@
+<template>
+  <div class="app-container">
+    <el-form
+      :model="queryParams"
+      ref="queryForm"
+      size="small"
+      :inline="true"
+      v-show="showSearch"
+      label-width="68px"
+    >
+      <el-form-item label="表格组名" prop="dtName">
+        <el-input
+          v-model="queryParams.dtName"
+          placeholder="请输入表格组名"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button
+          type="primary"
+          icon="el-icon-search"
+          size="mini"
+          @click="handleQuery"
+          >搜索</el-button
+        >
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
+          >重置</el-button
+        >
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          >新增</el-button
+        >
+      </el-col>
+
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click=""
+          >删除</el-button
+        >
+      </el-col>
+    </el-row>
+
+    <el-table
+      v-loading="loading"
+      :data="tableData"
+      ref="tableRef"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="表格主键" align="center" prop="id" />
+      <el-table-column label="表格名称" align="center" prop="groupName" />
+      <el-table-column label="描述" align="center" prop="groupDescription" />
+
+      <el-table-column
+        label="操作"
+        align="center"
+        class-name="small-padding fixed-width"
+      >
+        <template slot-scope="scope">
+          <el-dropdown>
+            <el-button type="warning" plain size="small">
+              处理<i class="el-icon-arrow-down el-icon--right"></i>
+            </el-button>
+            <el-dropdown-menu slot="dropdown">
+              <el-dropdown-item>
+                <el-button
+                  size="mini"
+                  type="text"
+                  icon="el-icon-edit"
+                  @click=""
+                  >修改
+                </el-button>
+              </el-dropdown-item>
+              <el-dropdown-item>
+                <el-button
+                  size="mini"
+                  type="text"
+                  icon="el-icon-delete"
+                  @click=""
+                  >删除
+                </el-button>
+              </el-dropdown-item>
+            </el-dropdown-menu>
+          </el-dropdown>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <el-dialog
+      title="新增表格信息"
+      :visible.sync="dialogVisible"
+      width="30%"
+    >
+    <div class="formWrap">
+        <el-form
+          :rules="tableItemRules"
+          ref="tableItemForm"
+          style="max-width: 750px; width: 1000px"
+          :model="tableItemForm"
+          label-width="100px"
+        >
+          <el-form-item label="表格标题:" prop="title">
+            <el-input
+            @input="change1($evevt)"
+              v-model="tableItemForm.title"
+              style="max-width: 221px"
+              @change="iptChange()"
+            ></el-input>
+          </el-form-item>
+          <el-form-item label="表格名称:" prop="tableName">
+            <el-select
+              v-model="tableItemForm.tableName"
+              @change="getList()"
+              placeholder="请选择表格名称"
+            >
+              <el-option
+              v-for="item in tableList"
+              :key="item.tableName"
+              :label="item.tableComment"
+              :value="item.tableName"
+              >
+              <span style="float: left">{{ item.tableComment }}</span>
+              <span style="float: right; color: #8492a6; font-size: 13px">{{
+                item.tableName
+              }}</span>
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="表格主键:" prop="selectFields">
+            <el-select
+              v-model="tableItemForm.selectFields"
+              placeholder="请选择表格主键"
+            >
+            <el-option
+              v-for="item in tableFieldList"
+              :key="item.fieldName"
+              :label="item.fieldDescription"
+              :value="item.fieldName"
+            >
+              <span style="float: left">{{ item.fieldDescription }}</span>
+              <span style="float: right; color: #8492a6; font-size: 13px">{{
+                item.fieldName
+              }}</span>
+            </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="时间格式" prop="timeFormate">
+            <el-select
+              v-model="tableItemForm.timeFormate"
+              placeholder="请选择时间格式"
+            >
+              <el-option
+                v-for="val in dict.type.sys_time_format"
+                :key="val.value"
+                :label="val.label"
+                :value="val.value"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="排序依赖字段">
+            <el-select
+              v-model="tableItemForm.orderByColumn"
+              placeholder="请选择排序依赖"
+            >
+              <el-option
+                v-for="val in orderByFieldList"
+                :key="val.fieldName"
+                :label="val.fieldDescription"
+                :value="val.tableName + '.' + val.fieldName"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="排序方式" v-show="tableItemForm.orderByColumn">
+            <el-radio v-model="tableItemForm.isAsc" :label="false"
+              >升序</el-radio
+            >
+            <el-radio v-model="tableItemForm.isAsc" :label="true"
+              >降序</el-radio
+            >
+          </el-form-item>
+          <el-form-item label="菜单路由" prop="routePath">
+          <div class="treeselect">
+            <treeselect
+              :append-to-body="true"
+              v-model="tableItemForm.routePath"
+              :options="menus"
+              :normalizer="normalizer"
+              :show-count="true"
+              placeholder="请选择父级路由"
+            />
+          </div>
+        </el-form-item>
+          <el-form-item label="展示字段:" prop="FieldList">
+            <el-table
+            :data="tableFieldList"
+            border
+            ref="dragTable"
+            row-key="id"
+            max-height="500px"
+            class="tablefiled"
+            >
+            <el-table-column
+              type="index"
+              label="序号"
+              width="50"
+              class-name="allowDrag"
+            >
+            </el-table-column>
+            <el-table-column prop="fieldName" label="数据字段"></el-table-column>
+            <el-table-column prop="fieldDescription" label="字段描述">
+              <template slot-scope="scope">
+                <input
+                  :class="{
+                    isNullDesc:
+                      scope.row.fieldDescription == '' &&
+                      scope.row.isShow &&
+                      isInputInvalid
+                        ? true
+                        : false,
+                    ipt: true,
+                  }"
+                  v-model="scope.row.fieldDescription"
+                />
+              </template>
+            </el-table-column>
+            <el-table-column width="95px" prop="relationTable" label="关联表">
+              <template slot-scope="scope">
+                <el-select
+                  v-model="scope.row.relationTable"
+                  :disabled="
+                    !scope.row.relationTableList ||
+                    !scope.row.relationTableList.length
+                  "
+                  placeholder="请选择关联的表"
+                  clearable
+                  filterable
+                  @change="ralationTableChange(scope.row)"
+                >
+                  <el-option
+                    v-for="(item, index) in scope.row.relationTableList"
+                    :key="index"
+                    :label="item.tableComment"
+                    :value="item.tableName"
+                  >
+                    <span style="float: left">{{ item.tableComment }}</span>
+                    <span
+                      style="float: right; color: #8492a6; font-size: 13px"
+                      >{{ item.tableName }}</span
+                    >
+                  </el-option>
+                </el-select>
+              </template>
+            </el-table-column>
+            <el-table-column width="95px" prop="relationFieldName" label="关联条件字段">
+              <template slot-scope="scope">
+                <el-select
+                  v-model="scope.row.relationFieldName"
+                  @change="relationFieldChange(scope.row)"
+                  :disabled="!scope.row.disableRelaFieldName"
+                  placeholder="关联字段"
+                  filterable
+                >
+                  <el-option
+                    v-for="(item, index) in scope.row.relaFieldNameList"
+                    :key="index"
+                    :label="item.fieldDescription"
+                    :value="item.fieldName"
+                  >
+                  </el-option>
+                </el-select>
+              </template>
+            </el-table-column>
+            <el-table-column width="95px" prop="relationType" label="关联方式">
+              <template slot-scope="scope">
+                <el-select
+                  v-model="scope.row.relationType"
+                  placeholder="请选择关联方式"
+                  :disabled="!scope.row.disableRelaType"
+                  @change="relationTypeChangeHandler(scope.row)"
+                  filterable
+                >
+                  <el-option
+                    v-for="(item, index) in relaTypeList"
+                    :key="index"
+                    :label="item.label"
+                    :value="item.value"
+                  >
+                  </el-option>
+                </el-select>
+              </template>
+            </el-table-column>
+            <el-table-column prop="isShow" label="是否显示">
+              <template slot-scope="scope">
+                <el-switch v-model="scope.row.isShow"> </el-switch>
+              </template>
+            </el-table-column>
+            <el-table-column prop="isSearch" label="是否包含查询">
+              <template slot-scope="scope">
+                <el-switch v-model="scope.row.isSearch" @change="isSearchChange($event, scope.row,  scope.$index)"> </el-switch>
+              </template>
+            </el-table-column>
+          </el-table>
+          </el-form-item>
+          <el-form-item class="btn">
+            <el-button @click="dialogVisible = false">取 消</el-button>
+            <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
+          </el-form-item>
+        </el-form>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { listTable, removeTableList } from "@/api/dragform/tableList";
+import { getFormName, getListName, dragTablePreview, } from "@/api/dragform/form.js";
+import { delMenu } from "@/api/system/menu";
+import { getMenuList, addMenu, getRouters} from "@/api/menu.js";
+import { getParticMenu, updateMenu } from "@/api/system/menu.js";
+import { addGroup, listGroup, getTable, delGroup, updataGroup } from '@/api/relateTable/index.js'
+import { addDragTable } from "@/api/tablelist/commonTable.js";
+import { mapGetters, mapState } from "vuex";
+import DictData from "@/components/DictData";
+import { FastBackwardFill, async } from "@/components/updateModule/k-form-design/lib/k-form-design.common";
+import { v4 as uuidv4 } from "uuid";
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+import json from "highlight.js/lib/languages/json";
+import { getTableInfo, editTable } from "@/api/system/table.js";
+export default {
+  name: "indexTable",
+  components: { Treeselect },
+  dicts: ["sys_time_format", "table_statistic_type"],
+  data () {
+   return {
+    // 字段描述规则
+    isInputInvalid: false,
+    // 表格数据
+    tableData:[],
+    queryParams: {},
+    showSearch: true,
+    // 新增弹框
+    dialogVisible: false,
+    // 选中数组(包含所有数据)
+    ids: [],
+    selection: [],
+    Keys: [],
+    menuIds: [],
+    menus: [], //路由列表数据
+    // 非单个禁用
+    single: true,
+    // 非多个禁用
+    multiple: true,
+    tableList: [],
+     // 遮罩层
+     loading: false,
+
+     tableItemRules: [],
+    // 新增弹框数据
+     tableItemForm: {
+        tId: "",
+        rowId: "",
+        title: "",
+        tableName: "",
+        selectFields: "",
+        isAsc: false,
+        timeFormate: "",
+        orderByColumn: "",
+        routePath: undefined,
+      },
+     tableFieldList: [],
+        // 关联方式
+      relaTypeList: [
+      {
+        label: "等值连接",
+        value: "INNER JOIN",
+      },
+      {
+        label: "左连接",
+        value: "LEFT JOIN",
+      },
+      {
+        label: "右连接",
+        value: "RIGHT JOIN",
+      },
+    ],
+   }
+ },
+ computed: {
+    selectRelate(){
+      if(this.tableItemForm.tableName =='') return
+      return this.tableList.filter(item => item.tableName !== this.tableItemForm.tableName)
+    },
+    dataArr() {
+      return this.tableFieldList.filter((item) => item.isShow);
+    },
+    ...mapGetters(["addRoutes"]),
+    ...mapState({
+      databaseName: (state) => state.user.dataSource.databaseName,
+      databaseType: (state) => state.user.dataSource.databaseType,
+      username: (state) => state.user.dataSource.username,
+      tenantId: (state) => state.user.tenant.tenantId,
+    }),
+    orderByFieldList() {
+      return this.tableFieldList;
+    },
+  },
+  watch: {
+    'tableItemForm.tableName': function (val) {
+      if (val) {
+        this.relationTableList = this.tableList
+          .filter((item) => item.tableName != val)
+          .map((item) => {
+            return {
+              tableName: item.tableName,
+              tableComment: item.tableComment,
+            };
+          });
+      } else {
+        this.relationTableList = [];
+      }
+    },
+    'groupForm.routePath'(nval, oval) {
+      let targetMenu = this.getTargetMenu(this.menus);
+      this.menuOrderNum = targetMenu.children ? targetMenu.children.length : 0;
+    },
+  },
+  methods: {
+    // 搜索
+    handleQuery(){},
+    // 重置
+    resetQuery(){},
+    // 新增按钮
+    async handleAdd(){
+      this.dialogVisible = true
+      this.getAllTable()
+      await this.getMenuList()
+    },
+    // 获取所有表格
+    async getAllTable() {
+      let data = {
+        databaseName: this.databaseName,
+        databaseType: this.databaseType,
+      };
+      let res = await getFormName(data);
+
+      const baseTable = await this.getDicts("base_table");
+
+      this.tableList = res.data.filter((item) => {
+        return !baseTable.data.some(
+          (value) =>
+            value.dictValue.toLowerCase() == item.tableName.toLowerCase()
+        );
+      });
+    },
+    /** 查询列表 */
+    getList(queryParams) {
+      if (!this.tableItemForm.tableName) return;
+      let data = {
+        databaseName: this.databaseName,
+        databaseType: this.databaseType,
+        tableName: this.tableItemForm.tableName,
+      };
+      
+      // 获取当前表单结构信息
+      getListName(data).then((res) => {
+        this.tableFieldList = res.map((item, index) => {
+          return {
+            id: this.tableItemForm.tableName + "_" + item.fieldName,
+            fieldName: item.fieldName,
+            fieldDescription: item.fieldDescription,
+            relationTable: "",
+            relationFieldName: "",
+            relaFieldNameList: [],
+            disableRelaFieldName: false,
+            relationType: "",
+            relationShowField: [],
+            relationShowFiledList: [],
+            disableRelaType: false,
+            isShow: true,
+            isSearch: false,
+            isExport: true,
+            relationTableList: this.relationTableList,
+            tableName: this.tableItemForm.tableName,
+            relationFieldList: [],
+          };
+        });
+      });
+
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map((item) => item.id);
+      this.Keys = selection.map((item) => item.sqlKey);
+      this.menuIds = selection.map((item) => item.menuId);
+      this.selection = selection;
+      this.single = selection.length !== 1;
+      this.multiple = !selection.length;
+    },
+
+    // 递归拼接查询语句
+    getSQLString(tableFieldList, fieldArr, tableArr, sqlType = "mysql") {
+      let prefix = "{DBNAME}.";
+      let asOrSpace = sqlType == "oracle" ? " " : " AS ";
+      for (let i = 0; i < tableFieldList.length; i++) {
+        let temp = tableFieldList[i];
+        if (temp.isShow) {
+          let tempArr = prefix + temp.tableName + "." + temp.fieldName;
+          if (temp.isChildren) {
+            tempArr += asOrSpace + temp.tableName + "_" + temp.fieldName;
+          }
+          fieldArr.push(tempArr);
+        }
+        if (temp.relationTable && temp.relationFieldName && temp.relationType) {
+          let isNeedUsername = sqlType == "oracle" ? this.username + "." : "";
+          tableArr.push(
+            temp.relationType +
+              " " +
+              isNeedUsername +
+              prefix +
+              temp.relationTable +
+              asOrSpace +
+              temp.relationTable +
+              " ON " +
+              prefix +
+              temp.relationTable +
+              "." +
+              temp.relationFieldName +
+              " = " +
+              prefix +
+              temp.tableName +
+              "." +
+              temp.fieldName
+          );
+        }
+      }
+      // 如果主键不包含显示,则添加至sql语句中
+      let isNotInclude = this.tableFieldList.find(
+        (val) => !val.isShow && val.fieldName == this.tableItemForm.selectFields
+      );
+      if (isNotInclude) {
+        fieldArr.push(
+          prefix + isNotInclude.tableName + "." + isNotInclude.fieldName
+        );
+      }
+    },
+    // 拼接查询sql语句
+    getSQLStr() {
+      let prefix = "{DBNAME}.";
+      let sqlType = this.databaseType; //数据库类型
+      // let sqlType = "oracle";
+      let sql = "";
+      // mysql
+      sql += "SELECT ";
+      let fieldNameArr = [],
+        relaTypeArr = [];
+      this.getSQLString(
+        this.tableFieldList,
+        fieldNameArr,
+        relaTypeArr,
+        sqlType
+      );
+      let isNeedUsername = sqlType == "oracle" ? this.username + "." : "";
+      let asOrSpace = sqlType == "oracle" ? " " : " AS ";
+      sql +=
+        fieldNameArr.join(",") +
+        " FROM " +
+        isNeedUsername +
+        prefix +
+        this.tableItemForm.tableName +
+        asOrSpace +
+        this.tableItemForm.tableName;
+      if (relaTypeArr.length) {
+        sql += " " + relaTypeArr.join(" ");
+      }
+      return sql;
+    },
+    // 关联表变化回调
+    async ralationTableChange(row) {
+      this.tableFieldList = this.tableFieldList.filter((item) => {
+        return !row.relationFieldList.some((val) => {
+          return val.id == item.id;
+        });
+      });
+      row.relationFieldName = "";
+      row.relationType = "";
+      row.disableRelaFieldName = false;
+      row.disableRelaType = false;
+      row.relationFieldList = [];
+      if (!row.relationTable) {
+        return;
+      }
+      // 获取关联表的字段
+      let data = {
+        databaseName: this.databaseName,
+        databaseType: this.databaseType,
+        tableName: row.relationTable,
+      };
+      let res = await getListName(data);
+      // 关联字段下拉列表数据
+      row.relaFieldNameList = res.map((item) => {
+        return {
+          fieldName: item.fieldName,
+          fieldDescription: item.fieldDescription,
+        };
+      });
+      let relationTableList = row.relationTableList.filter(
+        (item) => row.relationTable != item.tableName
+      );
+      row.relationFieldList = row.relaFieldNameList.map((item, index) => {
+        return {
+          id: row.relationTable + "_" + item.fieldName,
+          fieldName: item.fieldName,
+          fieldDescription: item.fieldDescription,
+          relationTable: "",
+          relationFieldName: "",
+          relaFieldNameList: [],
+          disableRelaFieldName: false,
+          relationType: "",
+          relationShowField: [],
+          relationShowFiledList: [],
+          disableRelaType: false,
+          isShow: true,
+          isSearch: false,
+          isExport: true,
+          relationTableList,
+          tableName: row.relationTable,
+          relationFieldList: [],
+          isChildren: true,
+        };
+      });
+      row.disableRelaFieldName = true;
+    },
+    // 关联类型变化回调
+    relationTypeChangeHandler(row) {
+      let tempRelationFieldList = row.relationFieldList.filter((item) => {
+        return !this.tableFieldList.find((val) => val.id === item.id);
+      });
+      this.tableFieldList = [...this.tableFieldList, ...tempRelationFieldList];
+    },
+    // 关联字段回调
+    relationFieldChange(row) {
+      if (!row.relationFieldName) {
+        row.relationType = "";
+        row.disableRelaType = false;
+        row.relaFieldNameList = [];
+        return;
+      }
+      row.disableRelaType = true;
+    },
+    // 递归获取列表信息
+    getCol(
+      tableFieldList,
+      columns,
+      searchFieldList = [],
+      tableExportField = {}
+    ) {
+      if (!tableFieldList.length) return;
+      for (let i = 0; i < tableFieldList.length; i++) {
+        let temp = tableFieldList[i];
+        let tempFieldName = "",
+          exportFieldName = "";
+        if (temp.isChildren) {
+          tempFieldName = temp.tableName + "_" + temp.fieldName;
+          exportFieldName = temp.tableName + "@" + temp.fieldName;
+        } else {
+          tempFieldName = temp.fieldName;
+          exportFieldName = temp.fieldName;
+        }
+        if (temp.isShow) {
+          let tempObj = {};
+          tempObj[tempFieldName] = temp.fieldDescription;
+          columns.push(tempObj);
+        }
+        if (temp.isSearch) {
+          searchFieldList.push(temp.tableName + "." + temp.fieldName);
+        }
+
+        if (temp.isExport) {
+          tableExportField[exportFieldName] = temp.fieldDescription;
+        }
+      }
+    },
+    // 更新路由
+    reloadRouter() {
+      this.$store.dispatch("GenerateRoutes").then((accessRoutes) => {
+        this.$router.addRoutes(accessRoutes); // 动态添加可访问路由表
+      });
+    },
+    // 获取路由表单数据
+    async getMenuList() {
+      let res = await listGroup();
+      this.menus = this.handleTree(res.data, "menuId");
+    },
+    // 获取目标menu
+    getTargetMenu(menus) {
+      for (let i = 0; i < menus.length; i++) {
+        if (menus[i].menuId == this.groupForm.routePath) {
+          return menus[i];
+        } else if (menus.children?.length) {
+          return this.getTargetMenu(menus.children);
+        }
+      }
+      return false;
+    },
+    // 获取父级menuId
+    getParentMenuId(menuId, menus) {
+      let res;
+      for (let i = 0; i < menus.length; i++) {
+        let item = menus[i];
+        if (item.menuId == menuId) {
+          res = item.parentId;
+          break;
+        } else if (item.children?.length) {
+          if (
+            this.getParentMenuId(
+              menuId,
+              JSON.parse(JSON.stringify(item.children))
+            )
+          ) {
+            res = this.getParentMenuId(
+              menuId,
+              JSON.parse(JSON.stringify(item.children))
+            );
+          }
+        }
+      }
+      return res;
+    },
+    // 获取路由表单数据
+    async getMenuList() {
+      let res = await getMenuList();
+      this.menus = this.handleTree(res.data, "menuId");
+    },
+    
+    /** 转换菜单数据结构 */
+    normalizer(node) {
+      if (node.children && !node.children.length) {
+        delete node.children;
+      }
+      return {
+        id: node.menuId,
+        label: node.menuName,
+        children: node.children,
+      };
+    },
+    // 更新路由
+    reloadRouter() {
+      this.$store.dispatch("GenerateRoutes").then((accessRoutes) => {
+        this.$router.addRoutes(accessRoutes); // 动态添加可访问路由表
+      });
+    },
+  }
+}
+</script>
+
+<style scoped lang="scss">
+::v-deep .el-dialog:not(.is-fullscreen){
+  width: 900px !important;
+}
+.treeselect{  
+   .vue-treeselect{
+    width: 217px !important;
+  }
+}
+
+.ipt {
+  height: 36px;
+  line-height: 36px;
+  font-size: 14px;
+  width: 100%;
+  outline: none;
+  text-align: center;
+  background-color: #fff;
+  border: 1px solid #dcdfe6;
+  color: #606266;
+  display: inline-block;
+  border-radius: 4px;
+}
+.isNullDesc {
+  border-color: #ff4949 !important;
+}
+
+.ipt:focus {
+  border-color: #1890ff;
+}
+</style>
+
+<style lang="scss">
+ 
+.vue-treeselect{
+  z-index: 9999 !important;
+}
+</style>

ruoyi-ui/src/views/relateTable/components/RelateTableCard.vue

@@ -1,18 +1,17 @@
 <template>
   <el-card class="box-card" :body-style="{ padding: '0px' }">
     <div slot="header" class="clearfix">
-      <el-button icon="el-icon-plus" type="primary" @click="handleAdd">新增</el-button>
       <el-tag class="tag_NO">{{ Number(index) + 1 }}</el-tag>
-      <span class="title">{{ cardData.title }}</span>
+      <!-- <span class="title">{{ cardData.title }}</span> -->
+      <el-button icon="el-icon-plus" type="primary" @click="handleAdd">新增数据</el-button>
     </div>
     <!-- body -->
     <el-table
-      v-loading="loading"
       ref="singleTable"
       :data="tableList"
       height="300"
       highlight-current-row
-      @current-change="handleCurrentChange"
+      @row-click="(row,e,column) => handleCurrentChange(row,e,column,cardData)"
       style="width: 100%"
     >
       <el-table-column
@@ -20,43 +19,52 @@
         align="center"
         class-name="small-padding fixed-width"
       >
-        <template slot-scope="scope">
-          <el-dropdown>
-            <el-button type="warning" plain size="small">
-              处理<i class="el-icon-arrow-down el-icon--right"></i>
-            </el-button>
-            <el-dropdown-menu slot="dropdown">
-              <el-dropdown-item>
-                <el-button
-                  size="mini"
-                  type="text"
-                  icon="el-icon-edit"
-                  @click="handleUpdate(scope.row)"
-                >修改
-                </el-button>
-              </el-dropdown-item>
-              <el-dropdown-item>
-                <el-button
-                  size="mini"
-                  type="text"
-                  icon="el-icon-delete"
-                  @click="handleDelete(scope.row)"
-                >删除
-                </el-button>
-              </el-dropdown-item>
-            </el-dropdown-menu>
-          </el-dropdown>
-        </template>
+          <template slot-scope="scope">
+            <el-dropdown>
+              <el-button type="warning" plain size="small">
+                处理<i class="el-icon-arrow-down el-icon--right"></i>
+              </el-button>
+              <el-dropdown-menu slot="dropdown">
+                <el-dropdown-item>
+                  <el-button
+                    size="mini"
+                    type="text"
+                    icon="el-icon-edit"
+                    @click="handleUpdate(scope.row)"
+
+                  >修改
+                  </el-button>
+                </el-dropdown-item>
+                <el-dropdown-item>
+                  <el-button
+                    size="mini"
+                    type="text"
+                    icon="el-icon-delete"
+                    @click="handleDelete(scope.row)"
+                  >删除
+                  </el-button>
+                </el-dropdown-item>
+              </el-dropdown-menu>
+            </el-dropdown>
+          </template>
       </el-table-column>
-      <el-table-column 
-        v-for="item in columns"
+      <el-table-column
+        v-for="(item, index) in columns"
+        :prop="item.key"
         :key="item.key"
         :label="item.value"
-        align="center"
-        :prop="item.key">
+      >
       </el-table-column>
+   
     </el-table>
-        <!-- 添加或修改销售出库单：- 过磅记录生成数据对话框 -->
+
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="gettableListHandler(tableKeyWatcher)"
+    />
     <el-dialog :title="title" :visible.sync="open" append-to-body>
       <k-form-build
         class="formBuild"
@@ -84,30 +92,20 @@ import {
   batchEdit,
   getStatisticList
 } from "@/api/tablelist/commonTable";
-import {camelCase} from "@/utils";
-import {dragGroupTableInfo} from "@/api/relateTable/index"
-import { tableInfo } from "@/api/dataEngine";
 import {inputDisableComplete} from "@/utils/other";
+import {dragGroupTableInfo} from "@/api/relateTable/index"
 
+import {camelCase} from "@/utils";
 export default {
   name: "RelateTableCard",
-  props: ["cardData", "index"],
+  props: ["cardData", "index", "tableKey", "sort"],
   components: {},
   data() {
     return {
-      // 弹出层标题
-      title: "",
-      // cru 弹窗
-      open: false,
-      // 回显表格数据,
-      defaultValue: {},
-      //存放表单渲染数据
-      jsonData: {},
-      // 遮罩层
-      loading: true,
-      // 表格组标识
-      groupKey: null,
-      // 共通查询参数接受子组件的参数
+      // 总条数
+      total: 0,
+      tableList: [],
+      newsort: '',
       queryParams: {
         pageNum: 1, // 第几页
         pageSize: 10, // 每页大小
@@ -123,38 +121,84 @@ export default {
           // ... key : value         当前页面的筛选条件
           // 超级查询的唯一值
           queryCriteriaValue: "",
+          // tableCondition: ''
         },
       },
+      columns: [],
+      defaultValue: '',
+      currentValue:{},
+      //存放表单渲染数据
+      jsonData: {},
+      // 弹出层标题
+      title: "",
+      // cru 弹窗
+      open: false,
+      // 回显表格数据,
+      defaultValue: '',
+      currentRow: null,
+      // 用户表格数据
+      tableList: [],
       // 排序方式 默认降序
       sortOrder: true,
       // 当前模版信息
       templateInfo: {},
-      // 用户表格数据
-      tableList: [],
-      // 列信息
-      columns: {},
+      tableName: '',
+      queryFromWhere:'',
+      condition: []
     };
   },
-  created() {
-    this.groupKey = this.$route.query.groupKey;
-    this.getList()
+
+  computed: {
+    // currentValues
+    cardDataWatcher: function(){
+      return this.cardData
+    },
+    tableKeyWatcher: function(){
+      return this.tableKey
+    },
+    sortWatcher: function(){
+      return this.sort
+    },
+  },
+    watch:{
+    cardDataWatcher: {
+      handler(newval,oldval){
+        // debugger;
+       this.currentValue=newval;
+       this.$refs.singleTable?.doLayout()
+      },
+      deep: true,
+      immediate:true,
+    },
+    tableKeyWatcher: {
+      handler(newval){
+        console.log(newval)
+        this.gettableListHandler(newval);
+      },
+      deep: true,
+      immediate:true,
+    },
+    sortWatcher: {
+      handler(newval){
+        this.newsort = newval
+      },
+      deep: true,
+      immediate:true,
+    }
+  },
+  mounted() {
   },
-  computed: {},
   methods: {
-    /** 查询列表 */
-    async getList(queryParams) {
-      this.loading = true;
-      // 序列化当前查询参数列表
-      queryParams && (this.queryParams.queryMap = queryParams.queryMap);
-      // 获取当前表单结构信息
-      let result = await  dragGroupTableInfo({queryMap: {groupKey: this.groupKey}})
-      if(result.code == 200){
-        let list = JSON.parse(result.msg)
-        let res = await dragTableInfo({queryMap: {tableKey : list[0].tableKey}})
-        console.log(res);
+    // 请求数据
+    async gettableListHandler(tableKey, paramsContion = [], defaultVal ={}){
+      const res = await dragTableInfo({queryMap: {tableKey : tableKey }})
+      this.getTableHandle(res,paramsContion = [],defaultVal = {})
+    },
+    async getTableHandle(res){
+        this.columns = []
         // 得到当前模版信息 --- sql columns queryWhere
         this.templateInfo = res.data.resultMap;
-        console.log(this.templateInfo.template);
+  
         this.queryParams.orderByColumn =
           res.data.resultMap.querySql.orderByColumn;
         this.sortOrder = JSON.parse(res.data.resultMap.querySql.sortOrder);
@@ -167,35 +211,77 @@ export default {
         this.columns = this.columnsHandler(
           JSON.parse(this.templateInfo.template.dtColumnName)
         );
-      }
-        
-      if (this.templateInfo == {}) return;
-      // 调用查询需要携带当前table的唯一标识
-      this.queryParams.queryMap.sqlkey = this.templateInfo.template.sqlKey;
-      this.queryParams.orderByColumn = camelCase(
-        this.queryParams.orderByColumn || ""
-      );
-      // 根据sql语句查询当前表数据
-      console.log(this.queryParams)
-      unionListTableData(this.queryParams).then((res) => {
-        // console.log('unionListTableData');
-        console.log('res', res);
-        this.tableList = [];
-        res.rows.forEach((item) => {
-          this.tableList.push(item.resultMap);
-        });
-        // 驼峰转换
-        this.tableList = this.tableList.map((item) => {
-          let kv = {};
-          for (let itemKey in item) {
-            kv[camelCase(itemKey)] = item[itemKey];
-          }
-          return kv;
-        });
-        this.total = res.total;
-        this.loading = false;
-      });
+      
+        if (this.templateInfo !== {}) {
+            this.tableCondition = this.templateInfo.querySql.tableCondition
+            this.tableCondition = this.tableCondition.split('AND')
+
+            this.condition = [];
+              
+            // 调用查询需要携带当前table的唯一标识
+            this.queryParams.queryMap.sqlkey = this.templateInfo.template.sqlKey;
+
+            this.queryParams.orderByColumn = camelCase(
+              this.queryParams.orderByColumn || ""
+            );
+            // 根据sql语句查询当前表数据
+           
+            if(this.newsort == 0){
+              this.getDataHandler()
+              // this.queryParams.queryMap.sqlkey = this.templateInfo.template.sqlKey;
+            } else {
 
+            }
+            let k;
+            // console.log('conditions', this.tableCondition);
+            // this.tableCondition[1].
+            this.tableCondition.forEach((item, i) => {
+              let val = item.split('=')
+              if(i!==0){
+                
+                k =val[0].split('.')
+                let str = k[0].trim() + '.' + k[1]
+                this.condition.push({
+                  key: k[0].trim(),
+                  value: k[1]
+                })
+
+                
+              }
+            })
+        }  
+    },
+    // 获取表数据
+    async getDataHandler(contion, list){
+      contion?.forEach(item => {
+        this.queryParams.queryMap['#{' + item.key + '.' + item.value] = "'" + list[item.value] + "'";
+      })
+      this.tableList = [];
+      let tableLists = await unionListTableData(this.queryParams)
+      if(tableLists.code == 200){
+         
+          tableLists.rows.forEach((item) => {
+            this.tableList.push(item.resultMap);
+          });
+        
+          // 驼峰转换
+          this.tableList = this.tableList.map((item) => {
+            let kv = {};
+            for (let itemKey in item) {
+              kv[camelCase(itemKey)] = item[itemKey];
+            }
+            return kv;
+          })
+        if(this.tableList.length !== 0){
+          this.$emit(
+            "updateData",
+            this.tableList[0],
+            this.index,
+          );
+        }
+      }
+      this.total = tableLists.total;
+      this.loading = false; 
     },
     // 处理列表信息
     columnsHandler(columns) {
@@ -210,13 +296,12 @@ export default {
       });
       return resArr;
     },
-    handleCurrentChange(val) {
-      // 调用父组件方法更新表格数据
+    // 调用父组件方法更新表格数据
+    handleCurrentChange(row,event,column,val) {
       this.$emit(
         "updateData",
-        val,
-        this.$props.cardData.tableId,
-        this.$props.index
+        row,
+        this.index,
       );
     },
     /** 新增按钮操作 */
@@ -248,8 +333,8 @@ export default {
           console.log("验证未通过，获取失败");
         });
     },
-    //提交编辑结果按钮回调
-    editConfirmHandler() {
+     //提交编辑结果按钮回调
+     editConfirmHandler() {
       this.$refs.addFromRef
         .getData()
         .then(async (values) => {
@@ -284,7 +369,7 @@ export default {
             } else {
               this.$modal.msgError("修改失败");
             }
-            this.getList();
+            this.getDataHandler();
           } else {
             let res = await addTableData(data);
             if (res.code == 200) {
@@ -292,13 +377,14 @@ export default {
             } else {
               this.$modal.msgError("添加失败");
             }
-            this.getList();
+            this.getDataHandler();
           }
           this.defaultValue = {};
-          this.getList();
+          this.getDataHandler();
           this.open = false;
         })
         .catch((res) => {
+          console.log(res)
           this.$modal.msgError("表单校验失败,请规范填写数据");
         });
     },
@@ -307,6 +393,69 @@ export default {
       this.open = false;
       // this.reset();
     },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      getInfoBySqlKey(this.templateInfo.template.sqlKey).then(({data}) => {
+        if (!data || !data.dfVueTemplate) {
+          this.$message.error("当前表格未绑定表单!");
+          return;
+        }
+        Object.assign(this.defaultValue, row);
+        this.jsonData = JSON.parse(data.dfVueTemplate);
+        this.open = true;
+        this.title = "修改信息";
+        this.form.password = this.initPassword;
+        this.$nextTick(() => {
+          this.$refs.addFromRef.setData(row);
+        });
+      });
+      return;
+      this.reset();
+      const userId = row.userId || this.ids;
+      getUser(userId).then((response) => {
+        this.form = response.data;
+        this.postOptions = response.posts;
+        this.roleOptions = response.roles;
+        this.$set(this.form, "postIds", response.postIds);
+        this.$set(this.form, "roleIds", response.roleIds);
+        this.open = true;
+        this.title = "修改当前信息";
+        this.form.password = "";
+      });
+    },
+        /** 删除按钮操作
+     *
+     * 删除提示信息语句（标识）
+     * */
+    handleDelete(row) {
+      let delIds = this.ids;
+      let primary = camelCase(this.templateInfo.template?.primaryKey);
+      if (row[primary] != undefined && row[primary] != null) {
+        delIds = [];
+        delIds.push(row[primary]);
+      }
+      let data = {
+        basicMap: {
+          tableName: this.tableName,
+        },
+        conditionMap: {
+          // id: delIds,
+        },
+      };
+      data.conditionMap[this.templateInfo.template?.primaryKey] = delIds;
+      this.$modal
+        .confirm('是否确认删除"' + delIds + '"的数据项？')
+        .then(function () {
+          return delTableData(data);
+        })
+        .then(() => {
+          // 调用子组件查询方法 目的是携带上子组件中的查询参数
+          this.$refs.mychild.pageList();
+          this.$modal.msgSuccess("删除成功");
+        })
+        .catch(() => {
+        });
+    },
   },
 };
 </script>
@@ -332,4 +481,5 @@ export default {
   overflow: hidden;
   text-overflow: ellipsis;
 }
-</style>
+
+</style>

ruoyi-ui/src/views/relateTable/index copy.vue

@@ -0,0 +1,1685 @@
+<template>
+  <div class="app-container">
+    <el-form
+      :model="queryParams"
+      ref="queryForm"
+      size="small"
+      :inline="true"
+      v-show="showSearch"
+      label-width="68px"
+    >
+      <el-form-item label="表格组名" prop="dtName">
+        <el-input
+          v-model="queryParams.dtName"
+          placeholder="请输入表格组名"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button
+          type="primary"
+          icon="el-icon-search"
+          size="mini"
+          @click="handleQuery"
+          >搜索</el-button
+        >
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
+          >重置</el-button
+        >
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          >新增</el-button
+        >
+      </el-col>
+
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="DeleteTableGroup"
+          >删除</el-button
+        >
+      </el-col>
+      <!-- <el-col :span="1.5">
+        <el-button type="danger" plain size="mini" @click="handlePreview"
+          >动态页面</el-button
+        >
+      </el-col> -->
+    </el-row>
+
+    <el-table
+      v-loading="loading"
+      :data="tableGroupList"
+      ref="tableRef"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="表格主键" align="center" prop="id" />
+      <el-table-column label="表格组名" align="center" prop="groupName" />
+      <el-table-column label="描述" align="center" prop="groupDescription" />
+      <el-table-column label="表格数" align="center" prop="groupCount" />
+
+      <el-table-column
+        label="成员表格"
+        width="180"
+        >
+        <template slot-scope="scope">
+          <el-popover trigger="hover" placement="top">
+            <p v-for="(item,index) in scope.row.groupTableInfo"> {{ index == 0 ? '' :item.tablename }}</p>
+            
+            <div slot="reference" class="name-wrapper">
+            <el-tag size="medium">{{ scope.row.groupTableInfo[0].tablename }}</el-tag>
+            </div>
+          </el-popover>
+        </template>
+      </el-table-column>
+
+      <el-table-column
+        label="操作"
+        align="center"
+        class-name="small-padding fixed-width"
+      >
+        <template slot-scope="scope">
+          <el-dropdown>
+            <el-button type="warning" plain size="small">
+              处理<i class="el-icon-arrow-down el-icon--right"></i>
+            </el-button>
+            <el-dropdown-menu slot="dropdown">
+              <el-dropdown-item>
+                <el-button
+                  size="mini"
+                  type="text"
+                  icon="el-icon-edit"
+                  @click="UpdateTableGroup(scope.row)"
+                  >修改
+                </el-button>
+              </el-dropdown-item>
+              <el-dropdown-item>
+                <el-button
+                  size="mini"
+                  type="text"
+                  icon="el-icon-delete"
+                  @click="DeleteTableGroup(scope.row)"
+                  >删除
+                </el-button>
+              </el-dropdown-item>
+            </el-dropdown-menu>
+          </el-dropdown>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getTableList"
+    />
+
+    <!-- 新增联动表格组弹窗 -->
+    <el-dialog :title="groupTitle ? '新增动态表格组' : '修改动态表格组'" :visible.sync="isShowTable">
+      <div class="dialog_wrap">
+        <el-button
+          type="primary"
+          size="small"
+          icon="el-icon-plus"
+          @click="addOneTable"
+          class="mb10"
+          >新增</el-button
+        >
+        <el-form :model="groupForm" :rules="grouprules" ref="groupForm" label-width="100px" class="demo-ruleForm">
+          <el-form-item label="表格组名" prop="groupName">
+            <el-input v-model="groupForm.groupName" placeholder="请输入表格组名"></el-input>
+          </el-form-item>
+          <el-form-item label="表格描述" prop="groupDescription">
+            <el-input v-model="groupForm.groupDescription" placeholder="请输入表格描述"></el-input>
+          </el-form-item>
+          <el-form-item label="菜单路由" prop="routePath">
+          <div class="treeselect">
+            <treeselect
+              :append-to-body="true"
+              v-model="groupForm.routePath"
+              :options="menus"
+              :normalizer="normalizer"
+              :show-count="true"
+              placeholder="请选择父级路由"
+            />
+          </div>
+           
+          </el-form-item>
+        <el-form-item>
+          <el-table
+          :data="tableDataList"
+          border
+          stripe
+          @selection-change="handleSelectionChange"
+        >
+          <el-table-column label="序号" type="index" />
+          <el-table-column label="表格标题" prop="dtName" />
+          <el-table-column
+            label="表格名称"
+            prop="dtTableName"
+          ></el-table-column>
+          <el-table-column label="表格主键" prop="primaryKey">
+            <!-- <template slot-scope="scope" v-for="item in conditionDefaultValueMap ">
+              {{ item }}
+            </template> -->
+          </el-table-column>
+
+          <el-table-column
+            label="操作"
+            align="center"
+            class-name="small-padding fixed-width"
+          >
+            <template slot-scope="scope">
+              <el-dropdown>
+                <el-button type="warning" plain size="small">
+                  处理<i class="el-icon-arrow-down el-icon--right"></i>
+                </el-button>
+                <el-dropdown-menu slot="dropdown">
+                  <el-dropdown-item>
+                    <el-button
+                      size="mini"
+                      type="text"
+                      icon="el-icon-edit"
+                      @click="relateOne(scope.row)"
+                      >修改
+                    </el-button>
+                  </el-dropdown-item>
+                  <el-dropdown-item>
+                    <el-button
+                      size="mini"
+                      type="text"
+                      icon="el-icon-delete"
+                      @click="handleDelete(scope.row)"
+                      >删除
+                    </el-button>
+                  </el-dropdown-item>
+                </el-dropdown-menu>
+              </el-dropdown>
+            </template>
+          </el-table-column>
+          </el-table>
+        </el-form-item>
+        
+        <el-form-item class="btn">
+          <el-button @click="cancelGroup">取消</el-button>
+          <el-button type="primary" @click="addTableGroup('groupForm')">确认</el-button>
+        </el-form-item>
+        </el-form>
+      </div>
+    </el-dialog>
+
+    <!-- 编辑某一条表格数据弹窗 -->
+    <el-dialog :title="relateTitle ? '添加关联表格' :'修改关联表格' " :visible.sync="isShowForm" >
+      <div class="formWrap">
+        <el-form
+          :rules="tableItemRules"
+          ref="tableItemForm"
+          style="max-width: 750px; width: 1000px"
+          :model="tableItemForm"
+          label-width="100px"
+        >
+          <el-form-item label="表格标题:" prop="title">
+            <el-input
+              v-model="tableItemForm.title"
+              style="max-width: 221px"
+              @change="iptChange()"
+            ></el-input>
+          </el-form-item>
+          <el-form-item label="表格名称:" prop="tableName">
+            <el-select
+              v-model="tableItemForm.tableName"
+              @change="getList()"
+              placeholder="请选择表格名称"
+            >
+              <el-option
+              v-for="item in tableList"
+              :key="item.tableName"
+              :label="item.tableComment"
+              :value="item.tableName"
+              >
+              <span style="float: left">{{ item.tableComment }}</span>
+              <span style="float: right; color: #8492a6; font-size: 13px">{{
+                item.tableName
+              }}</span>
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="表格主键:" prop="selectFields">
+            <el-select
+              v-model="tableItemForm.selectFields"
+              placeholder="请选择表格主键"
+            >
+            <el-option
+              v-for="item in tableFieldList"
+              :key="item.fieldName"
+              :label="item.fieldDescription"
+              :value="item.fieldName"
+            >
+              <span style="float: left">{{ item.fieldDescription }}</span>
+              <span style="float: right; color: #8492a6; font-size: 13px">{{
+                item.fieldName
+              }}</span>
+            </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="时间格式" prop="timeFormate">
+            <el-select
+              v-model="tableItemForm.timeFormate"
+              placeholder="请选择时间格式"
+            >
+              <el-option
+                v-for="val in dict.type.sys_time_format"
+                :key="val.value"
+                :label="val.label"
+                :value="val.value"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="排序依赖字段">
+            <el-select
+              v-model="tableItemForm.orderByColumn"
+              placeholder="请选择排序依赖"
+            >
+              <el-option
+                v-for="val in orderByFieldList"
+                :key="val.fieldName"
+                :label="val.fieldDescription"
+                :value="val.tableName + '.' + val.fieldName"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="排序方式" v-show="tableItemForm.orderByColumn">
+            <el-radio v-model="tableItemForm.isAsc" :label="false"
+              >升序</el-radio
+            >
+            <el-radio v-model="tableItemForm.isAsc" :label="true"
+              >降序</el-radio
+            >
+          </el-form-item>
+          <el-form-item label="展示字段:" prop="FieldList">
+            <el-table
+            :data="tableFieldList"
+            border
+            ref="dragTable"
+            row-key="id"
+            max-height="500px"
+            class="tablefiled"
+            >
+            <el-table-column
+              type="index"
+              label="序号"
+              width="50"
+              class-name="allowDrag"
+            >
+            </el-table-column>
+            <el-table-column prop="fieldName" label="数据字段"></el-table-column>
+            <el-table-column prop="fieldDescription" label="字段描述">
+              <template slot-scope="scope">
+                <input
+                  :class="{
+                    isNullDesc:
+                      scope.row.fieldDescription == '' &&
+                      scope.row.isShow &&
+                      isInputInvalid
+                        ? true
+                        : false,
+                    ipt: true,
+                  }"
+                  v-model="scope.row.fieldDescription"
+                />
+              </template>
+            </el-table-column>
+            <el-table-column width="95px" prop="relationTable" label="关联表">
+              <template slot-scope="scope">
+                <el-select
+                  v-model="scope.row.relationTable"
+                  :disabled="
+                    !scope.row.relationTableList ||
+                    !scope.row.relationTableList.length
+                  "
+                  placeholder="请选择关联的表"
+                  clearable
+                  filterable
+                  @change="ralationTableChange(scope.row)"
+                >
+                  <el-option
+                    v-for="(item, index) in scope.row.relationTableList"
+                    :key="index"
+                    :label="item.tableComment"
+                    :value="item.tableName"
+                  >
+                    <span style="float: left">{{ item.tableComment }}</span>
+                    <span
+                      style="float: right; color: #8492a6; font-size: 13px"
+                      >{{ item.tableName }}</span
+                    >
+                  </el-option>
+                </el-select>
+              </template>
+            </el-table-column>
+            <el-table-column width="95px" prop="relationFieldName" label="关联条件字段">
+              <template slot-scope="scope">
+                <el-select
+                  v-model="scope.row.relationFieldName"
+                  @change="relationFieldChange(scope.row)"
+                  :disabled="!scope.row.disableRelaFieldName"
+                  placeholder="关联字段"
+                  filterable
+                >
+                  <el-option
+                    v-for="(item, index) in scope.row.relaFieldNameList"
+                    :key="index"
+                    :label="item.fieldDescription"
+                    :value="item.fieldName"
+                  >
+                  </el-option>
+                </el-select>
+              </template>
+            </el-table-column>
+            <el-table-column width="95px" prop="relationType" label="关联方式">
+              <template slot-scope="scope">
+                <el-select
+                  v-model="scope.row.relationType"
+                  placeholder="请选择关联方式"
+                  :disabled="!scope.row.disableRelaType"
+                  @change="relationTypeChangeHandler(scope.row)"
+                  filterable
+                >
+                  <el-option
+                    v-for="(item, index) in relaTypeList"
+                    :key="index"
+                    :label="item.label"
+                    :value="item.value"
+                  >
+                  </el-option>
+                </el-select>
+              </template>
+            </el-table-column>
+            <el-table-column prop="isShow" label="是否显示">
+              <template slot-scope="scope">
+                <el-switch v-model="scope.row.isShow"> </el-switch>
+              </template>
+            </el-table-column>
+            <el-table-column prop="isSearch" label="是否包含查询">
+              <template slot-scope="scope">
+                <el-switch v-model="scope.row.isSearch" @change="isSearchChange($event, scope.row,  scope.$index)"> </el-switch>
+              </template>
+            </el-table-column>
+          </el-table>
+          </el-form-item>
+          <el-form-item class="btn">
+            <el-button @click="cancelAddHandler">取消</el-button>
+            <el-button type="primary" @click="confirmAddHandler('tableItemForm')">确认</el-button>
+          </el-form-item>
+        </el-form>
+      </div>
+    </el-dialog>
+
+    <!-- 是否包含查询字段依赖值对话框 -->
+    <div class="isSearch">
+      <el-dialog
+      title="包含查询依赖值"
+      :visible.sync="isSearchDialog">
+      <el-select v-model="relyOption" placeholder="请选择依赖方式">
+        <el-option
+          v-for="item in relyOptions"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value">
+        </el-option>
+      </el-select>
+      <el-input v-show="relyOption === '0'" v-model="conditionDefaultValueMap" placeholder="请输入依赖内容"></el-input>
+
+      <el-select v-show="relyOption === '1'" v-model="conditionDefaultValueMap" placeholder="请选择依赖字段">
+        <el-option
+          v-for="item in relyFileds.tableFieldList"
+          :key="item.fieldName"
+          :label="item.fieldDescription"
+          :value="item.fieldName">
+        </el-option>
+      </el-select>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="isSearchCancel">取 消</el-button>
+        <el-button type="primary" @click="isSearchBtn">确 定</el-button>
+      </span>
+      </el-dialog>
+    </div>
+    
+  </div>
+</template>
+<script>
+import { listTable, removeTableList } from "@/api/dragform/tableList";
+import { getFormName, getListName, dragTablePreview, } from "@/api/dragform/form.js";
+import { delMenu } from "@/api/system/menu";
+import { getMenuList, addMenu} from "@/api/menu.js";
+import { getParticMenu, updateMenu } from "@/api/system/menu.js";
+import { addGroup, listGroup, getTable, delGroup, updataGroup } from '@/api/relateTable/index.js'
+import { addDragTable } from "@/api/tablelist/commonTable.js";
+import { mapGetters, mapState } from "vuex";
+import DictData from "@/components/DictData";
+import { FastBackwardFill, async } from "@/components/updateModule/k-form-design/lib/k-form-design.common";
+import { v4 as uuidv4 } from "uuid";
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+import json from "highlight.js/lib/languages/json";
+import { getTableInfo, editTable } from "@/api/system/table.js";
+
+export default {
+  name: "relateTable",
+  components: { Treeselect },
+  dicts: ["sys_time_format", "table_statistic_type"],
+  data() {
+    return {
+      isInputInvalid: false,
+
+      // 包含查询依赖字段dialog
+      isSearchDialog: false,
+      isSearchIndex: null,
+      // 依赖方式
+      relyOption: null,
+      relyOptions:[
+        {
+         value: '0',
+         label: '自定义依赖值'
+        },
+        {
+          value: '1',
+          label: '依赖其他字段'
+        }
+      ],
+      // 依赖值
+      conditionDefaultValueMap: '',
+      // 上个表格名称及字段
+      relyFileds: {},
+      formdata:{
+        conditionDefaultValueMap: {}
+      },
+      conditionDefault:[],
+      addDragData:[],
+      groupList:[],
+      menus: [], //路由列表数据
+      // 添加关联表格校验规则
+      tableItemRules:{
+        title:[{ required: true, message: '请输入表格标题', trigger: 'blur' }],
+        // tableName:[{ required: true, message: '请选择表格名称', trigger: 'change' }],
+        // selectFields: [{ required: true, message: '请选择关联字段', trigger: 'change' }],
+      },
+      groupForm: {
+        groupName: '',
+        groupDescription:'',
+        routePath: undefined,
+      },
+      grouprules:{
+        groupName:[{ required: true, message: '请输入表格组名', trigger: 'blur' }],
+        groupDescription:[{ required: true, message: '请输入表格描述', trigger: 'blur' }],
+        routePath: [
+          { required: true, message: "请选择路由", trigger: "change" },
+        ],
+      },
+      menuOrderNum: 0,
+      // 关联方式
+      relaTypeList: [
+        {
+          label: "等值连接",
+          value: "INNER JOIN",
+        },
+        {
+          label: "左连接",
+          value: "LEFT JOIN",
+        },
+        {
+          label: "右连接",
+          value: "RIGHT JOIN",
+        },
+      ],
+      searchFieldList: [],
+      // 依赖字段
+      relyFiledsList: [],
+      // 修改row
+      updataGroupRow:{},
+      // 遮罩层
+      loading: false,
+      // 选中数组
+      ids: [],
+      menuIds: [],
+      // 选中数组(包含所有数据)
+      selection: [],
+      Keys: [],
+      menuIds: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      tableList: [], //所有表格列表
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        dtName: null,
+        dtNickname: null,
+        tableKey: null,
+        sqlKey: null,
+        dtTableName: null,
+        dtNotes: null,
+        dtColumnName: null,
+        timeFormat: null,
+        spare: null,
+        spare1: null,
+        isSelection: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {},
+
+      // dialog弹窗数据
+      isShowTable: false,
+      isShowForm: false,
+      // 新增关联表数据
+      tableDataList: [],
+
+      tableFieldList: [], // 当前表格字段数据
+      tableName: "", // 当前表名称
+      selectFields: '', //关联字段
+      relateTitle: true,
+      relateTableName: "", //关联表名称
+      relateFields: "", //子集关联字段
+      relateFieldList: [], //子集关联字段数据
+      groupTitle: true,
+      tableItemForm: {
+        tId: "",
+        rowId: "",
+        title: "",
+        tableName: "",
+        selectFields: "",
+        isAsc: false,
+        timeFormate: "",
+        orderByColumn: "",
+      },
+      tableGroupList: [],
+      // 成员表格提示
+      tableKeyContent: '',
+      groupsMenuId: "",
+      // 修改表格时的menuId
+      menuId: "",
+      // 修改是表格的id
+      groupId:''
+    };
+  },
+  async created() {
+    this.getTableList()
+  },
+  async mounted() {
+    await this.getMenuList();
+  },
+  computed: {
+    selectRelate(){
+      if(this.tableItemForm.tableName =='') return
+      return this.tableList.filter(item => item.tableName !== this.tableItemForm.tableName)
+    },
+    dataArr() {
+      return this.tableFieldList.filter((item) => item.isShow);
+    },
+    ...mapGetters(["addRoutes"]),
+    ...mapState({
+      databaseName: (state) => state.user.dataSource.databaseName,
+      databaseType: (state) => state.user.dataSource.databaseType,
+      username: (state) => state.user.dataSource.username,
+      tenantId: (state) => state.user.tenant.tenantId,
+    }),
+    orderByFieldList() {
+      return this.tableFieldList;
+    },
+  },
+  watch: {
+    'tableItemForm.tableName': function (val) {
+      if (val) {
+        this.relationTableList = this.tableList
+          .filter((item) => item.tableName != val)
+          .map((item) => {
+            return {
+              tableName: item.tableName,
+              tableComment: item.tableComment,
+            };
+          });
+      } else {
+        this.relationTableList = [];
+      }
+    },
+    'groupForm.routePath'(nval, oval) {
+      let targetMenu = this.getTargetMenu(this.menus);
+      this.menuOrderNum = targetMenu.children ? targetMenu.children.length : 0;
+    },
+  },
+  methods: {
+    iptChange(){
+	    this.$forceUpdate();  //强制刷新
+    },
+    async getTableList(){
+      let res = await listGroup(this.queryParams);
+      this.total = res.total;
+      let info = []
+      res.rows.forEach(item => {
+        item.groupCount = JSON.parse(item.groupTableInfo).length
+
+        info = JSON.parse(item.groupTableInfo)
+        this.groupsMenuId = info[0].menuId
+        item.menuId = info[0].menuId
+        item.groupTableInfo = info
+      })
+      console.log(info);
+      this.tableGroupList = res.rows
+      console.log(this.tableGroupList)
+    },
+    // 是否包含查询switch
+    isSearchChange(status, row,index){
+      this.isSearchDialog = status
+      if(this.isSearchDialog == true){
+        this.conditionDefaultValueMap = ''
+      }
+      this.isSearchIndex = index
+    },
+    // 添加依赖字段取消
+    isSearchCancel(){
+      this.relyOption = null
+      this.conditionDefaultValueMap = ''
+      this.isSearchDialog = false
+      this.tableFieldList[this.isSearchIndex].isSearch = false
+    },
+    isSearchBtn(){
+      if(this.relyFileds.tableName !== undefined){
+        console.log(this.relyFileds.tableName);
+        this.conditionDefault.push('#{'+this.relyFileds.tableName+'.'+this.conditionDefaultValueMap)
+      }else{
+        this.conditionDefault.push(this.conditionDefaultValueMap)
+      }
+      console.log(this.conditionDefault)
+      this.isSearchDialog = false
+      this.conditionDefaultValueMap = ''
+      this.relyFileds.tableName = ''
+    },
+    // 获取路由表单数据
+    async getMenuList() {
+    let res = await listGroup();
+    console.log('res',  res);
+    this.menus = this.handleTree(res.data, "menuId");
+    },
+    // 递归拼接查询语句
+    getSQLString(tableFieldList, fieldArr, tableArr, sqlType = "mysql") {
+      let prefix = "{DBNAME}.";
+      let asOrSpace = sqlType == "oracle" ? " " : " AS ";
+      for (let i = 0; i < tableFieldList.length; i++) {
+        let temp = tableFieldList[i];
+        if (temp.isShow) {
+          let tempArr = prefix + temp.tableName + "." + temp.fieldName;
+          if (temp.isChildren) {
+            tempArr += asOrSpace + temp.tableName + "_" + temp.fieldName;
+          }
+          fieldArr.push(tempArr);
+        }
+        if (temp.relationTable && temp.relationFieldName && temp.relationType) {
+          let isNeedUsername = sqlType == "oracle" ? this.username + "." : "";
+          tableArr.push(
+            temp.relationType +
+              " " +
+              isNeedUsername +
+              prefix +
+              temp.relationTable +
+              asOrSpace +
+              temp.relationTable +
+              " ON " +
+              prefix +
+              temp.relationTable +
+              "." +
+              temp.relationFieldName +
+              " = " +
+              prefix +
+              temp.tableName +
+              "." +
+              temp.fieldName
+          );
+        }
+      }
+      // 如果主键不包含显示,则添加至sql语句中
+      let isNotInclude = this.tableFieldList.find(
+        (val) => !val.isShow && val.fieldName == this.tableItemForm.selectFields
+      );
+      if (isNotInclude) {
+        fieldArr.push(
+          prefix + isNotInclude.tableName + "." + isNotInclude.fieldName
+        );
+      }
+    },
+    // 拼接查询sql语句
+    getSQLStr() {
+      let prefix = "{DBNAME}.";
+      let sqlType = this.databaseType; //数据库类型
+      // let sqlType = "oracle";
+      let sql = "";
+      // mysql
+      sql += "SELECT ";
+      let fieldNameArr = [],
+        relaTypeArr = [];
+      this.getSQLString(
+        this.tableFieldList,
+        fieldNameArr,
+        relaTypeArr,
+        sqlType
+      );
+      let isNeedUsername = sqlType == "oracle" ? this.username + "." : "";
+      let asOrSpace = sqlType == "oracle" ? " " : " AS ";
+      sql +=
+        fieldNameArr.join(",") +
+        " FROM " +
+        isNeedUsername +
+        prefix +
+        this.tableItemForm.tableName +
+        asOrSpace +
+        this.tableItemForm.tableName;
+      if (relaTypeArr.length) {
+        sql += " " + relaTypeArr.join(" ");
+      }
+      return sql;
+    },
+    /** 查询列表 */
+    getList(queryParams) {
+      if (!this.tableItemForm.tableName) return;
+      let data = {
+        databaseName: this.databaseName,
+        databaseType: this.databaseType,
+        tableName: this.tableItemForm.tableName,
+      };
+      
+      // 获取当前表单结构信息
+      getListName(data).then((res) => {
+        this.tableFieldList = res.map((item, index) => {
+          return {
+            id: this.tableItemForm.tableName + "_" + item.fieldName,
+            fieldName: item.fieldName,
+            fieldDescription: item.fieldDescription,
+            relationTable: "",
+            relationFieldName: "",
+            relaFieldNameList: [],
+            disableRelaFieldName: false,
+            relationType: "",
+            relationShowField: [],
+            relationShowFiledList: [],
+            disableRelaType: false,
+            isShow: true,
+            isSearch: false,
+            isExport: true,
+            relationTableList: this.relationTableList,
+            tableName: this.tableItemForm.tableName,
+            relationFieldList: [],
+          };
+        });
+      });
+
+    },
+    // 关联表变化回调
+    async ralationTableChange(row) {
+      this.tableFieldList = this.tableFieldList.filter((item) => {
+        return !row.relationFieldList.some((val) => {
+          return val.id == item.id;
+        });
+      });
+      row.relationFieldName = "";
+      row.relationType = "";
+      row.disableRelaFieldName = false;
+      row.disableRelaType = false;
+      row.relationFieldList = [];
+      if (!row.relationTable) {
+        return;
+      }
+      // 获取关联表的字段
+      let data = {
+        databaseName: this.databaseName,
+        databaseType: this.databaseType,
+        tableName: row.relationTable,
+      };
+      let res = await getListName(data);
+      // 关联字段下拉列表数据
+      row.relaFieldNameList = res.map((item) => {
+        return {
+          fieldName: item.fieldName,
+          fieldDescription: item.fieldDescription,
+        };
+      });
+      let relationTableList = row.relationTableList.filter(
+        (item) => row.relationTable != item.tableName
+      );
+      row.relationFieldList = row.relaFieldNameList.map((item, index) => {
+        return {
+          id: row.relationTable + "_" + item.fieldName,
+          fieldName: item.fieldName,
+          fieldDescription: item.fieldDescription,
+          relationTable: "",
+          relationFieldName: "",
+          relaFieldNameList: [],
+          disableRelaFieldName: false,
+          relationType: "",
+          relationShowField: [],
+          relationShowFiledList: [],
+          disableRelaType: false,
+          isShow: true,
+          isSearch: false,
+          isExport: true,
+          relationTableList,
+          tableName: row.relationTable,
+          relationFieldList: [],
+          isChildren: true,
+        };
+      });
+      row.disableRelaFieldName = true;
+    },
+    // 关联类型变化回调
+    relationTypeChangeHandler(row) {
+      let tempRelationFieldList = row.relationFieldList.filter((item) => {
+        return !this.tableFieldList.find((val) => val.id === item.id);
+      });
+      this.tableFieldList = [...this.tableFieldList, ...tempRelationFieldList];
+    },
+    // 关联字段回调
+    relationFieldChange(row) {
+      if (!row.relationFieldName) {
+        row.relationType = "";
+        row.disableRelaType = false;
+        row.relaFieldNameList = [];
+        return;
+      }
+      row.disableRelaType = true;
+    },
+    // 递归获取列表信息
+    getCol(
+      tableFieldList,
+      columns,
+      searchFieldList = [],
+      tableExportField = {}
+    ) {
+      if (!tableFieldList.length) return;
+      for (let i = 0; i < tableFieldList.length; i++) {
+        let temp = tableFieldList[i];
+        let tempFieldName = "",
+          exportFieldName = "";
+        if (temp.isChildren) {
+          tempFieldName = temp.tableName + "_" + temp.fieldName;
+          exportFieldName = temp.tableName + "@" + temp.fieldName;
+        } else {
+          tempFieldName = temp.fieldName;
+          exportFieldName = temp.fieldName;
+        }
+        if (temp.isShow) {
+          let tempObj = {};
+          tempObj[tempFieldName] = temp.fieldDescription;
+          columns.push(tempObj);
+        }
+        if (temp.isSearch) {
+          searchFieldList.push(temp.tableName + "." + temp.fieldName);
+        }
+
+        if (temp.isExport) {
+          tableExportField[exportFieldName] = temp.fieldDescription;
+        }
+      }
+    },
+     // 获取所有表格
+    async getAllTable() {
+      let data = {
+        databaseName: this.databaseName,
+        databaseType: this.databaseType,
+      };
+      let res = await getFormName(data);
+
+      const baseTable = await this.getDicts("base_table");
+
+      this.tableList = res.data.filter((item) => {
+        return !baseTable.data.some(
+          (value) =>
+            value.dictValue.toLowerCase() == item.tableName.toLowerCase()
+        );
+      });
+    },
+    // 确认添加一个表格
+    confirmAddHandler(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          let columns = [],
+            searchFieldList = []
+            this.getCol(
+              this.tableFieldList,
+              columns,
+              searchFieldList,
+            );
+          // 判断是否有包含查询字段
+          if (!searchFieldList.length) {
+          this.$message.warning("请至少选择一个包含查询字段");
+          return false;
+          }
+          let echoData = {
+            tableName: this.tableItemForm.tableName,
+            tableFieldData: this.tableFieldList,
+            formData: this.groupForm,
+          }
+          // 判断修改还是新增
+          if(this.relateTitle){ 
+            console.log('新增');
+            let tableKey = uuidv4();
+            let sqlKey = uuidv4();
+            searchFieldList.forEach((item, index) => {
+              this.formdata.conditionDefaultValueMap[item] = this.conditionDefault[index]
+            })
+            this.relyFileds.tableFieldList = this.tableFieldList
+            this.relyFileds.tableName = this.tableItemForm.tableName
+            this.tableItemForm.rowId = Date.now();
+
+            this.tableDataList.push({
+              dtName: this.tableItemForm.title,
+              dtTableName: this.tableItemForm.tableName,
+              rowId: this.tableItemForm.rowId,
+              selectFields: this.tableItemForm.selectFields,
+              orderByColumn: this.tableItemForm.orderByColumn,
+              timeFormate: this.tableItemForm.timeFormate,
+
+              rowId: this.tableItemForm.rowId,
+              tId: this.tId,
+              tableKey: tableKey,
+              sortOrder: this.tableItemForm.isAsc,
+              sqlKey: sqlKey,
+              dtColumnName: columns, 
+              timeFormat: 'yyyy-MM-dd',
+              searchFieldList: searchFieldList, 
+              conditionDefaultValueMap: this.formdata.conditionDefaultValueMap,
+              tableSql: this.getSQLStr(), 
+              tableExportField: '',
+              echoData: JSON.stringify(echoData),
+            });
+
+            // 选择依赖字段
+            this.groupList.push({tableFieldList: this.tableFieldList, tableItemForm: this.tableItemForm, conditionDefaultValueMap: this.conditionDefaultValueMap})
+
+            if(this.groupTitle){
+              this.addDragData.push({
+              rowId: this.tableItemForm.rowId,
+              tId: this.tId,
+              dtName: this.tableItemForm.title,
+              tableKey: tableKey,
+              dtTableName: this.tableItemForm.tableName,
+              primaryKey: this.tableItemForm.selectFields,
+              orderByColumn: this.tableItemForm.orderByColumn,
+              sortOrder: this.tableItemForm.isAsc,
+              sqlKey: sqlKey,
+              dtColumnName: columns, 
+              timeFormat: 'yyyy-MM-dd',
+              searchFieldList: searchFieldList, 
+              conditionDefaultValueMap: this.formdata.conditionDefaultValueMap,
+              tableSql: this.getSQLStr(), 
+              tableExportField: '',
+              echoData: JSON.stringify(echoData),
+              })
+            }
+            
+          } else {
+            console.log(456);
+            let tableKey = uuidv4();
+            let sqlKey = uuidv4();
+
+              this.relyFileds.tableFieldList = this.tableFieldList
+
+              this.relyFileds.tableName = this.tableItemForm.tableName
+
+
+              console.log(this.conditionDefault);
+              searchFieldList.forEach((item, index) => {
+                // if(this.conditionDefault.length > 1){
+                  this.formdata.conditionDefaultValueMap[item] = this.conditionDefault[index]
+                // }else{
+                //   this.formdata.conditionDefaultValueMap = this.conditionDefault
+                // }
+              })
+
+             console.log(this.tableItemForm);
+              this.tableDataList.forEach((item, index) => {
+                if(item.tId == this.tableItemForm.tId) {
+                  this.tableDataList[index] = {
+                    tId: this.tableItemForm.tId,
+                    dtName: this.tableItemForm.title,
+                    tableKey: tableKey,
+                    dtTableName: this.tableItemForm.tableName,
+                    primaryKey: this.tableItemForm.selectFields,
+                    orderByColumn: this.tableItemForm.orderByColumn,
+                    sortOrder: this.tableItemForm.isAsc,
+                    sqlKey: sqlKey,
+                    dtColumnName: columns, 
+                    timeFormat: 'yyyy-MM-dd',
+                    searchFieldList: searchFieldList, 
+                    conditionDefaultValueMap: this.formdata?.conditionDefaultValueMap,
+                    tableSql: this.getSQLStr(), 
+                    tableExportField: '',
+                    echoData: JSON.stringify(echoData),
+                  }
+                }
+              })
+
+              console.log('11',this.tableDataList);
+              this.$set(this.tableDataList)
+              console.log('11',this.addDragData);
+          }
+          this.isShowForm = false
+          this.tableItemForm = {}
+          this.tableFieldList = []
+          this.relyFiledsList = []
+          this.conditionDefault = []
+          this.conditionDefaultValueMap= ''
+          this.formdata.conditionDefaultValueMap = {}
+        } else {
+          this.$message.error("请完善表单信息");
+          return false;
+        }
+      });
+    },
+    // 修改一个表格数据
+    relateOne(row){
+      console.log(row);
+      if(row.tableKey){
+        this.menuId = row.menuId
+        
+        
+        for (const key in row.conditionDefaultValueMap) {  
+          // this.conditionDefaultValueMap = row.conditionDefaultValueMap[key]
+          console.log(key);
+        this.conditionDefaultValueMap = row.conditionDefaultValueMap[key]
+        
+        this.conditionDefault.push(row.conditionDefaultValueMap[key])
+      }
+        console.log(this.conditionDefaultValueMap);
+        // this.initTableData(row.tId);
+        let echoData = JSON.parse(row.echoData)
+
+        this.tableDataList.forEach((item, index) => {
+          if(item.tableKey == row.tableKey){
+            if(index == 0){
+
+              this.relyFileds.tableFieldList = ''
+            }else{
+
+              let beforeEcho = JSON.parse(this.tableDataList[index-1].echoData)
+              
+              this.relyFileds.tableFieldList = beforeEcho.tableFieldData
+
+            }
+          }
+        } )
+        this.tableFieldList = echoData.tableFieldData;
+        // this.tableItemForm = row
+        this.tableItemForm.tId = row.tId
+        this.tableItemForm.rowId = row.tableKey,
+        this.tableItemForm.isAsc = false,
+        this.tableItemForm.orderByColumn = "",
+        this.tableItemForm.title = row.dtName
+        this.tableItemForm.tableName = row.dtTableName
+        this.tableItemForm.selectFields = row.primaryKey
+        this.tableItemForm.timeFormate = row.timeFormat
+
+      }else{
+        this.tableItemForm.rowId = row.rowId,
+        this.tableItemForm.title = row.dtName
+        this.tableItemForm.selectFields = row.selectFields
+        this.tableItemForm.tableName = row.dtTableName
+        this.tableItemForm.orderByColumn = row.orderByColumn
+        this.tableItemForm.timeFormate = row.timeFormat
+      
+        this.getList()
+        this.groupList.forEach(item => {
+          if(item.tableItemForm.rowId == row.rowId){
+            item.tableFieldList = this.tableFieldList
+          }
+        })
+      }
+
+      this.getAllTable()
+      // console.log('修改', this.groupList);
+      // 展示字段的回显
+      this.relateTitle = false
+      this.isShowForm = true;
+    },
+    // 删除表格组
+    DeleteTableGroup(row){
+      const fIds = row.id || this.ids;
+      const menus = row.menuId || this.menuIds
+      this.$modal
+        .confirm('是否确认删除动态单编号为"' + fIds + '"的数据项？删除后表格中所有的数据都将删除！')
+        .then(function () {
+          return delGroup(fIds);
+        })
+        .then(async () => {
+          let res = await delMenu(menus);
+
+          this.getTableList();
+          this.reloadRouter();
+          this.$modal.msgSuccess("删除成功");
+
+        })
+        .catch(() => {});
+    },
+    // 取消新增
+    cancelAddHandler(){
+      this.isShowForm = false;
+      this.tableItemForm = {}
+      this.tableFieldList = []
+    },
+    // 关联类型变化回调
+    relationTypeChangeHandler(row) {
+      let tempRelationFieldList = row.relationFieldList.filter((item) => {
+        return !this.tableFieldList.find((val) => val.id === item.id);
+      });
+      this.tableFieldList = [...this.tableFieldList, ...tempRelationFieldList];
+    },
+    // 更新路由
+    reloadRouter() {
+      this.$store.dispatch("GenerateRoutes").then((accessRoutes) => {
+        this.$router.addRoutes(accessRoutes); // 动态添加可访问路由表
+      });
+    },
+    // 获取目标menu
+    getTargetMenu(menus) {
+      for (let i = 0; i < menus.length; i++) {
+        if (menus[i].menuId == this.groupForm.routePath) {
+          return menus[i];
+        } else if (menus.children?.length) {
+          return this.getTargetMenu(menus.children);
+        }
+      }
+      return false;
+    },
+    // 获取父级menuId
+    getParentMenuId(menuId, menus) {
+      let res;
+      for (let i = 0; i < menus.length; i++) {
+        let item = menus[i];
+        if (item.menuId == menuId) {
+          res = item.parentId;
+          break;
+        } else if (item.children?.length) {
+          if (
+            this.getParentMenuId(
+              menuId,
+              JSON.parse(JSON.stringify(item.children))
+            )
+          ) {
+            res = this.getParentMenuId(
+              menuId,
+              JSON.parse(JSON.stringify(item.children))
+            );
+          }
+        }
+      }
+      return res;
+    },
+    // 修改表格回显数据
+    async initTableData(tId) {
+      let res = await getTableInfo(tId);
+      console.log('回显数据', res);
+      if (res.code == 200) {
+        if (!this.formData.routePath) {
+          this.$message.warning("该表格菜单路由已经删除,请重新配置");
+        }
+        // this.formData.routePath
+        this.editData = res.data;
+        let val = await getParticMenu(res.data.tableKey);
+        if (val.code == 200) {
+          this.menuId = val.data.menuId;
+        }
+      } else {
+        this.$message.error("数据回显失败");
+      }
+    },
+    // 新增动态表格组
+    addTableGroup(formName){
+      this.$refs[formName].validate(async (valid) => {
+          if (valid) { 
+            // console.log('groupList', this.groupList);
+            if(this.addDragData.length < 2) return this.$message.error("请包含多个表格");
+            if(this.groupTitle){
+              let groupKeyObj = {
+              groupKey: uuidv4(),
+              };
+              let payLoad = {
+                component: "relateTable/relateTableEdit",
+                icon: "",
+                isCache: "0",
+                isFrame: "1",
+                menuName: this.groupForm.groupName,
+                menuType: "C",
+                orderNum: this.menuOrderNum,
+                parentId: this.groupForm.routePath,
+                path: groupKeyObj.groupKey,
+                query: JSON.stringify(groupKeyObj),
+                status: "0",
+                visible: "0",
+                tenantId: this.tenantId,
+              };
+              let result;
+              result = await addMenu(payLoad);
+
+              if(result.code == 200){
+                this.reloadRouter();
+                let data = {
+                  groupKey: groupKeyObj.groupKey,
+                  groupName: '',
+                  groupDescription: '',
+                  groupTableInfo: [],
+                  dragTables:[]
+                }
+                this.addDragData.forEach((item, index) => {
+                item.menuId = result.data;
+                // item.sqlKey = tableKeyObj.tableKey
+                let echo = JSON.parse(item.echoData)
+                echo.formData = this.groupForm
+                item.echoData = JSON.stringify(echo)
+                data.groupTableInfo.push({
+                  tableKey: item.tableKey,
+                  sort: index,
+                  tablename: item.dtTableName,
+                  menuId: result.data
+                  })
+                })
+                data.groupName = this.groupForm.groupName
+                data.groupDescription = this.groupForm.groupDescription
+                data.groupTableInfo = JSON.stringify(data.groupTableInfo)
+                data.dragTables = this.addDragData
+
+                // 添加表格组
+                let res = await addGroup(data)
+
+                if(res.code == 200){
+                  this.$message.success("创建成功");
+
+                  this.isShowTable = false
+                  this.groupForm = {}
+                } else {
+                  this.$message.success("创建失败");
+                  }
+                }
+            }else{
+            
+              let groupKeyObj = {
+                groupKey: uuidv4(),
+              };
+              let data = {
+                groupKey: groupKeyObj.groupKey,
+                groupName: '',
+                groupDescription: '',
+                groupTableInfo: [],
+                dragTables:[],
+                id: this.groupId
+              }
+              this.addDragData.forEach((item, index) => {
+                // item.sqlKey = tableKeyObj.tableKey
+                let echo = JSON.parse(item.echoData)
+                echo.formData = this.groupForm
+                item.echoData = JSON.stringify(echo)
+                data.groupTableInfo.push({
+                  tableKey: item.tableKey,
+                  sort: index,
+                  tablename: item.dtTableName,
+                  })
+              })
+                data.groupName = this.groupForm.groupName
+                data.groupDescription = this.groupForm.groupDescription
+                data.groupTableInfo = JSON.stringify(data.groupTableInfo)
+                data.dragTables = this.addDragData
+              let res = await updataGroup(data)
+              console.log(res)
+
+              if(res.code == 200){
+                let payLoad = {
+                  menuId: this.menuId,
+                  menuName: this.groupForm.groupName,
+                  parentId: this.groupForm.routePath,
+                  component: "tablelist/commonTable/listInfo",
+                  icon: "",
+                  isCache: "0",
+                  isFrame: "1",
+                  menuType: "C",
+                  orderNum: this.menuOrderNum,
+                  status: "0",
+                  visible: "0",
+                  tenantId: this.tenantId,
+              };
+                console.log(payLoad);
+                let result = await updateMenu(payLoad);
+                console.log('确认修改', result);
+              }          
+            }
+
+            this.isShowTable = false
+            this.addDragData = []
+            this.groupForm = []
+            this.tableDataList = []
+            this.getTableList()
+          } else {
+            this.$message.error("请完善表单信息");
+            return false;
+          }
+      });
+    },
+    /** 新增按钮操作 */
+    async handleAdd() {
+      // dialog弹窗
+      this.isShowTable = true
+
+      // dialog标题
+      this.groupTitle = true
+
+      // 新增关联表格
+      this.isShowForm = true
+      this.relateTitle = true
+      this.tableItemForm = {}
+      this.groupForm = {}
+      this.tableDataList = []
+      this.tableFieldList = []
+      this.relyOption = ''
+      this.conditionDefaultValueMap = ''
+    },
+    // 取消
+    cancelGroup(){
+      this.groupTitle = true
+      this.isShowTable = false
+    },
+    // 获取路由表单数据
+    async getMenuList() {
+      let res = await getMenuList();
+      this.menus = this.handleTree(res.data, "menuId");
+    },
+    /** 转换菜单数据结构 */
+    normalizer(node) {
+      if (node.children && !node.children.length) {
+        delete node.children;
+      }
+      return {
+        id: node.menuId,
+        label: node.menuName,
+        children: node.children,
+      };
+    },
+    // 修改动态表格组回显
+    UpdateTableGroup(row){
+      console.log(row);
+      // let id = JSON.parse(row.id)
+      getTable({ id: row.id }).then(res => {
+        this.groupId = res.data.id
+        // 关联表格
+        this.groupTableInfo = JSON.parse(res.data.groupTableInfo)
+        this.menuId = res.data.dragTables[0].menuId
+
+        this.groupForm = res.data
+        this.addDragData = res.data.dragTables
+        // 菜单路由回显
+        this.tableDataList = this.groupForm.dragTables
+        this.groupForm.routePath = this.getParentMenuId(
+          res.data.dragTables[0].menuId,
+          this.menus,
+          {}
+        )
+
+        if (!this.groupForm.routePath) {
+          this.$message.warning("该表格菜单路由已经删除,请重新配置");
+        }
+      })
+
+      this.groupTitle = false
+      this.isShowTable = true 
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        tId: null,
+        dtName: null,
+        dtNickname: null,
+        tableKey: null,
+        sqlKey: null,
+        dtTableName: null,
+        dtNotes: null,
+        dtColumnName: null,
+        timeFormat: null,
+        spare: null,
+        spare1: null,
+        delFlag: null,
+        createBy: null,
+        createTime: null,
+        updateBy: null,
+        updateTime: null,
+        isSelection: null,
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.getTableList();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map((item) => item.id);
+      this.Keys = selection.map((item) => item.sqlKey);
+      this.menuIds = selection.map((item) => item.menuId);
+      this.selection = selection;
+      this.single = selection.length !== 1;
+      this.multiple = !selection.length;
+    },
+    
+    /** 修改按钮操作 */
+    async handleUpdate(row) {
+      // 兼容勾选单个的修改
+      let tId = row?.tId || this.ids[0];
+      // this.$router.push({
+      //   path: "/system/fromModel/index/tableMange",
+      //   query: {
+      //     tId: tId,
+      //   },
+      // });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate((valid) => {
+        if (valid) {
+          if (this.form.tId != null) {
+            updateTable(this.form).then((response) => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addTable(this.form).then((response) => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      console.log(row);
+      this.tableDataList.forEach((item, index) => {
+        if(row.tableKey == item.tableKey) {
+          this.tableDataList.splice(index, 1);
+        }
+      })
+      console.log(this.tableDataList)
+    },
+    // 更新路由
+    reloadRouter() {
+      this.$store.dispatch("GenerateRoutes").then((accessRoutes) => {
+        this.$router.addRoutes(accessRoutes); // 动态添加可访问路由表
+      });
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download(
+        process.env.VUE_APP_BASE_API3 + "system/table/export",
+        {
+          ...this.queryParams,
+        },
+        `table_${new Date().getTime()}.xlsx`
+      );
+    },
+    // 新增一个联动表格
+    addOneTable() {
+      this.relateTitle = true
+      if(this.relateTitle){
+        this.tableItemForm = {}
+        this.tableFieldList = []
+      }
+      if(!this.groupTitle){
+        // console.log('修改新增');
+        console.log(this.tableDataList[this.tableDataList.length-1].dtTableName)
+       
+        this.relyFileds.tableName = this.tableDataList[this.tableDataList.length-1].dtTableName
+        let echoData = JSON.parse(this.tableDataList[this.tableDataList.length-1].echoData)
+
+        this.relyFileds.tableFieldList = echoData.tableFieldData
+      }
+      this.getAllTable()
+      // 注意校验最后一条数据是否合法
+      this.isShowForm = true;
+    },
+
+    // 重置表单
+    // tableItemFormReset() {
+    //   Object.assign(this.tableItemForm, {
+    //     title: "",
+    //     tableId: "",
+    //     tableName: "",
+    //     showFields: [],
+    //     theRelateField: "",
+    //     executeOptions: [],
+    //   });
+    // },
+    // handlePreview() {
+    //   this.$router.push({
+    //     path: "/system/fromModel/index/relateTableEdit",
+    //   });
+    // },
+  },
+};
+</script>
+<style scoped lang="scss">
+::v-deep .el-dialog:not(.is-fullscreen){
+  width: 900px !important;
+}
+.isSearch {
+  ::v-deep .el-dialog:not(.is-fullscreen){
+  width: 320px !important;
+  }
+  ::v-deep .el-input--medium .el-input__inner{
+    margin-bottom: 10px !important;
+  }
+}
+.tablefiled{
+  ::v-deep .el-input--medium .el-input__inner{
+    width: 70px !important;
+  }
+}
+::v-deep .el-input--medium .el-input__inner{
+  width: 230px !important;
+}
+::v-deep .btn{
+  text-align: right !important;
+}
+.ipt {
+  height: 36px;
+  line-height: 36px;
+  font-size: 14px;
+  width: 100%;
+  outline: none;
+  text-align: center;
+  background-color: #fff;
+  border: 1px solid #dcdfe6;
+  color: #606266;
+  display: inline-block;
+  border-radius: 4px;
+}
+.isNullDesc {
+  border-color: #ff4949 !important;
+}
+
+.ipt:focus {
+  border-color: #1890ff;
+}
+::v-deep .vue-treeselect--has-value .vue-treeselect__input {
+  vertical-align: middle !important;
+}
+.formWrap {
+  display: flex;
+  justify-content: center;
+}
+
+::v-deep .el-table{
+  margin-top: 10px;
+}
+.nameipt{
+  display: inline;
+  margin-left: 10px;
+  ::v-deep .el-input--medium .el-input__inner{
+  width: 30%;
+  }
+  ::v-deep .el-input--medium{
+  display: inline;
+  }
+}
+.desc{
+  margin-left: 10px;
+}
+::v-deep .vue-treeselect--has-value .vue-treeselect__input {
+  vertical-align: middle !important;
+
+}
+.treeselect{
+   .vue-treeselect{
+    width: 230px !important;
+  }
+}
+</style>
+
+<style lang="scss">
+ 
+.vue-treeselect{
+  z-index: 9999 !important;
+}
+</style>

ruoyi-ui/src/views/relateTable/relateTableEdit.vue

@@ -5,15 +5,15 @@
         <div class="card_list">
           <div
             class="card_wrap"
-            v-for="(cardData, index) in dataList"
+            v-for="(cardData, index) in tableLists"
             :key="index"
           >
             <TableCard
-              @tansToParent="tansToParent"
-              @formtansToParent="formtansToParent"
+              :ref="'childComponent' + index"
               @updateData="updateDataList"
+              :tableKey="cardData.tableKey"
+              :sort="cardData.sort"
               :cardData="cardData"
-              ref="tableCard"
               :index="index"
             ></TableCard>
           </div>
@@ -26,99 +26,151 @@
 
 <script>
 import TableCard from "./components/RelateTableCard.vue";
+import {dragGroupTableInfo} from "@/api/relateTable/index"
+import {
+  delTableData,
+  dragTableInfo,
+  listTable,
+  unionListTableData,
+  getInfoBySqlKey,
+  addTableData,
+  batchEdit,
+  getStatisticList
+} from "@/api/tablelist/commonTable";
+import {camelCase} from "@/utils";
+
 export default {
   name: "relateTableEdit",
   props: [],
   components: { TableCard },
   data() {
     return {
-      dataList: [
-        {
-          tableId: "1",
-          title: "一级表格",
-          tableData: [
-            // {
-            //   date: "2016-05-02",
-            //   name: "王小虎",
-            //   address: "上海市普陀区金沙江路 1518 弄",
-            // },
-            // {
-            //   date: "2016-05-04",
-            //   name: "王小虎",
-            //   address: "上海市普陀区金沙江路 1517 弄",
-            // },
-            // {
-            //   date: "2016-05-01",
-            //   name: "王小虎",
-            //   address: "上海市普陀区金沙江路 1519 弄",
-            // },
-            // {
-            //   date: "2016-05-03",
-            //   name: "王小虎",
-            //   address: "上海市普陀区金沙江路 1516 弄",
-            // },
-          ],
+      tableLists:[],
+      // dataList: [
+      //   {
+      //     tableId: "1",
+      //     title: "一级表格",
+      //     tableData: [
+      //       {
+      //         date: "2016-05-02",
+      //         name: "王小虎",
+      //         address: "上海市普陀区金沙江路 1518 弄",
+      //       },
+      //       {
+      //         date: "2016-05-04",
+      //         name: "王小虎",
+      //         address: "上海市普陀区金沙江路 1517 弄",
+      //       },
+      //       {
+      //         date: "2016-05-01",
+      //         name: "王小虎",
+      //         address: "上海市普陀区金沙江路 1519 弄",
+      //       },
+      //       {
+      //         date: "2016-05-03",
+      //         name: "王小虎",
+      //         address: "上海市普陀区金沙江路 1516 弄",
+      //       },
+      //     ],
+      //   },
+      //   {
+      //     tableId: "2",
+      //     title: "二级表格",
+      //     tableData: [
+      //       {
+      //         date: "2016-05-02",
+      //         name: "王小虎",
+      //         address: "上海市普陀区金沙江路 1518 弄",
+      //       },
+      //       {
+      //         date: "2016-05-04",
+      //         name: "王小虎",
+      //         address: "上海市普陀区金沙江路 1517 弄",
+      //       },
+      //       {
+      //         date: "2016-05-01",
+      //         name: "王小虎",
+      //         address: "上海市普陀区金沙江路 1519 弄",
+      //       },
+      //       {
+      //         date: "2016-05-03",
+      //         name: "王小虎",
+      //         address: "上海市普陀区金沙江路 1516 弄",
+      //       },
+      //     ],
+      //   },
+      //   {
+      //     tableId: "3",
+      //     title: "三级表格三级表格三级表格三级表格",
+      //     tableData: [
+      //       {
+      //         date: "2016-05-02",
+      //         name: "王小虎",
+      //         address: "上海市普陀区金沙江路 1518 弄",
+      //       },
+      //       {
+      //         date: "2016-05-04",
+      //         name: "王小虎",
+      //         address: "上海市普陀区金沙江路 1517 弄",
+      //       },
+      //       {
+      //         date: "2016-05-01",
+      //         name: "王小虎",
+      //         address: "上海市普陀区金沙江路 1519 弄",
+      //       },
+      //       {
+      //         date: "2016-05-03",
+      //         name: "王小虎",
+      //         address: "上海市普陀区金沙江路 1516 弄",
+      //       },
+      //     ],
+      //   },
+      // ],
+      // 共通查询参数接受子组件的参数
+      queryParams: {
+        pageNum: 1, // 第几页
+        pageSize: 10, // 每页大小
+        orderByColumn: "", // 根据某列排序
+        isAsc: "", // desc（降序）或 asc（升序）
+        // 基本查询参数
+        basicMap: {
+          tableName: "drag_form",
+        },
+        // 当前表字段筛选参数
+        queryMap: {
+          // 当前查询基本参数
+          // ... key : value         当前页面的筛选条件
+          // 超级查询的唯一值
+          queryCriteriaValue: "",
+          // tableCondition: ''
         },
-        // {
-        //   tableId: "2",
-        //   title: "二级表格",
-        //   tableData: [
-        //     {
-        //       date: "2016-05-02",
-        //       name: "王小虎",
-        //       address: "上海市普陀区金沙江路 1518 弄",
-        //     },
-        //     {
-        //       date: "2016-05-04",
-        //       name: "王小虎",
-        //       address: "上海市普陀区金沙江路 1517 弄",
-        //     },
-        //     {
-        //       date: "2016-05-01",
-        //       name: "王小虎",
-        //       address: "上海市普陀区金沙江路 1519 弄",
-        //     },
-        //     {
-        //       date: "2016-05-03",
-        //       name: "王小虎",
-        //       address: "上海市普陀区金沙江路 1516 弄",
-        //     },
-        //   ],
-        // },
-        // {
-        //   tableId: "3",
-        //   title: "三级表格三级表格三级表格三级表格",
-        //   tableData: [
-        //     {
-        //       date: "2016-05-02",
-        //       name: "王小虎",
-        //       address: "上海市普陀区金沙江路 1518 弄",
-        //     },
-        //     {
-        //       date: "2016-05-04",
-        //       name: "王小虎",
-        //       address: "上海市普陀区金沙江路 1517 弄",
-        //     },
-        //     {
-        //       date: "2016-05-01",
-        //       name: "王小虎",
-        //       address: "上海市普陀区金沙江路 1519 弄",
-        //     },
-        //     {
-        //       date: "2016-05-03",
-        //       name: "王小虎",
-        //       address: "上海市普陀区金沙江路 1516 弄",
-        //     },
-        //   ],
-        // },
-      ],
+      },
+      columns: [],
+      defaultValue: '',
     };
   },
   computed: {},
-  methods: {
-    updateDataList(row, tableId, index) {
-      console.log(`第${index}个关联表的${row}行选中了,tableId:${tableId}`);
-      // 更新对应card数据,并清空后续表格数据
+  mounted() {
+    this.groupKey = this.$route.query.groupKey;
+    this.getLists()
+  },
+  methods: { 
+    async getLists(){
+      let res = await dragGroupTableInfo({queryMap: {groupKey: this.groupKey}})
+      this.tableLists = JSON.parse(res.msg)
+    },
+    updateDataList(row,index) {
+      // console.log(row, index);
+      // let tableKey = this.tableLists[index+1].tableKey
+      let beforeChild = this.$refs['childComponent'+index][0]
+      index++
+      const chlid = this.$refs['childComponent'+index][0]
+      // console.log(chlid);
+      if(!chlid) return
+      let contion = beforeChild.condition
+      // let tableList = beforeChild.tableList[0]
+      // console.log(contion,tableList);
+      chlid.getDataHandler(contion,row)
     },
   },
 };
@@ -128,8 +180,12 @@ export default {
 .card_list {
   display: flex;
   .card_wrap {
-    max-width: 600px;
+    // max-height: 400px;
+    max-width: 400px;
     margin-right: 20px;
   }
 }
-</style>
+::v-deep .box-card[data-v-f25ef500]{
+  padding-bottom: 40px !important;
+}
+</style>

ruoyi-ui/src/views/system/excuteBtnMange/index.vue

@@ -336,10 +336,10 @@
               </el-form-item>
             </el-col>
             <el-col :span="12">
-              <el-form-item label="绑定节点" prop="btnScriptKey">
+              <el-form-item label="绑定脚本" prop="btnScriptKey">
                 <el-select
                   v-model="btnGroupFormData.btnScriptKey"
-                  placeholder="请选择执行节点"
+                  placeholder="请选择绑定节点"
                   clearable
                   filterable
                 >
@@ -500,7 +500,6 @@ import Treeselect from "@riophae/vue-treeselect";
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 import IconSelect from "@/components/IconSelect";
 import { v4 as uuidv4 } from "uuid";
-import { node } from "@/components/updateModule/k-form-design/lib/k-form-design.common";
 
 export default {
   name: "ExcuteBtnMange",

ruoyi-ui/src/views/system/fromModel/index.vue

@@ -77,12 +77,25 @@ export default {
       //
       var editorHtmlJson =
         codeHtmlFront + JSON.stringify(jsonData) + codeHtmlLast;
+      let { list } = jsonData;
+      let needSqlArr = ["select", "treeSelect", "cascader"];
+      let selectArr = list.filter((item) => {
+        return needSqlArr.includes(item.type) && item.options.dynamic;
+      });
+      let formSQL = {};
+      selectArr.forEach((item) => {
+        // formSQL = {
+        //   ...formSQL,
+        //   ...item.options.sqlData,
+        // };
+        Object.assign(formSQL, item.options.sqlData);
+      });
+
       let {
         formName,
         nickFormName,
         mainTableName,
         formDescription,
-        formSQL,
         formNodeId,
       } = jsonData.config;
       if (!this.fid) {
@@ -112,7 +125,7 @@ export default {
           fId: this.fid,
           dfTableName: mainTableName,
           dfNotes: formDescription,
-          dfFormSql: formSQL,
+          dfFormSql: JSON.stringify(formSQL),
           dfNodeId: formNodeId,
         }).then((res) => {
           console.log(res);

ruoyi-ui/src/views/system/selectOptionsMange/index.vue

@@ -0,0 +1,18 @@
+<template>
+  <div class="app-container">选项数据管理</div>
+</template>
+
+<script>
+export default {
+  name: "SelectOptionsMange",
+  props: [],
+  components: {},
+  data() {
+    return {};
+  },
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="scss" scoped></style>

ruoyi-ui/src/views/system/tenant/index.vue

@@ -316,16 +316,16 @@
     </el-dialog>
 
     <!-- 激活租户弹出层-->
-    <el-dialog :title="title" :visible.sync="tenantExpirationTimeOpen" width="500px" append-to-body>
-      <el-form ref="form" :model="tenantExpirationTimeFrom" :rules="rulesTenantExpirationTime" label-width="80px">
+    <el-dialog title="激活租户" :visible.sync="tenantExpirationTimeOpen" width="500px" append-to-body>
+      <el-form ref="tenantExpirationTimeFrom" :model="tenantExpirationTimeFrom" :rules="rulesTenantExpirationTime" label-width="80px">
         <el-form-item label="激活租户" prop="tenantExpirationTime" label-width="110px">
           <el-input v-model="tenantExpirationTimeFrom.tenantExpirationTime" placeholder="请输入激活码" />
         </el-form-item>
+        <el-form-item class="btn">
+          <el-button type="primary" @click="activationOperationMethod('tenantExpirationTimeFrom')">确 定</el-button>
+          <el-button @click="tanentCancel">取 消</el-button>
+        </el-form-item>
       </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="activationOperationMethod">确 定</el-button>
-        <el-button @click="cancel">取 消</el-button>
-      </div>
     </el-dialog>
   </div>
 </template>
@@ -345,6 +345,7 @@ import {
 } from "@/api/system/tenant";
 import { getDataSourceInfo, insertDataSource } from "@/api/system/data";
 import { servicesLoading } from "@/utils/ruoyi";
+import { async } from "@/components/updateModule/k-form-design/lib/k-form-design.common";
 
 export default {
   name: "Tenant",
@@ -442,7 +443,10 @@ export default {
         ],
       },
       //租户激活码弹窗表单
-      tenantExpirationTimeFrom:{},
+      tenantExpirationTimeFrom:{
+        tenantId: null,
+        tenantExpirationTime: '',
+      },
       //租户激活码弹窗标题
       tenantExpirationTimeOpen:false,
       //租户激活码规则验证
@@ -565,7 +569,7 @@ export default {
     },
     /** 新增按钮操作 */
     handleAdd() {
-      this.reset();
+      // this.reset();
       this.open = true;
       this.title = "添加租户信息";
     },
@@ -738,28 +742,44 @@ export default {
     restTenantExpirationTime() {
       this.tenantExpirationTimeFrom = {
         tenantId: null,
-        tenantExpirationTime: null,
+        tenantExpirationTime: '',
       };
       this.resetForm("tenantExpirationTimeFrom");
     },
     /**打开激活码弹窗*/
     openTenantExpirationTime(row) {
-      this.reset();
+      // this.reset();
       const tenantId = row.tenantId || this.ids;
-      this.tenantExpirationTimeFrom.tenantId= row.tenantId
-      this.tenantExpirationTimeOpen=true;
-      this.title="激活租户";
+      this.tenantExpirationTimeFrom.tenantId = row.tenantId
+      this.tenantExpirationTimeOpen = true;
+      // this.title="激活租户";
     },
     /**激活租户操作*/
-    activationOperationMethod(){
-      this.$refs["form"].validate((valid) => {
+    activationOperationMethod(form){
+      this.$refs[form].validate(async (valid) => {
         if (valid) {
-          activationOperation(this.tenantExpirationTimeFrom).then((response) => {
-            this.$modal.msgSuccess("激活成功");
-            this.open = false;
-          });
+          let response = await activationOperation(this.tenantExpirationTimeFrom)
+            if(response.code == 200){
+              this.$message.success("激活成功");
+            } else {
+              this.$message.error("激活失败");
+            }
+            this.tenantExpirationTimeOpen = false;
+            this.tenantExpirationTimeFrom = {
+              tenantId: null,
+              tenantExpirationTime: null,
+            };
+   
         }
       });
+    },
+    // 激活租户对话框取消按钮
+    tanentCancel(){
+      this.tenantExpirationTimeOpen = false;
+      this.tenantExpirationTimeFrom = {
+        tenantId: null,
+        tenantExpirationTime: null,
+      };
     }
   },
 };

ruoyi-ui/src/views/tableMange/index.vue

@@ -642,7 +642,7 @@
               :value="item.tableName + '.' + item.fieldName"
             >
               <span style="float: left; margin-right: 5px"
-                >{{ item.tableName }}
+                >{{ isShowTableName }}
               </span>
               <span style="float: right; color: #8492a6; font-size: 13px">{{
                 item.fieldName
@@ -869,7 +869,7 @@ export default {
       searchFieldList: [],
       // 是否切换到数据统计
       menudata: false,
-      // 显示添加字段对话框
+      // 显示添加字段对话框dataArr
       isShowAddData: false,
       dataType: [],
       uuid: "",
@@ -886,6 +886,16 @@ export default {
     dataArr() {
       return this.tableFieldList.filter((item) => item.isShow);
     },
+    // 数据统计字段表名中文
+    isShowTableName() {
+      let tableComment;
+      this.tableList.forEach(item => {
+        if(item.tableName === this.tableName){
+          tableComment = item.tableComment
+        }
+      })
+      return tableComment
+    },
     ...mapState({
       databaseName: (state) => state.user.dataSource.databaseName,
       databaseType: (state) => state.user.dataSource.databaseType,
@@ -970,7 +980,6 @@ export default {
         databaseType: this.databaseType,
         tableName: this.tableName,
       };
-      console.log(data);
       let tableComment = this.getTableCommont(this.tableName, this.tableList);
       // 获取当前表单结构信息
       getListName(data).then((res) => {
@@ -1556,6 +1565,7 @@ export default {
           //   this.$message.error("请补全关联条件");
           //   return;
           // }
+          // console.log("123", columns);
           this.uuid = uuidv4();
           this.tableKey = uuidv4();
           // 表单
@@ -1580,12 +1590,14 @@ export default {
             let tableKeyObj = {
               tableKey: this.uuid,
             };
+            // console.log(this.formData)
             let payLoad = {
               component: "tablelist/commonTable/listInfo",
               icon: "",
               isCache: "0",
               isFrame: "1",
               menuName: this.formData.menuName,
+              // menuId: this.formData.routePath,
               menuType: "C",
               orderNum: this.menuOrderNum,
               parentId: this.formData.routePath,
@@ -1606,7 +1618,7 @@ export default {
             let data = {
               tId: this.tId,
               dtName: this.formData.menuName,
-              // menuId: this.formData.routePath,
+              menuId: this.formData.routePath,
               tableKey: this.uuid, //  暂定
               dtTableName: this.tableName,
               primaryKey: this.formData.primaryKey,

ruoyi-ui/src/views/tablelist/commonTable/listInfo.vue

@@ -244,8 +244,10 @@
       <k-form-build
         class="formBuild"
         ref="addFromRef"
+        :dynamicData="dynamicData"
         :defaultValue="defaultValue"
         @submit="tempSubBtn"
+        @change="formChangeHandler"
         :value="jsonData"
       />
       <div slot="footer" class="dialog-footer">
@@ -362,6 +364,8 @@ export default {
       dictStyleObj: {},
       // 操作列 按钮数据
       excuteBtnArr: [],
+      // 下拉框动态数据
+      dynamicData: {},
     };
   },
 
@@ -392,7 +396,6 @@ export default {
       // 获取当前表单结构信息
       dragTableInfo({ queryMap: { tableKey: this.tableKey } })
         .then((res) => {
-          console.log(res);
           // 得到当前模版信息 --- sql columns queryWhere
           this.templateInfo = res.data.resultMap;
           this.styleList = res.data.resultMap.style?.map((item) => {
@@ -450,10 +453,14 @@ export default {
 
           // 查询统计信息
           getStatisticList({
-            queryMap: { tableKey: this.templateInfo.template.tableKey },
-          }).then((res) => {
-            this.statisticList = res.data;
-          });
+            queryMap: {
+              tableKey: this.templateInfo.template.tableKey,
+              queryCriteriaValue: this.queryParams.queryMap.queryCriteriaValue
+            },
+          }).then(res => {
+            // console.log('getStatisticList', res);
+            this.statisticList = res.data
+          })
         });
     },
     isUpperCase(char) {
@@ -560,6 +567,10 @@ export default {
           this.$message.error("当前表格未绑定表单!");
           return;
         }
+        if (data.dfFormSql) {
+          let dynamicData = JSON.parse(data.dfFormSql);
+          Object.assign(this.dynamicData, dynamicData);
+        }
         this.jsonData = JSON.parse(data.dfVueTemplate);
         this.open = true;
         this.title = "添加信息";
@@ -973,6 +984,11 @@ export default {
           break;
       }
     },
+
+    // k-form-build表单变化回调
+    formChangeHandler(value, label) {
+      console.log(value, label);
+    },
   },
 };
 </script>