Merge pull request #7294 from dataease/pr@dev-v2@refactor_template-manage

refactor: 优化模版管理批量操作

core/core-backend/src/main/java/io/dataease/template/service/TemplateManageService.java

@@ -3,6 +3,7 @@ package io.dataease.template.service;
 import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
 import io.dataease.api.template.TemplateManageApi;
 import io.dataease.api.template.dto.TemplateManageDTO;
+import io.dataease.api.template.request.TemplateManageBatchRequest;
 import io.dataease.api.template.request.TemplateManageRequest;
 import io.dataease.api.template.vo.VisualizationTemplateVO;
 import io.dataease.constant.CommonConstants;
@@ -262,4 +263,39 @@ public class TemplateManageService implements TemplateManageApi {
     public List<TemplateManageDTO> findCategories(TemplateManageRequest request) {
         return extTemplateMapper.findCategories(request);
     }
+    @Override
+    public void batchUpdate(TemplateManageBatchRequest request) {
+        request.getTemplateIds().forEach(templateId ->{
+            // 分类映射删除
+            extTemplateMapper.deleteCategoryMapByTemplate(null,templateId);
+            // 插入分类关系
+            request.getCategories().forEach(categoryId -> {
+                VisualizationTemplateCategoryMap categoryMap = new VisualizationTemplateCategoryMap();
+                categoryMap.setId(UUID.randomUUID().toString());
+                categoryMap.setCategoryId(categoryId);
+                categoryMap.setTemplateId(templateId);
+                categoryMapMapper.insert(categoryMap);
+            });
+        });
+    }
+
+    @Override
+    public void batchDelete(TemplateManageBatchRequest request) {
+        request.getTemplateIds().forEach(templateId ->{
+            request.getCategories().forEach(categoryId -> {
+                QueryWrapper<VisualizationTemplateCategoryMap> queryWrapper = new QueryWrapper<>();
+                queryWrapper.eq("template_id", templateId);
+                queryWrapper.eq("category_id", categoryId);
+                categoryMapMapper.delete(queryWrapper);
+                // 如何是最后一个 则实际模版需要删除
+                Long result = extTemplateMapper.checkRepeatTemplateId(categoryId, templateId);
+                if (result == 0) {
+                    templateMapper.deleteById(templateId);
+                }
+            });
+
+        });
+    }
 }
+
+

core/core-frontend/src/api/template.ts

@@ -61,3 +61,17 @@ export function categoryTemplateNameCheck(data) {
     data: data
   })
 }
+
+export function batchDelete(data) {
+  return request.post({
+    url: '/templateManage/batchDelete',
+    data: data
+  })
+}
+
+export function batchUpdate(data) {
+  return request.post({
+    url: '/templateManage/batchUpdate',
+    data: data
+  })
+}

core/core-frontend/src/views/template/component/DeCategoryChange.vue

@@ -0,0 +1,86 @@
+<template>
+  <div class="template-import">
+    <el-form
+      ref="templateImportForm"
+      class="de-form-item"
+      :model="state.templateInfo"
+      :rules="state.templateInfoRules"
+      label-position="top"
+    >
+      <el-form-item :label="'选择分类'" prop="categories" style="margin-top: 16px">
+        <el-select v-model="state.templateInfo.categories" multiple style="width: 100%">
+          <el-option
+            v-for="option in templateCategories"
+            :key="option.id"
+            :label="option.name"
+            :value="option.id"
+          />
+        </el-select>
+      </el-form-item>
+    </el-form>
+    <el-row> </el-row>
+    <el-row class="de-root-class">
+      <el-button secondary @click="cancel()">{{ t('commons.cancel') }}</el-button>
+      <el-button type="primary" @click="saveChange()">{{ t('commons.confirm') }}</el-button>
+    </el-row>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { onMounted, reactive, ref } from 'vue'
+import { useI18n } from '@/hooks/web/useI18n'
+import { batchUpdate } from '@/api/template'
+const emits = defineEmits(['closeBatchEditTemplateDialog', 'refresh'])
+const { t } = useI18n()
+const props = defineProps({
+  templateCategories: {
+    type: Array,
+    required: true
+  },
+  templateIds: {
+    type: Array,
+    required: true
+  }
+})
+
+const state = reactive({
+  templateInfo: {
+    categories: []
+  },
+  categories: [],
+  templateInfoRules: {
+    categories: [
+      {
+        required: true,
+        message: t('commons.input_content'),
+        trigger: 'change'
+      }
+    ]
+  }
+})
+
+onMounted(() => {
+  // showCurrentTemplate(props.pid)
+})
+
+const cancel = () => {
+  emits('closeBatchEditTemplateDialog')
+}
+
+const saveChange = () => {
+  const params = {
+    templateIds: props.templateIds,
+    categories: state.templateInfo.categories
+  }
+  batchUpdate(params).then(rsp => {
+    emits('refresh')
+    emits('closeBatchEditTemplateDialog')
+  })
+}
+</script>
+
+<style scoped lang="less">
+.de-root-class {
+  justify-content: flex-end;
+}
+</style>

core/core-frontend/src/views/template/index.vue

@@ -71,7 +71,7 @@
                 <el-button @click="batchUpdate" type="danger" plain style="margin-left: 24px"
                   >修改分类</el-button
                 >
-                <el-button @click="batchDelete" type="danger" plain>批量删除</el-button>
+                <el-button @click="batchPreDelete" type="danger" plain>批量删除</el-button>
                 <span style="margin-left: 24px; font-size: 14px">已选 {{ batchState }} 项</span>
                 <el-button @click="batchFullSelect" style="margin-left: 16px" text
                   >全选 {{ currentTemplateShowListComputed.length }} 项</el-button
