项目完结 撒花

src/views/ripa/algo/index.vue

@@ -3,37 +3,37 @@
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
       <el-form-item label="算法名称" prop="algoName">
         <el-input
-          v-model="queryParams.algoName"
-          placeholder="请输入算法名称"
-          clearable
-          @keyup.enter="handleQuery"
+            v-model="queryParams.algoName"
+            placeholder="请输入算法名称"
+            clearable
+            @keyup.enter="handleQuery"
         />
       </el-form-item>
       <el-form-item label="算法描述" prop="algoDesc">
         <el-input
-          v-model="queryParams.algoDesc"
-          placeholder="请输入算法描述"
-          clearable
-          @keyup.enter="handleQuery"
+            v-model="queryParams.algoDesc"
+            placeholder="请输入算法描述"
+            clearable
+            @keyup.enter="handleQuery"
         />
       </el-form-item>
       <el-form-item label="算法类别" prop="algoType">
         <el-select v-model="queryParams.algoType" placeholder="请选择算法类别" clearable>
           <el-option
-            v-for="dict in algo_type"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
+              v-for="dict in algo_type"
+              :key="dict.value"
+              :label="dict.label"
+              :value="dict.value"
           />
         </el-select>
       </el-form-item>
       <el-form-item label="算法参数" prop="algoPara">
         <el-select v-model="queryParams.algoPara" placeholder="请选择算法参数" clearable>
           <el-option
-            v-for="dict in algo_para"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
+              v-for="dict in algo_para"
+              :key="dict.value"
+              :label="dict.label"
+              :value="dict.value"
           />
         </el-select>
       </el-form-item>
@@ -46,38 +46,41 @@
     <el-row :gutter="10" class="mb8">
       <el-col :span="1.5">
         <el-button
-          type="primary"
-          plain
-          icon="Plus"
-          @click="handleAdd"
-        >新增</el-button>
+            type="primary"
+            plain
+            icon="Plus"
+            @click="handleAdd"
+        >新增
+        </el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button
-          type="success"
-          plain
-          icon="Edit"
-          :disabled="single"
-          @click="handleUpdate"
-        >修改</el-button>
+            type="success"
+            plain
+            icon="Edit"
+            :disabled="single"
+            @click="handleUpdate"
+        >修改
+        </el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button
-          type="danger"
-          plain
-          icon="Delete"
-          :disabled="single"
-          @click="handleDelete"
-        >删除</el-button>
+            type="danger"
+            plain
+            icon="Delete"
+            :disabled="single"
+            @click="handleDelete"
+        >删除
+        </el-button>
       </el-col>
       <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
     <el-table v-loading="loading" :data="algoList" @selection-change="handleSelectionChange">
-      <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="算法ID" align="center" prop="algoId" />
-      <el-table-column label="算法名称" align="center" prop="algoName" />
-      <el-table-column label="算法描述" align="center" prop="algoDesc" />
+      <el-table-column type="selection" width="55" align="center"/>
+      <!--      <el-table-column label="算法ID" align="center" prop="algoId" />-->
+      <el-table-column label="算法名称" align="center" prop="algoName"/>
+      <el-table-column label="算法描述" align="center" prop="algoDesc"/>
       <el-table-column label="算法脚本" align="center" prop="algoScript" show-overflow-tooltip/>
       <el-table-column label="算法是否正确" align="center" prop="algoOk">
         <template #default="scope">
@@ -103,63 +106,68 @@
     </el-table>
 
     <pagination
-      v-show="total>0"
-      :total="total"
-      v-model:page="queryParams.pageNum"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
+        v-show="total>0"
+        :total="total"
+        v-model:page="queryParams.pageNum"
+        v-model:limit="queryParams.pageSize"
+        @pagination="getList"
     />
 
     <!-- 添加或修改算法管理对话框 -->
     <el-dialog :title="title" v-model="open" width="800px" append-to-body>
       <el-form ref="algoRef" :model="form" :rules="rules" label-width="80px">
         <el-form-item label="算法名称" prop="algoName" label-width="100px">
-          <el-input v-model="form.algoName" placeholder="请输入算法名称" />
+          <el-input v-model="form.algoName" placeholder="请输入算法名称"/>
         </el-form-item>
         <el-form-item label="算法描述" prop="algoDesc" label-width="100px">
-          <el-input v-model="form.algoDesc" placeholder="请输入算法描述" />
+          <el-input v-model="form.algoDesc" placeholder="请输入算法描述"/>
         </el-form-item>
         <el-form-item label="算法参数" prop="algoPara" label-width="100px">
           <el-radio-group v-model="form.algoPara">
             <el-radio
