颜色 优化

src/services/ConfigService.ts

@@ -149,8 +149,8 @@ class ConfigService{
      * 
      * @returns 获取模板查询条件 配置项数据(颜色、国家、季节)
      */
-    static async GetTemplateQueryAsync():Promise<HttpResponse>{
-        return Api.Post("triptemplate_GetTemplateConfigData",{})
+    static async GetTemplateQueryAsync(params:any):Promise<HttpResponse>{
+        return Api.Post("triptemplate_GetTemplateConfigData",params)
     }
 
     /**

src/views/TemplateCenter/colour.vue

 <template>
     <div class="row items-center flex-between q-mb-lg">
       <div class="row items-center shrink q-pr-md marketTagDown marketTagDown">
-          <div class="MarketButton cursor-pointer" 
+          <!-- <div class="MarketButton cursor-pointer" 
           :class="[datas.type == x.Id?'active':'']" v-for="(x,index) in datas.colorType" :key="index"
           @click="datas.type=x.Id,search()">
               {{x.Name}}
-      </div>
+      </div> -->
         <!-- <span class="fz14 q-pr-sm shrink">&nbsp;&nbsp;列表类型:</span>
         <el-select v-model="datas.type" 
             class="ml-1 shrink TemSel"
@@ -29,21 +29,27 @@
         </template>
       </el-input>
       <div class="row">
-        <el-button type="primary" size="default" style="color: #ffff;" @click="addColour">
-          新增颜色{{datas.type==2?'分类':''}}
+        <el-button type="primary" size="default" style="color: #ffff;" @click="addColour(1)">
+          新增颜色
+        </el-button>
+        <el-button type="primary" size="default" style="color: #ffff;" @click="addColour(2)">
+          新增分类
         </el-button>
-        <el-button v-if="datas.type==1" class="q-pl-md" type="primary" size="default" style="color: #ffff;" @click="BatchSetting">
-          批量设置
+        <el-button class="q-pl-md" type="primary" size="default" style="color: #ffff;" @click="BatchSetting">
+          设置分类
         </el-button>
       </div>
     </div>
     <el-table v-loading="loading" ref="dataTableRef" highlight-current-row 
     v-load-more="tableScrollHandler" :data="dataList" class="tableHBEbeef5 col" height="82vh"
-    @selection-change="handleSelectionChange">
-    <el-table-column type="selection" width="55" v-if="datas.type==1"/>
-    <el-table-column v-if="datas.type==1" label="颜色分类">
+    @selection-change="handleSelectionChange"
+    row-key="ID"
+    :tree-props="{ children: 'ChildList', hasChildren: 'hasChildren' }">
+    <el-table-column type="selection" width="55"
+    :selectable="selectable" :reserve-selection="true"/>
+    <el-table-column label="颜色分类">
         <template #default="scope">
-          {{scope.row.ColorName?scope.row.ColorName:'不限'}}
+          {{scope.row.ColorName?scope.row.ColorName:''}}
         </template>
       </el-table-column>
       <el-table-column :label="datas.type==1?'颜色名称':'名称'">
@@ -54,11 +60,11 @@
       <el-table-column label="色值">
         <template #default="scope">
             <el-tag
-            :color="scope.row.Content"
+            :color="scope.row.ColorValue"
             effect="dark" class="q-mr-md">
             &nbsp;
             </el-tag>
-          {{scope.row.Content}}
+          {{scope.row.ColorValue}}
         </template>
       </el-table-column>
       <el-table-column label="操作" width="130">
@@ -74,7 +80,7 @@
     :close-on-click-modal="false" style="width: 373px;" 
     class="small-padding" @close="close">
         <template #header>
-            <div class="text-title text-center fz16 PingFangSC">{{datas.params.ID?'编辑':'新增'}}颜色{{datas.type==2?'分类':''}}</div>
+            <div class="text-title text-center fz16 PingFangSC">{{datas.params.ID?'编辑':'新增'}}{{datas.type==2?'分类':'颜色'}}</div>
         </template>
         <div class="addTemplateBox q-mb-lg fz14">
           <div v-if="datas.type==1" class="addTemplateInput q-mt-xs q-mb-lg row items-center">
@@ -83,19 +89,20 @@
               style="width: 260px;"
               class="ml-1"
               placeholder="请选择颜色分类" clearable>
-                  <el-option :key="Number(0)" label="不限" :value="Number(0)"/>
+                  <el-option key="" label="不限" value=""/>
                   <el-option
                       v-for="item in ColorList"
                       :key="item.ID"
                       :label="`${item.Name}`"
                       :value="item.ID"
+                      :disabled="setColorDisabled(item.ID)"
                   />
             </el-select>
           </div>
           <div class="addTemplateInput q-mt-xs q-mb-lg row items-center">
               <span class="q-pr-md shrink">{{datas.type==1?'':'分类'}}名称：</span>
               <el-input min="750" v-model="datas.params.Name"
-              :placeholder="datas.type==1?'请输入颜色名称':'请输入颜色分类名称'" class=""></el-input>
+              :placeholder="datas.type==1?'请输入颜色名称':'请输入分类名称'" class=""></el-input>
           </div>
           <div class="addTemplateInput q-mt-xs q-mb-lg row items-center">
             <span class="q-pr-md shrink">色值：</span>
@@ -136,7 +143,7 @@
           <div class="addTemplateInput q-mt-xs q-mb-lg">
             <template v-for="(x,index) in multipleSelection">
               <el-tag
-                :color="x.Content"
+                :color="x.ColorValue"
                 effect="dark" class="q-mr-xs w10">
                 &nbsp;
               </el-tag>
@@ -154,22 +161,10 @@
                       :key="item.ID"
                       :label="`${item.Name}`"
                       :value="item.ID"
+                      :disabled="setColorDisabled(item.ID)"
                   />
             </el-select>
           </div>
-          <!-- <div class="addTemplateInput q-mt-xs q-mb-lg row items-center">
-              <span class="q-pr-md shrink">名称：</span>
-              <el-input min="750" v-model="datas.params.Name"
-              placeholder="请输入颜色名称" class=""></el-input>
-          </div>
-          <div class="addTemplateInput q-mt-xs q-mb-lg row items-center">
-            <span class="q-pr-md shrink">色值：</span>
-            <el-input min="750" v-model="datas.params.Content"
-            placeholder="例子:#e5e3da" class=""></el-input>
-            <div class="q-pl-sm">
-                <el-color-picker v-model="datas.params.Content" />
-            </div>
-         </div> -->
        </div>
         <div class="text-center">
           <el-button class="MarketIndexButtom MarketRec" type="primary" @click="ConfirmCreation(1)"
@@ -207,11 +202,11 @@
     const enTheme = ENT_USER_THEME
   
     const dataList = ref([] as Array < any > );
-    const RawDataList =  ref([] as Array < any > );
+    const DataListAll =  ref([] as Array < any > );
     const loading = ref(false as any)
     const deleteLoading = ref<any>(null)
     const queryObj = reactive({
-      DictKey: 'Trip_Template_Color',
+      // DictKey: 'Trip_Template_Color',
       Name: ''
     })
     const dataTableRef = ref()
@@ -248,6 +243,25 @@
     const ColorList = ref([])
     const multipleSelection = ref([])
 
+    const setColorDisabled = (ID:number) => {
+      if(datas.addEditVisible) {
+        if(datas.params.Code==ID) return true
+        else false
+      }
+      if(datas.DominantColour) {
+        for(let i=0;i<multipleSelection.value.length;i++){
+          if(multipleSelection.value[i].ID==ID) return true
+          else false
+        }
+      }
+    }
+    const selectable = (row:Object, index:Number)=> {
+      if (row.ChildList&&row.ChildList.length>0) {
+        return false;
+      } else {
+        return true;
+      }
+    }
     const handleSelectionChange = (val: any) =>{
       multipleSelection.value = val
       datas.paramsParent.ColorList = val.length>0? val.map(x=> {return x.ID}) : 0
@@ -282,12 +296,23 @@
         await addEditColor()
       }
     }
+    const toggleSelection = (rows:any) => {
+        if (rows) {
+          rows.forEach(row => {
+            dataTableRef.value.toggleRowSelection(row);
+          });
+        } else {
+          dataTableRef.value.clearSelection();
+        }
+        getColor()
+    }
     const setColour = async () => {
       datas.requestLoading = true
       const result = await LineService.BatchSetColor(datas.paramsParent)
       if(result.data.resultCode==1){
         datas.DominantColour = false
         datas.requestLoading = false
+        toggleSelection()
         querySearchHandler()
       }else{
           ElMessage({
@@ -326,6 +351,7 @@
       if(result.data.resultCode==1){
         datas.addEditVisible = false
         datas.requestLoading = false
+        toggleSelection()
         querySearchHandler()
       }else{
           ElMessage({
@@ -335,7 +361,8 @@
           datas.requestLoading = false
       }
     }
-    const addColour = () => {
+    const addColour = (Id:number) => {
+      datas.type = Id
       datas.addEditVisible = true
     }
     const editDelete = (item: Object,index: Number) => {
@@ -344,6 +371,9 @@
       }else{
         datas.params = JSON.parse(JSON.stringify(item))
         datas.params.Code = item.Code?Number(item.Code):''
+        datas.params.Content = item.ColorValue
+        datas.type = item.ChildList&&item.ChildList.length>0?2:1
+        if(datas.type==2||(datas.type==1&&!datas.params.Name))datas.params.Name = item.ColorName
         datas.addEditVisible = true
       }
     }
@@ -366,7 +396,7 @@
               })
               let dataRes = await LineService.RemoveTemplateConfigData(item.ID)
               if (dataRes.data.resultCode == 1) {
-                  queryObj.pageIndex = 1
+                  // queryObj.pageIndex = 1
                   ElMessage({
                       showClose: true,
                       message: `删除${item.Content}成功`,
@@ -391,48 +421,30 @@
     }
   
     const tableScrollHandler = ()=>{
-      if(queryObj.pageCount>queryObj.pageIndex){
-          queryObj.value.pageIndex++
-          refreshHandler()
-      }
+      // if(queryObj.pageCount>queryObj.pageIndex){
+      //     queryObj.value.pageIndex++
+      //     refreshHandler()
+      // }
     }
     const search = () => {
-      queryObj.pageIndex = 1
+      // queryObj.pageIndex = 1
       querySearchHandler()
     }
   
     const querySearchHandler = async () => {
       loading.value = true
       try {
-          let pageRes = await LineService.GetTemplateConfigDataList(queryObj);
-          // if(datas.type==1) pageRes = await LineService.GetTemplateConfigDataList(queryObj);
-          // else pageRes = await LineService.GetParentColor(queryColor.value);
-          if (pageRes.data.resultCode == 1) {
+          let response = await ConfigService.GetTemplateQueryAsync(queryObj)
+          if (response.data.resultCode == 1) {
             let arrList = function(list){
               list.forEach(x=>{
-                x.ColorName = ''
+                x.Content = ''
               })
             }
-            arrList(pageRes.data.data)
-            if(datas.type==1) {
-              dataList.value = pageRes.data.data.filter(x=>{
-                return x.Code
-              })
-            }
-            else {
-              dataList.value = pageRes.data.data.filter(x=>{
-                return !x.Code
-              })
-            }
-            for(let i=0;i<dataList.value.length;i++){
-              let Color = ColorList.value.filter(x=>{
-                if(datas.type==1) return x.ID==Number(dataList.value[i].Code)
-                else return x.ID==Number(dataList.value[i].ID)
-              })
-              if(Color.length>0) {
-                dataList.value[i].ColorName = Color[0].Name
-              }
-            }
+            arrList(response.data.data.ColorList)
+            DataListAll.value = response.data.data.ColorList
+            dataList.value = response.data.data.ColorList
+            // ColorList.value = response.data.data.ColorList
           }
           loading.value = false
       } catch (error) {