1.测算表模板管理开发

src/api/tmplAssetCalculate.js

@@ -8,4 +8,16 @@ export function createTmplAssetCalculate(params) {
 // 获取资产测算表的下拉框数据
 export function getDropDownBoxData() {
     return request.get('/tmplAssetCalculate/getDropDownBoxData')
+}
+
+export function getTmplAssetCalculate(params) {
+    return request.get('/tmplAssetCalculate/page', {params : params})
+}
+
+export function getTmplAssetCalculateDetailById(params) {
+    return request.get('tmplAssetCalculate/detail/' + params)
+}
+
+export function deleteCalculate(params) {
+    return request.delete('tmplAssetCalculate/delete/' + params)
 }

src/views/assets/template/mange.vue

@@ -18,43 +18,49 @@
     <el-tabs v-model="activeName" class="condtion-tabs">
       <el-tab-pane label="测算表模板" name="calculate">
         <div class="example-list report-div">
-          <el-card class="report-item no-border" shadow="never">
+          <el-card v-for="item in pageData" class="report-item no-border" shadow="never">
             <div class="report-icon">
               <img src="../../../assets/icons/excel.png" style="width: 52px; height: 52px;" />
             </div>
             <div class="report-text">
-              <span class="report-text-type">测试创建模板202411080937 </span><br />
+              <span class="report-text-type">{{ item.calculateName }}</span><br />
               <span> 文件名： </span>
-              <span class="report-text-name">c4f51695-4a88-4ba5-b307-0955b1cf2d95_TEST03.xlsx
+              <span class="report-text-name">{{ item.fileName }}
               </span><br />
               <span> 存储位置： </span>
-              <span class="report-text-name">assets\templates\calculate\
+              <span class="report-text-name">{{ item.fileUrl }}
               </span><br />
               <div style="margin-top: 5px;">
                 <span>
                   <el-tag style="margin-left: 5px;">
-                    机器设备
+                    {{ item.calculateType }}
                   </el-tag>
                 </span>
                 <span style="float: right; color:darkgrey">
-                  2024-10-16 12:10:09
+                  {{ item.updateTime }}
                 </span>
               </div>
             </div>
-            <div class="report-button" style="margin-left: 20px;">
-              <el-icon>
-                <Delete />
-              </el-icon>
-            </div>
-            <div class="report-button">
+            <el-popconfirm title="确定要删除当前模板?" confirm-button-text="确定" cancel-button-text="取消"
+              @confirm="deleteCalculate(item.id)">
+              <template #reference>
+                <div class="report-button" style="margin-left: 20px;">
+                  <el-icon>
+                    <Delete />
+                  </el-icon>
+                </div>
+              </template>
+            </el-popconfirm>
+            <div class="report-button" @click="getTmplAssetCalculateDetailById(item.id)">
               <el-icon>
                 <View />
               </el-icon>
             </div>
           </el-card>
         </div>
-        <el-pagination background layout="prev, pager, next" style="--el-color-primary: #ff6154" :page-count="100"
-          :page-sizes="[10, 20, 30, 40, 50, 100]" />
+        <el-pagination background layout="prev, pager, next" style="--el-color-primary: #ff6154"
+          v-model:page-count="listQuery.pages" v-model:current-page="listQuery.pageNum"
+          @current-change="getTmplAssetCalculate" />
       </el-tab-pane>
       <el-tab-pane label="报告模板" name="report">
         <div class="example-list report-div">
@@ -62,29 +68,149 @@
         </div>
       </el-tab-pane>
     </el-tabs>
+    <el-dialog v-model="calculateDetailVisible" title="模板详情" width="800">
+      <el-form ref="createCalculateTmpl" :model="calculateDetail" label-width="auto" style="margin-top: 10px;">
+        <el-row :gutter="10">
+          <el-col :span="24">
+            <el-form-item label="测算表名字:" class="form-item" prop="calculateName">
+              <el-input v-model="calculateDetail.calculateName" clearable disabled />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="10">
+          <el-col :span="24">
+            <el-form-item label="模板文件名字:" class="form-item" prop="fileName">
+              <el-input v-model="calculateDetail.fileName" clearable disabled />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="10">
+          <el-col :span="24">
+            <el-form-item label="模板文件存储位置:" class="form-item" prop="fileUrl">
+              <el-input v-model="calculateDetail.fileUrl" clearable disabled />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="10">
+          <el-col :span="24">
+            <el-form-item label="测算类型:" class="form-item" prop="fileUrl">
+              <el-input v-model="calculateDetail.calculateType" clearable disabled />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="10">
+          <el-col :span="24">
+            <el-form-item label="模板code:" class="form-item" prop="fileUrl">
+              <el-input v-model="calculateDetail.tmplCode" clearable disabled />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="10">
+          <el-col :span="24">
+            <el-form-item label="最后更新时间:" class="form-item" prop="fileUrl">
+              <el-input v-model="calculateDetail.updateTime" clearable disabled />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="10" v-if="calculateDetail.hasSection">
+          <el-col :span="24">
+            <el-form-item label="是否有段落模板:" class="form-item" prop="hasSection">
+              <el-radio-group v-model="calculateDetail.hasSection" disabled>
+                <el-radio :value="true">有</el-radio>
+                <el-radio :value="false">无</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="10">
+          <el-col :span="24">
+            <el-card v-for="item in calculateDetail.sectionList" class="report-item no-border" shadow="never">
+              <div class="report-text">
+                <span> 测算表段落模板名称： </span>
+                <span class="report-text-type">{{ item.sectionName }}</span><br />
+                <span> 段落模板文件名字： </span>
+                <span class="report-text-name">{{ item.sectionFileName }}
+                </span><br />
+                <span> 段落模板文件存储位置： </span>
+                <span class="report-text-name">{{ item.sectionFileUrl }}
+                </span><br />
+                <span> 模板code： </span>
+                <span class="report-text-name">{{ item.tmplCode }}
+                </span><br />
+              </div>
+              <div class="report-button" style="margin-left: 20px;">
+                <el-icon>
+                  <Delete />
+                </el-icon>
+              </div>
+            </el-card>
+          </el-col>
+        </el-row>
+      </el-form>
+    </el-dialog>
   </div>
 </template>
 
 <script>
+import { getTmplAssetCalculate, getTmplAssetCalculateDetailById, deleteCalculate } from '@/api/tmplAssetCalculate';
 export default {
   name: 'assetsTmplMange',
   data() {
     return {
       msg: 0,
       folderName: null,
-      activeName: 'calculate'
+      activeName: 'calculate',
+      listQuery: {
+        pageNum: 1,
+        pageSize: 5,
+        pages: 1
+      },
+      pageData: {
+
+      },
+      calculateDetail: null,
+      calculateDetailVisible: false
     }
   },
 
   created() {
-
+    this.getTmplAssetCalculate();
   },
   methods: {
     goCreateCalculateTmpl() {
       this.$router.push('/home/assets/template/create/calculate')
     },
-    nextFolder() {
-
+    // 获取模板列表
+    getTmplAssetCalculate() {
+      getTmplAssetCalculate(this.listQuery).then(res => {
+        this.listQuery.pages = res.data.pages
+        this.pageData = res.data.list;
+      })
+    },
+    openCalculateDetail(id) {
+      this.getTmplAssetCalculateDetailById(id);
+    },
+    // 获取列表详细信息
+    getTmplAssetCalculateDetailById(id) {
+      getTmplAssetCalculateDetailById(id).then(res => {
+        if (res.code == 200) {
+          this.calculateDetailVisible = true;
+          this.calculateDetail = res.data;
+        }
+      })
+    },
+    // 删除测算表模板
+    deleteCalculate(id) {
+      deleteCalculate(id).then(res => {
+        if (res.code == 200) {
+          this.getTmplAssetCalculate();
+          ElMessage({
+            showClose: true,
+            message: res.message,
+            type: 'success'
+          })
+        }
+      })
     }
   }
 }
@@ -126,7 +252,7 @@ export default {
 }
 
 .report-div {
-  min-height: 600px;
+  min-height: 800px;
 }
 
 :deep(.el-tabs__active-bar) {