From 674d8b3d82d6d470cd35849b3392d469014dccd0 Mon Sep 17 00:00:00 2001
From: lion <120344285@qq.com>
Date: Sun, 27 Apr 2025 14:18:02 +0800
Subject: [PATCH] family

---
 src/views/product/components/addFamily.vue | 111 +++++++++++++++++++--
 src/views/product/components/addPhase.vue  |  12 +--
 src/views/product/phase.vue                |  30 +++---
 3 files changed, 124 insertions(+), 29 deletions(-)

diff --git a/src/views/product/components/addFamily.vue b/src/views/product/components/addFamily.vue
index 1e8857c..c2e908c 100644
--- a/src/views/product/components/addFamily.vue
+++ b/src/views/product/components/addFamily.vue
@@ -49,6 +49,48 @@
             </el-upload>
           </div>
         </div>
+      </template>
+      <template v-slot:family_product_lines>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label" style="font-weight: bold">
+            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>Product Lines：
+          </div>
+          <div class="xy-table-item-content">
+            <el-button type="primary" style="margin-bottom:10px" size="small" @click="addRow">Add</el-button>
+            <xy-table style="width:850px" :list="form.family_product_lines" :isPage="false" :height="350"
+              :table-item="detail_item">
+              <template v-slot:product_category_id>
+                <el-table-column align='left' label="Product Line" width="340">
+                  <template slot-scope="scope">
+                    <el-select style="width:100%" @change="(e)=>{changeKey(e,scope.row)}" v-model="scope.row.product_category_id"
+                      placeholder="Please Select">
+                      <el-option v-for="(pvalue,index) in productPhaseList" :key="index" :label="pvalue.name"
+                        :value="pvalue.id">
+                      </el-option>
+                    </el-select>
+                  </template>
+                </el-table-column>
+              </template>
+             <template v-slot:sort>
+                <el-table-column align='left' label="Sort" width="340">
+                  <template slot-scope="scope">
+                    <el-input placeholder="Please Input" style="width:100%" v-model="scope.row.sort"></el-input>
+                  </template>
+                </el-table-column>
+              </template>
+              <template v-slot:btns>
+                <el-table-column align='center' label="operate" width="120" header-align="center">
+                  <template slot-scope="scope">
+                    <el-popconfirm confirm-button-text="confirm" cancel-button-text="cancel" style="margin:0 10px"
+                      @confirm="delRow(scope.$index)" title="Are you sure to delete it?">
+                      <el-button type="danger" size="small" slot="reference">delete</el-button>
+                    </el-popconfirm>
+                  </template>
+                </el-table-column>
+              </template>
+            </xy-table>
+          </div>
+        </div>
       </template>
       <template v-slot:description>
         <div class="xy-table-item">
@@ -82,7 +124,11 @@
   import {
     save,
     show
-  } from "@/api/family"
+  } from "@/api/family"
+  import {
+    index,
+    destroy
+  } from "@/api/product/category.js"
   import {
     getToken
   } from '@/utils/auth'
@@ -101,13 +147,29 @@
         },
         showWang: false,
         action: `${process.env.VUE_APP_UPLOAD_API}`,
-        pictureList: [],
+        pictureList: [],
+        productPhaseList:[],
+        detail_item: [{
+          type: 'index',
+          width: 50,
+        }, {
+          prop: 'product_category_id',
+          label: 'Product Line',
+          align: 'left',
+          width: 620
+        }, {
+          prop: 'sort',
+          label: 'Sort',
+          align: 'left',
+          width: 620
+        }],
         form: {
           title: '',
           sort: 0,
           is_visible: 1,
 
-          file_ids: [],
+          file_ids: [],
+          family_product_lines:[],
           description: '',
           content: ''
         },
@@ -120,9 +182,22 @@
       }
     },
     created() {
-      this.uploadOther.token = getToken();
+      this.uploadOther.token = getToken();
+      this.getList()
     },
