feat(基础数据): 页面

src/views/controlPlan/baseConfig/presetData/details.vue

+<template>
+<div class="app-container">
+  <div>
+    <el-form :model="contentData" ref="queryRef" :inline="true" label-width="150px">
+      <el-row :gutter="20">
+        <el-col :span="6">
+          <el-button type="text" @click="$router.go(-1)">返回</el-button>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label="所属填写模板">
+            <span>{{contentData.templateCode}}</span>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label="所属表单">
+            <span>{{contentData.relatedFormName}}</span>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label="备注">
+            <span>{{contentData.remark}}</span>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+  </div>
+  <div>
+    EXCEL
+  </div>
+</div>
+</template>
+<script setup>
+import {getPreset} from "@/api/control/preset.js";
+
+let contentData = reactive({})
+function getContentData(){
+  getPreset(route.query.id).then(res => {
+    contentData = res.data
+  })
+}
+getContentData()
+</script>
+
+<style scoped lang="scss">
+
+</style>

src/views/controlPlan/baseConfig/presetData/index.vue

@@ -68,35 +68,6 @@
           v-hasPermi="['control:preset:add']"
         >新增</el-button>
       </el-col>
-<!--      <el-col :span="1.5">
-        <el-button
-          type="success"
-          plain
-          icon="Edit"
-          :disabled="single"
-          @click="handleUpdate"
-          v-hasPermi="['control:preset:edit']"
-        >修改</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="danger"
-          plain
-          icon="Delete"
-          :disabled="multiple"
-          @click="handleDelete"
-          v-hasPermi="['control:preset:remove']"
-        >删除</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="warning"
-          plain
-          icon="Download"
-          @click="handleExport"
-          v-hasPermi="['control:preset:export']"
-        >导出</el-button>
-      </el-col>-->
       <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
@@ -105,7 +76,11 @@
       <el-table-column label="预置数据编号" align="center" prop="presetDataCode" />
       <el-table-column label="所属填写模板" align="center" prop="relatedTemplateName" />
       <el-table-column label="所属表单" align="center" prop="relatedFormName" />
-      <el-table-column label="数据内容" align="center" prop="" />
+      <el-table-column label="数据内容" align="center" prop="">
+        <template #default="scope">
+         <el-link @click="dataContent(scope.row)" style="color:#398ee5">点击查看详情</el-link>
+        </template>
+      </el-table-column>
       <el-table-column label="备注" align="center" prop="remark" />
       <el-table-column label="更新人" align="center" prop="updateByName" />
       <el-table-column label="更新时间" align="center" prop="updateTime" width="180">
@@ -118,12 +93,10 @@
           <el-button link type="primary"  @click="" v-hasPermi="['control:preset:edit']">下载</el-button>
           <el-button link type="primary"  @click="handleUpdate(scope.row)" v-hasPermi="['control:preset:edit']">上传更新</el-button>
           <el-button link type="primary"  @click="" v-hasPermi="['control:preset:edit']">恢复默认</el-button>
-<!--          <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['control:preset:edit']">修改</el-button>
-          <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['control:preset:remove']">删除</el-button>-->
         </template>
       </el-table-column>
     </el-table>
-    
+
     <pagination
       v-show="total>0"
       :total="total"
@@ -142,25 +115,38 @@
         custom-class="demo-drawer"
     >
       <el-form ref="presetRef" :model="form" :rules="rules" label-width="80px">
-        <el-form-item label="所属模板" prop="relatedTemplateName">
-          <el-input v-model="form.relatedTemplateName" placeholder="请输入所属填写模板" />
+        <el-form-item label="所属模板" prop="relatedTemplateId">
+          <el-select
+              v-model="form.relatedTemplateId"
+              placeholder="请选择所屬模板"
+              clearable
+              style="width: 200px"
+              @change="selectTemplateName">
+            <el-option
+                v-for="item in templateList"
+                :key="item.id"
+                :label="item.templateName"
+                :value="item.id"
+            />
+          </el-select>
         </el-form-item>
