支持刷新低代码，

wujingjing

2024-09-13 39ab910fe59480a35ebca316cd66e3995e70d4ed

 src/views/project/yw/lowCode/sqlAmis/edit/SqlAmisEdit.vue

@@ -33,7 +33,7 @@
            </el-table></Pane
         >
         <Pane :size="60">
            <Splitpanes class="default-theme h100" :horizontal="true" v-if="currentSql">
            <Splitpanes class="default-theme h100" :horizontal="true">
               <Pane :size="35" class="flex-col flex">
                  <div class="flex-0 flex justify-between items-center mb-1 ml-1 h-[36px]">
                     <span class="font-bold">参数</span>
@@ -65,19 +65,26 @@
                  </el-table>
               </Pane>
               <Pane :size="65">
                  <div class=" h-full">
                     <template v-if="currentSql">
                        <div class=" flex justify-between items-center my-1 ml-1 h-[36px]">
                           <span class="font-bold">SQL</span>
                  <div class="h-full">
                     <template v-if="currentDockConfig">
                        <div class="flex justify-between items-center my-1 ml-1 h-[36px]">
                           <el-select class="w-52 font-bold" v-model="currentDockConfig.type">
                              <el-option
                                 v-for="item in Object.keys(amisDockTypeMap)"
                                 :key="item"
                                 :value="item"
                                 :label="amisDockTypeMap[item]"
                              ></el-option>
                           </el-select>

                           <el-select class="w-40" v-model="currentSql.database" @change="databaseSelectChange">
                           <el-select class="w-40" v-model="currentDockConfig.database" @change="databaseSelectChange">
                              <el-option v-for="item in databaseList" :key="item.id" :value="item.id" :label="item.title"></el-option>
                           </el-select>
                        </div>
                        <codemirror
                           class=" overflow-auto"
                           style="height: calc(100% - 36px);"
                           v-model="currentSql.sql"
                           class="overflow-auto"
                           style="height: calc(100% - 36px)"
                           v-model="currentDockConfig.sql"
                           :autofocus="true"
                           :indent-with-tab="true"
                           :tab-size="2"
@@ -100,20 +107,21 @@
import { sql } from '@codemirror/lang-sql';
import { xml } from '@codemirror/lang-xml';
import { vscodeDark } from '@uiw/codemirror-theme-vscode';
import _, { debounce } from 'lodash';
import { onMounted, ref } from 'vue';
import { Codemirror } from 'vue-codemirror';
import * as codeExample from './testData';
import titleBox from '/@/components/titleBox.vue';
import { Pane, Splitpanes } from 'splitpanes';
import 'splitpanes/dist/splitpanes.css';
import type { TableInstance } from 'element-plus';
import { ElMessage } from 'element-plus';
import _, { debounce } from 'lodash';
import { Pane, Splitpanes } from 'splitpanes';
import 'splitpanes/dist/splitpanes.css';
import { v4 as uuid } from 'uuid';
import { onMounted, ref } from 'vue';
import { Codemirror } from 'vue-codemirror';
import { SupervisorPublished } from '../types';
import * as codeExample from './testData';
import * as supervisorApi from '/@/api/supervisorAdmin';
import { updateSqlApi } from '/@/api/supervisorAdmin';
import titleBox from '/@/components/titleBox.vue';
import { useCompRef } from '/@/utils/types';
import { SupervisorPublished } from '../types';
import { amisDockTypeMap } from './types';