-              v-for="dict in algo_para"
-              :key="dict.value"
-              :label="dict.value"
-            >{{dict.label}}</el-radio>
+                v-for="dict in algo_para"
+                :key="dict.value"
+                :label="dict.value"
+            >{{ dict.label }}
+            </el-radio>
           </el-radio-group>
         </el-form-item>
         <el-form-item label="算法脚本" prop="algoScript" label-width="100px">
           <el-tabs style="width: 100%;" v-model="activeTabsName" @tab-click="handleTabClick">
-              <el-tab-pane label="脚本" name="100">
-                <div :ref="(el)=>setItemRef(el)" class="code-editor"></div>
-              </el-tab-pane>
-              <el-tab-pane label="验证" name="200">
-                <el-tabs style="width:100%;height: 100%;" v-model="activeTabsParaName">
-                  <el-tab-pane label="数据样例：一周" name="lastweek" style="width:100%;height: 100%;">
-                    <el-input
+            <el-tab-pane label="脚本" name="100">
+              <div :ref="(el)=>setItemRef(el)" class="code-editor"></div>
+            </el-tab-pane>
+            <el-tab-pane label="验证" name="200">
+              <el-tabs style="width:100%;height: 100%;" v-model="activeTabsParaName">
+                <el-tab-pane label="数据样例：一周" name="lastweek" style="width:100%;height: 100%;">
+                  <el-input
                       v-model="lastweek_value"
                       type="textarea"
                       :rows="9"
                       placeholder="请输入内容"
-                    />
-                  </el-tab-pane>
-                  <el-tab-pane label="数据样例：两周" name="currweek" style="width:100%;height: 100%;" v-if="form.algoPara=='2'">
-                    <el-input
+                  />
+                </el-tab-pane>
+                <el-tab-pane label="数据样例：两周" name="currweek" style="width:100%;height: 100%;"
+                             v-if="form.algoPara=='2'">
+                  <el-input
                       v-model="currweek_value"
                       type="textarea"
                       :rows="9"
                       placeholder="请输入内容"
-                    />
-                  </el-tab-pane>
-                </el-tabs>
-              </el-tab-pane>
-            </el-tabs>
-            <div class="data_exp_list" v-if="showExpList">
-              <div v-for="item in explist">
-                <el-checkbox :key="item.dataId" :label="item.dataName" @change="selecedData(item)"></el-checkbox>
-              </div>
+                  />
+                </el-tab-pane>
+              </el-tabs>
+            </el-tab-pane>
+          </el-tabs>
+          <div class="data_exp_list" v-if="showExpList">
+            <div v-for="item in explist">
+              <el-checkbox :key="item.dataId" :label="item.dataName" @change="selecedData(item)"></el-checkbox>
             </div>
-            <div v-if="activeTabsName=='200'"><el-button @click="selectDataExp">生成数据样例</el-button><el-button type="primary" @click="checkJS">验 证</el-button></div>
+          </div>
+          <div v-if="activeTabsName=='200'">
+            <el-button @click="selectDataExp">生成数据样例</el-button>
+            <el-button type="primary" @click="checkJS">验 证</el-button>
+          </div>
         </el-form-item>
         <el-form-item label="算法验证结果" label-width="100px">
           <div class="width:100%;height:50px">{{ jsCheckResult }}</div>
@@ -167,21 +175,23 @@
         <el-form-item label="算法是否正确" prop="algoOk" label-width="100px">
           <el-radio-group v-model="form.algoOk">
             <el-radio
-              v-for="dict in sys_common_status"
-              :key="dict.value"
-              :label="dict.value"
-              disabled
-            >{{dict.label}}</el-radio>
+                v-for="dict in sys_common_status"
+                :key="dict.value"
+                :label="dict.value"
+                disabled
+            >{{ dict.label }}
+            </el-radio>
           </el-radio-group>
         </el-form-item>
         <el-form-item label="算法类别" prop="algoType" label-width="100px">
           <el-radio-group v-model="form.algoType">
             <el-radio
-              v-for="dict in algo_type"
-              :key="dict.value"
-              :label="dict.value"
-              :disabled="form.algoOk!='0'"
-            >{{dict.label}}</el-radio>
+                v-for="dict in algo_type"
+                :key="dict.value"
+                :label="dict.value"
+                :disabled="form.algoOk!='0'"
+            >{{ dict.label }}
+            </el-radio>
           </el-radio-group>
         </el-form-item>
       </el-form>
@@ -196,17 +206,17 @@
 </template>
 
 <script setup name="Algo">