-    methods: {
+    methods: {
+      async getList() {
+        const res = await index({
+          page_size: 999,
+          page: 1,
+          type:2,
+          sort_type: 'asc',
+          sort_name: 'sort',
+          is_visible: 1,
+          // family_id:this.select.family_id
+        })
+        this.productPhaseList = res.data
+      },
       handleRemoveP(file, fileList) {
         this.pictureList = fileList
       },
@@ -137,6 +212,18 @@
 
       changeEditor(e, type) {
         this.form[type] = e
+      },
+      addRow() {
+        this.form.family_product_lines.push({
+          product_category_id: '',
+          sort: 0
+        })
+      },
+      delRow(index) {
+        this.form.family_product_lines.splice(index, 1)
+      },
+      changeKey(e, row) {
+        console.log(e,row)
       },
       submit() {
         if (this.id) {
@@ -174,11 +261,17 @@
       getDetail() {
         show({
           id: this.id,
-          // show_relation: ['picture'],
+          show_relation: ['familyProductLines'],
         }).then(res => {
           this.form = this.base.requestToForm(res, this.form)
           this.form.description = res.description ? res.description : ''
-          this.form.content = res.content ? res.content : ''
+          this.form.content = res.content ? res.content : ''
+          this.form.family_product_lines = res.family_product_lines?res.family_product_lines:[]
+          if(this.form.family_product_lines.length>0){
+            this.form.family_product_lines.sort((a,b)=>{
+              return a.sort - b.sort
+            })
+          }
           this.form.is_visible = res.is_visible ? res.is_visible : 0
           this.form.sort = res.sort ? res.sort : 0
           this.showWang = true
@@ -213,8 +306,8 @@
             title: '',
             sort: 0,
             is_visible: 1,
-
-            file_ids: '',
+            file_ids: [],
+            family_product_lines:[],
             description: '',
             content: ''
           }
diff --git a/src/views/product/components/addPhase.vue b/src/views/product/components/addPhase.vue
index bcdab71..686ff50 100644
--- a/src/views/product/components/addPhase.vue
+++ b/src/views/product/components/addPhase.vue
@@ -2,7 +2,7 @@
   <div>
     <xy-dialog ref="dialog" :width="60" :is-show.sync="isShow" :type="'form'" :title="$route.meta.title" :form="form"
       :rules='rules' @submit="submit">
-      <template v-slot:family_ids>
+      <!-- <template v-slot:family_ids>
         <div class="xy-table-item">
           <div class="xy-table-item-label" style="font-weight: bold">
             <span style="color: red;font-weight: bold;padding-right: 4px;"></span>Product Family：
@@ -14,7 +14,7 @@
             </el-select>
           </div>
         </div>
-      </template>
+      </template> -->
       <template v-slot:product_category_links_by_sub>
         <div class="xy-table-item">
           <div class="xy-table-item-label" style="font-weight: bold">
@@ -440,7 +440,7 @@
           width: 340
         }],
         form: {
-          family_ids:[],
+          // family_ids:[],
           product_category_links_by_sub: [],
           name: '',
           time:'',
@@ -834,7 +834,7 @@
           show_relation: ['productCategoryApplications', 'picture'],
         }).then(res => {
           this.form = this.base.requestToForm(res, this.form)
-          this.form.family_ids = res.family_ids?res.family_ids:[]
+          // this.form.family_ids = res.family_ids?res.family_ids:[]
           this.form.description = res.description ? res.description : ''
           this.form.introduction = res.introduction ? res.introduction : ''
 
@@ -954,7 +954,7 @@
           this.showProgress = false
           this.uploadProgress = 0
           this.form = {
-            family_ids:[],
+            // family_ids:[],
             product_category_links_by_sub: [],
             name: '',
             time:'',
@@ -996,7 +996,7 @@
   ::v-deep .application_note_desc,
   ::v-deep .packing,
   ::v-deep .character,
-  ::v-deep .family_ids
+  // ::v-deep .family_ids
   {
   flex-basis: 100%;
   }
diff --git a/src/views/product/phase.vue b/src/views/product/phase.vue
index 4609eeb..6dc762a 100644
--- a/src/views/product/phase.vue
+++ b/src/views/product/phase.vue
@@ -9,12 +9,12 @@
               <div>
                 <el-input v-model="select.name" placeholder="Name"></el-input>
               </div>
-              <div>
+              <!-- <div>
                 <el-select clearable style="width:100%" v-model="select.family_id" placeholder="Product Family">
                   <el-option v-for="item in familyList" :key="item.id" :label="item.title" :value="item.id">
                   </el-option>
                 </el-select>
-              </div>
+              </div> -->
               <div>
                 <el-select clearable style="width:100%" v-model="select.is_recommend" placeholder="Recommend">
                   <el-option :key="1" label="Yes" :value="1">
@@ -49,7 +49,7 @@
     <div>
       <xy-table :list="list"  :total="total" @pageIndexChange="pageIndexChange"
       @pageSizeChange="pageSizeChange" :table-item="table_item">
-      <template v-slot:family_ids>
+      <!-- <template v-slot:family_ids>
         <el-table-column align='left' label="Product Family" width="160" header-align="left">
           <template slot-scope="scope">
             <div v-if="scope.row.family.length>0">
@@ -58,7 +58,7 @@
             <div v-else></div>
           </template>
         </el-table-column>
-      </template>
+      </template> -->
         <template v-slot:product_category_links_by_sub>
           <el-table-column align='left' label="Product Category" width="360" header-align="left">
             <template slot-scope="scope">
@@ -104,7 +104,7 @@
       return {
         select: {
           name: '',
-          family_id:'',
+          // family_id:'',
           is_recommend:'',
           is_visible:'',
           type:2,
@@ -118,12 +118,14 @@
           type: 'index',
           align: 'center',
           width: 50
-        }, {
-          prop: 'family_ids',
-          label: 'Product Family',
-          align: 'left',
-          width:120,
-        }, {
+        },
+        // {
+        //   prop: 'family_ids',
+        //   label: 'Product Family',
+        //   align: 'left',
+        //   width:120,
+        // },
+        {
           prop: 'product_category_links_by_sub',
           label: 'Product Category',
           align: 'left',
@@ -162,7 +164,7 @@
       }
     },
     created() {
-      this.getFamilyList()
+      // this.getFamilyList()
       this.getList()
     },
     methods: {
@@ -202,7 +204,7 @@
           name:this.select.name,
           is_recommend:this.select.is_recommend,
           is_visible:this.select.is_visible,
-          family_id:this.select.family_id
+          // family_id:this.select.family_id
         })
         this.list = res.data
         this.total = res.total
@@ -212,7 +214,7 @@
         this.select.name = ''
         this.select.is_recommend = ''
         this.select.is_visible=''
-        this.select.family_id = ''
+        // this.select.family_id = ''
         this.select.type = 2
         this.getList()
       },