-        <el-form-item label="所属表单" prop="relatedFormName">
-          <el-input v-model="form.relatedFormName" placeholder="请输入所属表单" />
+        <el-form-item label="所属表单" prop="relatedFormId">
+          <el-select
+              v-model="form.relatedFormId"
+              placeholder="请选择所屬表单"
+              clearable
+              style="width: 200px">
+            <el-option
+                v-for="item in formList"
+                :key="item.id"
+                :label="item.formName"
+                :value="item.id"
+            />
+          </el-select>
         </el-form-item>
         <el-form-item label="上传文件" prop="file">
-          <el-upload
-              ref="upload"
-              :auto-upload="false"
-              :limit="1"
-              :on-change="handleFileChange"
-              :on-remove="handleFileRemove"
-          >
-            <el-button icon="" type="primary">选择文件</el-button>
-            <template #tip>
-              <div class="el-upload__tip">支持.zip/.xls/.xlsx格式，大小不超过10MB</div>
-            </template>
-          </el-upload>
+          <FileUpload ref="upload" :modelValue="form.file" :limit="1" :fileType="['xls', 'xlsx']" :file-size="30"/>
+          <el-button type="text"  :disabled="form.relatedFormId==''||form.relatedFormId==null" @click="downloadTemplate">点击下载数据内容模板</el-button>
         </el-form-item>
         <el-form-item label="备注" prop="remark">
           <el-input v-model="form.remark" placeholder="请输入所属表单" />
@@ -178,9 +164,18 @@
 
 <script setup name="Preset">
 import { listPreset, getPreset, delPreset, addPreset, updatePreset } from "@/api/control/preset";
-
+import {useRouter} from "vue-router";
+import FileUpload from "@/components/FileUpload/index.vue";
+import {listTemplate, listTemplateForm} from "@/api/system/controlPlan.js";
+function getTemplateList() {
+  listTemplate({ pageNum: 1,
+    pageSize: 10}).then((response) => {
+    templateList.value = response.rows
+  })
+}
+getTemplateList()
 const { proxy } = getCurrentInstance();
-
+const router = useRouter();
 const presetList = ref([]);
 const open = ref(false);
 const loading = ref(true);
@@ -190,7 +185,8 @@ const total = ref(0);
 const title = ref("");
 const file = ref(null);
 const upload = ref(null);
-
+const templateList = ref([]);
+const formList = ref([]);
 const data = reactive({
   form: {},
   queryParams: {
@@ -223,7 +219,11 @@ function getList() {
     loading.value = false;
   });
 }
-
+function selectTemplateName(data) {
+  listTemplateForm(data).then(response => {
+    formList.value = response.data
+  })
+}
 // 取消按钮
 function cancel() {
   open.value = false;
@@ -268,6 +268,15 @@ function handleAdd() {
   title.value = "添加预置数据";
 }
 
+/*查看数据内容*/
+function dataContent(row){
+  router.push({
+    path:"/control/baseConfig/contentData",
+    query: {
+      id:row.id
+    }
+  });
+}
 /** 修改按钮操作 */
 function handleUpdate(row) {
   reset();
@@ -308,15 +317,6 @@ const submitForm = async () => {
     }
   });
 };
-// 文件状态改变时的回调
-const handleFileChange = (uploadFile) => {
-  file.value = uploadFile.raw;
-};
-
-// 文件移除时的回调
-const handleFileRemove = () => {
-  file.value = null;
-};
 /** 删除按钮操作 */
 function handleDelete(row) {
   const _ids = row.id || ids.value;
@@ -336,6 +336,9 @@ function handleExport() {
 }
 
 getList();
+function downloadTemplate(){
+
+}
 </script>
 
 <style scoped lang="scss">
@@ -358,4 +361,4 @@ getList();
   justify-content: flex-end;
   gap: 10px;
 }
-</style>
+</style>
\ No newline at end of file