-import {onUnmounted} from "vue"
-import { listAlgo, getAlgo, delAlgo, addAlgo, updateAlgo } from "@/api/ripa/algo";
-import { listData, getData } from "@/api/ripa/data";
-import { EditorView, keymap } from '@codemirror/view'
-import { EditorState } from '@codemirror/state'
-import { defaultKeymap } from '@codemirror/commands'
-import { highlightSelectionMatches } from '@codemirror/search'
-import { javascript } from '@codemirror/lang-javascript'
-import { oneDark } from '@codemirror/theme-one-dark'
-const { proxy } = getCurrentInstance();
-const { sys_common_status, algo_type, algo_para } = proxy.useDict('sys_common_status', 'algo_type', 'algo_para');
+import {addAlgo, delAlgo, getAlgo, listAlgo, updateAlgo} from "@/api/ripa/algo";
+import {listData} from "@/api/ripa/data";
+import {EditorView, keymap} from '@codemirror/view'
+import {EditorState} from '@codemirror/state'
+import {defaultKeymap} from '@codemirror/commands'
+import {highlightSelectionMatches} from '@codemirror/search'
+import {javascript} from '@codemirror/lang-javascript'
+import {oneDark} from '@codemirror/theme-one-dark'
+
+const {proxy} = getCurrentInstance();
+const {sys_common_status, algo_type, algo_para} = proxy.useDict('sys_common_status', 'algo_type', 'algo_para');
 const algoList = ref([]);
 const open = ref(false);
 const loading = ref(true);
@@ -221,7 +231,7 @@ const activeTabsParaName = ref("lastweek");
 const lastweek_value = ref("");
 const currweek_value = ref("");
 
-const editorContainer  =  ref(null);
+const editorContainer = ref(null);
 let editorView = null;
 const modelValue = ref('');
 const showExpList = ref(false);
@@ -237,70 +247,81 @@ const data = reactive({
     algoPara: null,
   },
   rules: {
+    algoName: [
+      {required: true, message: "算法类名称不能为空", trigger: "blur"}],
+    algoType: [
+      {required: true, message: "算法类别不能为空", trigger: "blur"}
+    ],
+    algoPara: [
+      {required: true, message: "算法参数不能为空", trigger: "blur"}
+    ],
+    algoScript: [
+      {required: true, message: "算法脚本不能为空", trigger: "blur"}
+    ]
   }
 });
 
 const jsCheckResult = ref("未验证"); //脚本验证结果
 
-const { queryParams, form, rules } = toRefs(data);
+const {queryParams, form, rules} = toRefs(data);
 const setItemRef = (el) => {
   if (el) {
     editorContainer.value = el
   }
 }
 
