feat: 优化机器脚本添加参数的前端交互

mayfly_go_web/src/views/ops/db/SqlExec.vue

@@ -161,9 +161,14 @@
                             size="small"
                         >
                             <template #prepend>
-                                <el-popover trigger="click" :width="270" placement="right">
+                                <el-popover v-model:visible="dt.selectColumnPopoverVisible" :width="320" placement="right">
                                     <template #reference>
-                                        <el-link type="success" :underline="false">选择列</el-link>
+                                        <el-link
+                                            @click="dt.selectColumnPopoverVisible = !dt.selectColumnPopoverVisible"
+                                            type="success"
+                                            :underline="false"
+                                            >选择列</el-link
+                                        >
                                     </template>
                                     <el-table
                                         :data="getColumns4Map(dt.name)"
@@ -174,6 +179,7 @@
                                                 onConditionRowClick(event, dt);
                                             }
                                         "
+                                        style="cursor: pointer"
                                     >
                                         <el-table-column property="columnName" label="列名" show-overflow-tooltip> </el-table-column>
                                         <el-table-column property="columnComment" label="备注" show-overflow-tooltip> </el-table-column>
@@ -233,6 +239,30 @@
                 </el-tab-pane>
             </el-tabs>
         </el-container>
+
+        <el-dialog v-model="conditionDialog.visible" :title="conditionDialog.title" width="420px">
+            <el-row>
+                <el-col :span="5">
+                    <el-select v-model="conditionDialog.condition">
+                        <el-option label="=" value="="> </el-option>
+                        <el-option label="LIKE" value="LIKE"> </el-option>
+                        <el-option label=">" value=">"> </el-option>
+                        <el-option label=">=" value=">="> </el-option>
+                        <el-option label="<" value="<"> </el-option>
+                        <el-option label="<=" value="<="> </el-option>
+                    </el-select>
+                </el-col>
+                <el-col :span="19">
+                    <el-input v-model="conditionDialog.value" :placeholder="conditionDialog.placeholder" />
+                </el-col>
+            </el-row>
+            <template #footer>
+                <span class="dialog-footer">
+                    <el-button @click="onCancelCondition">取消</el-button>
+                    <el-button type="primary" @click="onConfirmCondition">确定</el-button>
+                </span>
+            </template>
+        </el-dialog>
     </div>
 </template>
 
