更新后台

src/views/backOfficeSystem/ResearchJudgment/MoralAnalysis/components/editAddForm.vue

@@ -1,124 +1,82 @@
 <template>
   <div class="dialog" v-if="dialogForm">
     <div class="head_box">
-      <span class="title">情报语义分析{{ title }}</span>
+      <span class="title">情报语义分析{{ title }} </span>
       <div>
-        <el-button type="primary" v-if="title != '详情'" size="small" :loading="loading" @click="submit">保存</el-button>
+        <el-button type="primary" size="small" :loading="loading" @click="submit" >保存</el-button>
         <el-button size="small" @click="close">关闭</el-button>
       </div>
     </div>
-    <div class="cntinfo">
-      <el-form :model="listQuery" ref="elform" :label-width="120" label-position="right">
-        <div class="form-row">
-          <el-form-item label="语义名称">
-            <el-input v-model="listQuery.yymc" placeholder="请输入语义名称"/>
-          </el-form-item>
-          <el-form-item label="要素类型">
-            <el-input v-model="listQuery.ddwplb" placeholder="请输入要素类型"/>
-          </el-form-item>
-          <el-form-item label="要素名称">
-            <el-input v-model="listQuery.ysmc" placeholder="请输入要素名称"/>
-          </el-form-item>
-        </div>
-        <div class="form-row">
-          <el-form-item label="要素描述">
-            <el-input v-model="listQuery.ysms" type="textarea" rows="3" placeholder="要素描述"/>
-          </el-form-item>
-        </div>
-      </el-form>
+    <div class="form_cnt">
+      <FormMessage :formList="formData" ref="elform" :rules="rules"></FormMessage>
     </div>
   </div>
 </template>
 
 <script setup>
-import { ref, reactive } from 'vue';
-const elform = ref();
-const dialogForm = ref(false);
-const listQuery = ref({
-  plateImages: [
-    {img:require('@/assets/images/person.png')},
-    {img:require('@/assets/images/person.png')},
-    {img:require('@/assets/images/person.png')},
-  ]
+import FormMessage from '@/components/aboutTable/FormMessage.vue'
+import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
+import * as rule from "@/utils/rules.js";
+import { ref, defineExpose, reactive, onMounted, defineEmits, getCurrentInstance, nextTick } from "vue";
+const emit = defineEmits(["updateDate"]);
+const props = defineProps({
+  dic: Object
 });
-const title = ref('');
-
+const { proxy } = getCurrentInstance();
+const dialogForm = ref(false); //弹窗
+const formData = ref([
+  { label: "语义名称", prop: "bqmc", type: "input", },
+  { label: "要素类型", prop: "sfbqdl",  type: "select", options: []  },
+  { label: "要素名称", prop: "sfbqxl",  type: "input", options: []  },
+  { label: "要素描述", prop: "ysms",  type: "textarea", width: "100%"  },
+]);
+const listQuery = ref({
+  sfbqdj: []
+}); //表单
+const loading = ref(false);
+const elform = ref();
+const title = ref("");
+const rules = reactive({
+  bqmc: [{ required: true, message: "请输入标签名称", trigger: "blur" }]
+});
+const editpeo = ref();
+onMounted(() => {});
 // 初始化数据
-const init = (type, row) => {
+const init = (type, row,) => {
   dialogForm.value = true;
-  title.value = '新增'
-  if(row){
-    title.value = type == 'edit' ? '编辑' :'详情';
-  }
-  // 根据type和row初始化表单数据
+  title.value = type == 'add' ? "新增" : "编辑";
+  if (row) getDataById(row.id);
+};
+// 根据id查询详情
+const getDataById = (id) => {
+  // qcckGet({}, '/mosty-gsxt/tbGsxtBqgl/'+id).then((res) => {
+  //   listQuery.value = res;
+  // });
 };
-
 
 // 提交
-const submit = ()=>{
-  elform.value.validate((valid) => {
-    if (!valid) return false;
-    // loading.value = true;
-    let params = { ...listQuery.value}
-    let url = title.value == '新增' ? '/mosty-lzcj/tbDwYy/insert' :'/mosty-lzcj/tbDwYy/update'
+const submit = () => {
+  elform.value.submit((data)=>{
+    // let url =  title.value == "新增" ? '/mosty-gsxt/tbGsxtBqgl/save':'/mosty-gsxt/tbGsxtBqgl/update';
+    // let params = { ...data }
     // qcckPost(params, url).then((res) => {
-    //   proxy.$message({ type: "success", message: title.value+'成功'});
-    //   close()
-    //   emit("updateDate",modelLx.value);
-    // }).catch(()=>{
-    //   loading.value = false;
-    // });
+    //   proxy.$message({ type: "success", message: title.value + "成功" });
+    //   emit("updateDate");
+    //   close();
+    // }).catch(() => {});
   });
-}
-
-const close = () => {
-  dialogForm.value = false;
 };
 
-defineExpose({init})
+// 关闭
+const close = () => {
+  listQuery.value = {};
+  dialogForm.value = false;
+  loading.value = false;
+};
+defineExpose({ init });
 </script>
 
 <style lang="scss" scoped>
-.dialog {
-  padding: 20px;
-
-  .head_box {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    margin-bottom: 20px;
-  }
-  .cntinfo{
-    height: calc(100% - 70px);
-    overflow: hidden;
-    overflow-y: auto;
-  }
-
-  .form-row {
-    display: flex;
-    
-    .el-form-item {
-      flex: 1;
-    }
-  }
-  .image-group {
-    display: flex;
-    gap: 10px;
-    flex-wrap: wrap;
-  
-    
-    .image-item {
-      width: 150px;
-      height: 150px;
-      border: 1px solid #dcdfe6;
-      
-      .el-image {
-        width: 100%;
-        height: 100%;
-      }
-    }
-  }
-
-}
-
+@import "~@/assets/css/layout.scss";
+@import "~@/assets/css/element-plus.scss";
 </style>