-const handleTabClick=()=>{
+const handleTabClick = () => {
 
 }
 
-const selectDataExp=()=>{
+const selectDataExp = () => {
   //选择数据样例
   //showExpList.value = !showExpList.value;
   //if(showExpList.value) getDataExp();
   //生成随机数据样例
-  let cnt=50;
-  lastweek_value.value = "[" + Array.from({ length: cnt }, () => Math.floor(Math.random() * 1000) + 1) + "]";
-  currweek_value.value = "[" + Array.from({ length: cnt }, () => Math.floor(Math.random() * 1000) + 1) + "]";
+  let cnt = 50;
+  lastweek_value.value = "[" + Array.from({length: cnt}, () => Math.floor(Math.random() * 1000) + 1) + "]";
+  currweek_value.value = "[" + Array.from({length: cnt}, () => Math.floor(Math.random() * 1000) + 1) + "]";
 }
 
-const selecedData=(item)=>{
+const selecedData = (item) => {
   lastweek_value.value = item["currData"];
   currweek_value.value = item["lastData"];
   showExpList.value = false
 }
 
-const checkJS=()=>{
-  let scriptStr=editorView.state.doc.toString();
-  if(scriptStr==''){
+const checkJS = () => {
+  let scriptStr = editorView.state.doc.toString();
+  if (scriptStr == '') {
     proxy.$modal.msgError("算法脚本不能为空！");
     return;
   }
   //lastweek_value
   let paramsStr = "";
-  if(lastweek_value.value==''){
+  if (lastweek_value.value == '') {
     proxy.$modal.msgError("数据样例(一周)不能为空！");
     return;
   }
-  paramsStr = lastweek_value.value.substring(0,1)!='[' ? "'"+lastweek_value.value+"'" : lastweek_value.value;
-  if(form.value.algoPara=="2" && currweek_value.value==''){
+  paramsStr = lastweek_value.value.substring(0, 1) != '[' ? "'" + lastweek_value.value + "'" : lastweek_value.value;
+  if (form.value.algoPara == "2" && currweek_value.value == '') {
     proxy.$modal.msgError("数据样例(两周)不能为空！");
     return;
   }
-  if(form.value.algoPara=="2"){
-    if(currweek_value.value.substring(0,1)!='[')
-      paramsStr += ",'"+currweek_value.value+"'";
+  if (form.value.algoPara == "2") {
+    if (currweek_value.value.substring(0, 1) != '[')
+      paramsStr += ",'" + currweek_value.value + "'";
     else
-      paramsStr += ","+currweek_value.value;
+      paramsStr += "," + currweek_value.value;
   }
-  try{
-    scriptStr = "const nonefun = "+scriptStr+"; nonefun("+paramsStr+")";
+  try {
+    scriptStr = "const nonefun = " + scriptStr + "; nonefun(" + paramsStr + ")";
     var result = eval(scriptStr);
-    jsCheckResult.value=result
-    form.value.algoOk="0";
-  }catch(e){
+    jsCheckResult.value = result
+    form.value.algoOk = "0";
+  } catch (e) {
     console.log(e)
-    form.value.algoOk="1";
-    jsCheckResult.value="验证失败：脚本错误！";
+    form.value.algoOk = "1";
+    jsCheckResult.value = "验证失败：脚本错误！";
   }
 };
 
@@ -327,7 +348,7 @@ const createEditorState = (content) => {
   })
 }
 
-const destroy=() => {
+const destroy = () => {
   if (editorView) {
     editorView.destroy()
     editorView = null
@@ -335,7 +356,7 @@ const destroy=() => {
 }
 
 // 初始化编辑器
- const initEditor = () => {
+const initEditor = () => {
   destroy();
   if (editorContainer.value) {
     editorView = new EditorView({
@@ -355,8 +376,8 @@ function getList() {
   });
 }
 
-function getDataExp(){
-  listData({}).then(res=>{
+function getDataExp() {
+  listData({}).then(res => {
     explist.value = res.rows;
     lastweek_value.value = res.rows[0]["currData"];
     currweek_value.value = res.rows[0]["lastData"];
@@ -411,6 +432,7 @@ function handleSelectionChange(selection) {
 function handleAdd() {
   reset();
   open.value = true;
+  jsCheckResult.value = "未验证";
   title.value = "添加算法管理";
   modelValue.value = '';
   setTimeout(() => {
@@ -436,7 +458,7 @@ function handleUpdate(row) {
 /** 提交按钮 */
 function submitForm() {
   //console.log("====:",editorView.state.doc.toString())
-  if(form.value.algoOk!="0"){
+  if (form.value.algoOk != "0") {
     proxy.$modal.msgError("算法验证失败，不允许保存！");
     return;
   }
@@ -463,12 +485,13 @@ function submitForm() {
 /** 删除按钮操作 */
 function handleDelete(row) {
   const _algoIds = row.algoId || ids.value;
-  proxy.$modal.confirm('是否确认删除算法管理编号为"' + _algoIds + '"的数据项？').then(function() {
+  proxy.$modal.confirm('是否确认删除算法管理编号为"' + _algoIds + '"的数据项？').then(function () {
     return delAlgo(_algoIds);
   }).then(() => {
     getList();
     proxy.$modal.msgSuccess("删除成功");
-  }).catch(() => {});
+  }).catch(() => {
+  });
 }
 
 /** 导出按钮操作 */
@@ -477,25 +500,27 @@ function handleExport() {
     ...queryParams.value
   }, `algo_${new Date().getTime()}.xlsx`)
 }
+
 getList();
 </script>
 <style scoped>
 
-.data_exp_list{
-    position: absolute;
-    z-index: 100;
-    height: 200px;
-    width: 109px;
-    left: 8%;
-    top: 60%;
-    margin-top: -100px;
-    margin-left: -50px;
-    border: 1px solid #f1eded;
-    border-radius: 5px;
-    background-color: #f9f6f6;
-    padding-left: 5px;
-    overflow: auto;
+.data_exp_list {
+  position: absolute;
+  z-index: 100;
+  height: 200px;
+  width: 109px;
+  left: 8%;
+  top: 60%;
+  margin-top: -100px;
+  margin-left: -50px;
+  border: 1px solid #f1eded;
+  border-radius: 5px;
+  background-color: #f9f6f6;
+  padding-left: 5px;
+  overflow: auto;
 }
+
 .triangle-down {
   width: 0;
   height: 0;
@@ -503,6 +528,7 @@ getList();
   border-right: 10px solid transparent;
   border-top: 10px solid #333;
 }
+
 .code-editor {
   border: 1px solid #ccc;
   border-radius: 4px;

src/views/ripa/data/index.vue

@@ -91,7 +91,7 @@
 </template>
 
 <script setup name="Data">
-    import { listData, getData, delData, addData, updateData } from "@/api/biz/data";
+    import { listData, getData, delData, addData, updateData } from "@/api/ripa/data";
 
     const { proxy } = getCurrentInstance();