const props = defineProps(['supervisor']);
const emit = defineEmits(['backLastPage', 'updatePublished']);
@@ -134,10 +142,10 @@
let defaultSelectDatabase = null;
const databaseSelectChange = (val) => {
   defaultSelectDatabase = val;
   if(currentSql.value){
      currentSql.value.database = val;
   if (currentDockConfig.value) {
      currentDockConfig.value.database = val;
   }
   updateSqlAndRs(currentSql.value.id,currentSql.value)
   updateSqlAndRs(currentDockConfig.value.id, currentDockConfig.value);
};
const backLastPage = () => {
   // setTimeout(() => {
@@ -148,14 +156,14 @@
const currentRs = ref<AmisDockConfig>(null);
const dockRowChange = (row) => {
   currentRs.value = row;
   currentSql.value = dockConfigList.value.find((item) => item.id === currentRs.value.recordId) ?? {
   currentDockConfig.value = dockConfigList.value.find((item) => item.id === currentRs.value.recordId) ?? {
      id: row.recordId,
      type: AmisDockType.Sql,
      sql: '',
      database: defaultSelectDatabase ?? databaseList.value[0]?.id ?? null,
   };
};
const currentSql = ref(null);
const currentDockConfig = ref(null);
/** @description 路径分隔符 */
const PATH_SEPARATOR = '/';
/** @description 1 退出所有循环 -1退出当次循环 0或其他值继续 */
@@ -215,7 +223,7 @@
      if (key === 'api') {
         // const url = value.url;
         const urlPath = path + PATH_SEPARATOR + 'url';
         const randomStr = 'query_' + uuid().slice(0, 12);
         const randomStr = 'q_' + value.url + '_' + uuid().slice(0, 12);
         const foundItem = apiDataList.find((item) => item.path === urlPath);
         const asyncId = foundItem?.asyncId ?? randomStr;
         const recordId = foundItem?.recordId ?? randomStr;
@@ -233,6 +241,7 @@
};

const checkValid = (showTip: boolean, tip?: string) => {
   if(!dockConfigList.value || dockConfigList.value.length===0) return true;
   const foundWithNoDatabase = dockConfigList.value?.find((item) => !item.database);
   if (foundWithNoDatabase && showTip) {
      ElMessage.warning(tip ?? `【${foundWithNoDatabase.id}】未选择数据库`);
@@ -242,10 +251,14 @@

const updateSqlAndRs = (id?, sqlValue?: { database?: string; sql?: string; type?: AmisDockType }) => {
   const apiConfig = configList.value.filter((item) => item.type === AmisDockType.Sql);
   if (apiConfig.length === 0) return;

   if (!checkValid(true)) {
      return;
   }

   const recordIds = apiConfig?.map(item=>item.recordId)??[];
   // 过滤出 apiConfig 中有的record;
   dockConfigList.value = dockConfigList.value?.filter(item=>recordIds.includes(item.id))??[]
   const asyncRsList = apiConfig.map((item) => ({
      amis_path: item.path,
      async_id: item.asyncId,
@@ -295,13 +308,13 @@

const sqlCodeChange = debounce((val) => {
   if (!currentRs.value.recordId) return;
   if (currentSql.value) {
      if (!currentSql.value.database) {
   if (currentDockConfig.value) {
      if (!currentDockConfig.value.database) {
         ElMessage.warning('请先选择数据库');
         return;
      }
   }
   updateSqlAndRs(currentSql.value.id, currentSql.value);
   updateSqlAndRs(currentDockConfig.value.id, currentDockConfig.value);
}, 1000);
const dockConfigList = ref([]);
const rsTableRef = ref<TableInstance>(null);
@@ -309,6 +322,7 @@

// 检查是否需要更新 rs
const checkRsUpdate = (originData: AmisDockConfig[], currentData: AmisDockConfig[]) => {

   // 都为空，不需要更新
   if ((!originData || originData.length === 0) && (!currentData || currentData.length === 0)) {
      return false;
@@ -372,10 +386,7 @@
      id: props.supervisor.id,
   });

   if (!xmlJson?.amis_json) {
      ElMessage.warning('暂无SQL配置');
      return;
   }
	
   const originConfig =
      xmlJson.async_rs?.map(
         (item) =>
@@ -396,7 +407,12 @@
      rsTableRef.value.setCurrentRow(configList.value[0]);
   }

   if (checkRsUpdate(originConfig, configList.value)) {
   if(!configList || configList.value.length===0 ){
      ElMessage.warning('暂无对接配置');
   }

   const isRsUpdate = checkRsUpdate(originConfig, configList.value)
   if (isRsUpdate) {
      // 自动更新Rs
      updateSqlAndRs();
   }