@@ -127,13 +127,58 @@
             @closeEditTemplateDialog="closeEditTemplateDialog"
           />
         </el-dialog>
+
+        <!--导入templateDialog-->
+        <el-dialog
+          :title="state.templateDialog.title"
+          v-model="state.templateDialog.visible"
+          :show-close="true"
+          :destroy-on-close="true"
+          class="de-dialog-form"
+          width="600px"
+        >
+          <de-template-import
+            v-if="state.templateDialog.visible"
+            :pid="state.templateDialog.pid"
+            :template-id="state.templateDialog.templateId"
+            :opt-type="state.templateDialog.optType"
+            :template-categories="state.templateCategories"
+            @refresh="showCurrentTemplate(state.currentTemplateId, state.currentTemplateLabel)"
+            @closeEditTemplateDialog="closeEditTemplateDialog"
+          />
+        </el-dialog>
+
+        <!--导入templateDialog-->
+        <el-dialog
+          :title="'修改分类'"
+          v-model="state.batchOptDialogShow"
+          :show-close="true"
+          :destroy-on-close="true"
+          class="de-dialog-form"
+          width="600px"
+        >
+          <de-category-change
+            v-if="state.batchOptDialogShow"
+            :template-ids="batchTemplateIds"
+            :template-categories="state.templateCategories"
+            @refresh="showCurrentTemplate(state.currentTemplateId, state.currentTemplateLabel)"
+            @closeBatchEditTemplateDialog="closeBatchOptDialog"
+          ></de-category-change>
+        </el-dialog>
       </div>
     </div>
   </div>
 </template>
 
 <script lang="ts" setup>
-import { save, templateDelete, find, findCategories, deleteCategory } from '@/api/template'
+import {
+  save,
+  templateDelete,
+  find,
+  findCategories,
+  deleteCategory,
+  batchDelete
+} from '@/api/template'
 import elementResizeDetectorMaker from 'element-resize-detector'
 import { computed, nextTick, onMounted, reactive, ref } from 'vue'
 import { useI18n } from '@/hooks/web/useI18n'
@@ -145,6 +190,7 @@ const templateListRef = ref(null)
 import NoneImage from '@/assets/none.png'
 import DeTemplateImport from '@/views/template/component/DeTemplateImport.vue'
 import DeTemplateItem from '@/views/template/component/DeTemplateItem.vue'
+import DeCategoryChange from '@/views/template/component/DeCategoryChange.vue'
 
 const roleValidator = (rule, value, callback) => {
   if (nameRepeat(value)) {
@@ -164,6 +210,7 @@ const roleValidator = (rule, value, callback) => {
 }
 
 const state = reactive({
+  batchOptDialogShow: false,
   batchOptList: [],
   templateFilterText: '',
   showShare: false,
@@ -208,11 +255,24 @@ const state = reactive({
 })
 
 const batchUpdate = () => {
-  // do
+  state.batchOptDialogShow = true
 }
 
-const batchDelete = () => {
-  // do
+const batchPreDelete = () => {
+  ElMessageBox.confirm(`确定删除${batchState.value}个模板吗？`, {
+    confirmButtonType: 'danger',
+    type: 'warning',
+    autofocus: false,
+    showClose: false
+  }).then(() => {
+    const params = {
+      templateIds: batchTemplateIds.value,
+      categories: [state.currentTemplateId]
+    }
+    batchDelete(params).then(rsp => {
+      showCurrentTemplate(state.currentTemplateId, state.currentTemplateLabel)
+    })
+  })
 }
 
 const batchFullSelect = () => {
@@ -231,6 +291,10 @@ const batchState = computed(() => {
   return currentTemplateShowListComputed.value.filter(ele => ele.checked).length
 })
 
+const batchTemplateIds = computed(() => {
+  return currentTemplateShowListComputed.value.filter(ele => ele.checked).map(item => item.id)
+})
+
 const currentTemplateShowListComputed = computed(() => {
   if (!state.templateFilterText) return [...state.currentTemplateShowList]
   return state.currentTemplateShowList.filter(ele =>
@@ -423,6 +487,10 @@ const showFirst = () => {
   }
 }
 
+const closeBatchOptDialog = () => {
+  state.batchOptDialogShow = false
+}
+
 const closeEditTemplateDialog = () => {
   state.templateDialog.visible = false
 }

sdk/api/api-base/src/main/java/io/dataease/api/template/TemplateManageApi.java

@@ -1,6 +1,7 @@
 package io.dataease.api.template;
 
 import io.dataease.api.template.dto.TemplateManageDTO;
+import io.dataease.api.template.request.TemplateManageBatchRequest;
 import io.dataease.api.template.request.TemplateManageRequest;
 import io.dataease.api.template.vo.VisualizationTemplateVO;
 import org.springframework.web.bind.annotation.*;
@@ -35,4 +36,10 @@ public interface TemplateManageApi {
     @PostMapping("/categoryTemplateNameCheck")
     String categoryTemplateNameCheck(@RequestBody TemplateManageRequest request);
 
+    @PostMapping("/batchUpdate")
+    void batchUpdate(@RequestBody TemplateManageBatchRequest request);
+
+    @PostMapping("/batchDelete")
+    void batchDelete(@RequestBody TemplateManageBatchRequest request);
+
 }

sdk/api/api-base/src/main/java/io/dataease/api/template/request/TemplateManageBatchRequest.java

@@ -0,0 +1,21 @@
+package io.dataease.api.template.request;
+
+import io.dataease.api.template.vo.VisualizationTemplateVO;
+import lombok.Data;
+
+import java.util.List;
+
+/**
+ * Author: wangjiahao
+ * Description:
+ */
+@Data
+public class TemplateManageBatchRequest {
+
+    private String optType;
+
+    private List<String> templateIds;
+
+    private List<String> categories;
+
+}