@@ -313,6 +343,16 @@ export default defineComponent({
                 left: '',
                 top: '',
             },
+            selectColumnPopoverVisible: false,
+            conditionDialog: {
+                title: '',
+                placeholder: '',
+                columnRow: null,
+                dataTab: null,
+                visible: false,
+                condition: '=',
+                value: null,
+            },
             cmOptions: {
                 tabSize: 4,
                 mode: 'text/x-sql',
@@ -677,6 +717,7 @@ export default defineComponent({
                 columnNames: [],
                 pageNum: 1,
                 count: 0,
+                selectColumnPopoverVisible: false,
             };
             tab.columnNames = await getColumnNames(tableName);
             state.dataTabs[tableName] = tab;
@@ -716,24 +757,36 @@ export default defineComponent({
          * 条件查询，点击列信息后显示输入对应的值
          */
         const onConditionRowClick = (event: any, dataTab: any) => {
+            dataTab.selectColumnPopoverVisible = false;
             const row = event[0];
-            ElMessageBox.prompt(`请输入 [${row.columnName}] 的值`, '查询条件', {
+            state.conditionDialog.title = `请输入 [${row.columnName}] 的值`;
-                confirmButtonText: '确定',
+            state.conditionDialog.placeholder = `${row.columnType}  ${row.columnComment}`;
-                cancelButtonText: '取消',
+            state.conditionDialog.columnRow = row;
-                inputPlaceholder: `${row.columnType}  ${row.columnComment}`,
+            state.conditionDialog.dataTab = dataTab;
-            })
+            state.conditionDialog.visible = true;
-                .then(({ value }) => {
+        };
-                    if (!value) {
+
-                        value = '';
+        // 确认条件
-                    }
+        const onConfirmCondition = () => {
-                    let condition = dataTab.condition;
+            const conditionDialog = state.conditionDialog;
-                    if (condition) {
+            const dataTab = state.conditionDialog.dataTab as any;
-                        condition += ` AND `;
+            let condition = dataTab.condition;
-                    }
+            if (condition) {
-                    condition += `${row.columnName} = `;
+                condition += ` AND `;
-                    dataTab.condition = condition + wrapColumnValue(row, value);
+            }
-                })
+            const row = conditionDialog.columnRow as any;
-                .catch(() => {});
+            condition += `${row.columnName} ${conditionDialog.condition} `;
+            dataTab.condition = condition + wrapColumnValue(row, conditionDialog.value);
+            onCancelCondition();
+        };
+
+        const onCancelCondition = () => {
+            state.conditionDialog.visible = false;
+            state.conditionDialog.title = ``;
+            state.conditionDialog.placeholder = ``;
+            state.conditionDialog.value = null;
+            state.conditionDialog.columnRow = null;
+            state.conditionDialog.dataTab = null;
         };
 
         const onRefresh = async (tableName: string) => {
@@ -793,10 +846,10 @@ export default defineComponent({
         const getDefaultSelectSql = (tableName: string, where: string = '', orderBy: string = '', pageNum: number = 1) => {
             const baseSql = `SELECT * FROM ${tableName} ${where ? 'WHERE ' + where : ''} ${orderBy ? orderBy : ''}`;
             if (state.dbType == 'mysql') {
-                 return `${baseSql} LIMIT ${(pageNum - 1) * state.defalutLimit}, ${state.defalutLimit};`
+                return `${baseSql} LIMIT ${(pageNum - 1) * state.defalutLimit}, ${state.defalutLimit};`;
             }
             if (state.dbType == 'postgres') {
-                return `${baseSql} OFFSET ${(pageNum - 1) * state.defalutLimit} LIMIT ${state.defalutLimit};`
+                return `${baseSql} OFFSET ${(pageNum - 1) * state.defalutLimit} LIMIT ${state.defalutLimit};`;
             }
             return baseSql;
         };
@@ -1121,6 +1174,8 @@ export default defineComponent({
             getColumnTip,
             getColumns4Map,
             onConditionRowClick,
+            onConfirmCondition,
+            onCancelCondition,
             changeSqlTemplate,
             deleteSql,
             saveSql,

mayfly_go_web/src/views/ops/machine/ScriptEdit.vue

@@ -9,7 +9,7 @@
             :destroy-on-close="true"
             width="800px"
         >
-            <el-form :model="form" ref="mockDataForm" label-width="70px">
+            <el-form :model="form" ref="scriptForm" label-width="70px">
                 <el-form-item prop="method" label="名称">
                     <el-input v-model.trim="form.name" placeholder="请输入名称"></el-input>
                 </el-form-item>
@@ -24,8 +24,19 @@
                     </el-select>
                 </el-form-item>
 
-                <el-form-item prop="params" label="参数">
+                <el-row style="margin-left: 30px; margin-bottom: 5px">
-                    <el-input v-model="form.params" placeholder="参数数组json，若无可不填"></el-input>
+                    <el-button @click="onAddParam" size="small" type="success">新增占位符参数</el-button>
+                </el-row>
+                <el-form-item :key="param" v-for="(param, index) in params" prop="params" :label="`参数${index + 1}`">
+                    <el-row>
+                        <el-col :span="6"><el-input v-model="param.model" placeholder="内容中用{{.model}}替换"></el-input></el-col>
+                        <el-divider :span="1" direction="vertical" border-style="dashed" />
+                        <el-col :span="6"><el-input v-model="param.name" placeholder="字段名"></el-input></el-col>
+                        <el-divider :span="1" direction="vertical" border-style="dashed" />
+                        <el-col :span="6"><el-input v-model="param.placeholder" placeholder="字段说明"></el-input></el-col>
+                        <el-divider :span="1" direction="vertical" border-style="dashed" />
+                        <el-col :span="3"><el-button @click="onDeleteParam(index)" size="small" type="danger">删除</el-button></el-col>
+                    </el-row>
                 </el-form-item>
 
                 <el-form-item prop="script" label="内容" id="content">
@@ -84,41 +95,59 @@ export default defineComponent({
     },
     setup(props: any, { emit }) {
         const { isCommon, machineId } = toRefs(props);
-        const mockDataForm: any = ref(null);
+        const scriptForm: any = ref(null);
 
         const state = reactive({
             dialogVisible: false,
             submitDisabled: false,
+            params: [] as any,
             form: {
                 id: null,
                 name: '',
                 machineId: 0,
                 description: '',
                 script: '',
-                params: null,
+                params: '',
                 type: null,
             },
             btnLoading: false,
         });
 
         watch(props, (newValue) => {
+            state.dialogVisible = newValue.visible;
+            if (!newValue.visible) {
+                return;
+            }
             if (newValue.data) {
                 state.form = { ...newValue.data };
+                if (state.form.params) {
+                    state.params = JSON.parse(state.form.params);
+                }
             } else {
                 state.form = {} as any;
                 state.form.script = '';
             }
-            state.dialogVisible = newValue.visible;
         });
 
+        const onAddParam = () => {
+            state.params.push({ name: '', model: '', placeholder: '' });
+        };
+
+        const onDeleteParam = (idx: number) => {
+            state.params.splice(idx, 1);
+        };
+
         const btnOk = () => {
             state.form.machineId = isCommon.value ? 9999999 : (machineId.value as any);
             console.log('machineid:', machineId);
-            mockDataForm.value.validate((valid: any) => {
+            scriptForm.value.validate((valid: any) => {
                 if (valid) {
                     notEmpty(state.form.name, '名称不能为空');
                     notEmpty(state.form.description, '描述不能为空');
                     notEmpty(state.form.script, '内容不能为空');
+                    if (state.params) {
+                        state.form.params = JSON.stringify(state.params);
+                    }
                     machineApi.saveScript.request(state.form).then(
                         () => {
                             ElMessage.success('保存成功');
@@ -139,12 +168,15 @@ export default defineComponent({
         const cancel = () => {
             emit('update:visible', false);
             emit('cancel');
+            state.params = [];
         };
 
         return {
             ...toRefs(state),
             enums,
-            mockDataForm,
+            onAddParam,
+            onDeleteParam,
+            scriptForm,
             btnOk,
             cancel,
         };

mayfly_go_web/src/views/ops/machine/ServiceManage.vue

@@ -196,8 +196,11 @@ export default defineComponent({
             // 如果存在参数，则弹窗输入参数后执行
             if (script.params) {
                 state.scriptParamsDialog.paramsFormItem = JSON.parse(script.params);
-                state.scriptParamsDialog.visible = true;
+                console.log(state.scriptParamsDialog.paramsFormItem);
-                return;
+                if (state.scriptParamsDialog.paramsFormItem && state.scriptParamsDialog.paramsFormItem.length > 0) {
+                    state.scriptParamsDialog.visible = true;
+                    return;
+                }
             }
 
             run(script);

mayfly_go_web/src/views/ops/mongo/MongoEdit.vue

@@ -61,7 +61,6 @@ import { mongoApi } from './api';
 import { projectApi } from '../project/api.ts';
 import { machineApi } from '../machine/api.ts';
 import { ElMessage } from 'element-plus';
-import { RsaEncrypt } from '@/common/rsa';
 
 export default defineComponent({
     name: 'MongoEdit',
@@ -181,7 +180,7 @@ export default defineComponent({
             mongoForm.value.validate(async (valid: boolean) => {
                 if (valid) {
                     const reqForm = { ...state.form };
-                    reqForm.uri = await RsaEncrypt(reqForm.uri);
+                    // reqForm.uri = await RsaEncrypt(reqForm.uri);
                     mongoApi.saveMongo.request(reqForm).then(() => {
                         ElMessage.success('保存成功');
                         emit('val-change', state.form);

server/internal/devops/api/mongo.go

@@ -38,10 +38,6 @@ func (m *Mongo) Save(rc *ctx.ReqCtx) {
 
 	mongo := new(entity.Mongo)
 	utils.Copy(mongo, form)
-	// 解密uri，并使用解密后的赋值
-	originUri, err := utils.DefaultRsaDecrypt(form.Uri, true)
-	biz.ErrIsNilAppendErr(err, "解密uri错误: %s")
-	mongo.Uri = originUri
 
 	mongo.SetBaseInfo(rc.LoginAccount)
 	m.MongoApp.Save(mongo)

server/internal/devops/application/db_app.go

@@ -180,7 +180,7 @@ func (da *dbAppImpl) GetDbInstance(id uint64, db string) *DbInstance {
 			return load.(*DbInstance)
 		}
 	}
-	biz.IsTrue(mutex.TryLock(), "有数据库实例在连接中...请稍后重试")
+	mutex.Lock()
 	defer mutex.Unlock()
 
 	d := da.GetById(id)