图片字段改为 序列化数组

src/components/SelectionPath.vue

@@ -6,7 +6,7 @@
     </el-option>
     <el-option v-for="item in categoryListArr" :key="item.id" :label="item.name" :value="item.path">
       <el-avatar v-if="item.photo != ''" class="vm" shape="square" :size="25"
-        :src="$store.state.settings.host + '/Data/UploadFiles/category/' + item.photo">
+        :src="item.photo[0]">
       </el-avatar>
       <el-avatar v-else :size="25" class="vm" shape="square" icon="iconfont icon-tuxiang"></el-avatar>
       <span v-for="element in item.pathLen" :key="element" class="m-l-30"></span>

src/settings.js

@@ -1,4 +1,9 @@
-module.exports = {
+const host = 'https://www.szdot.top'
+const baseURL = host + '/flycube.php'
+const listPath = host + '/Data/UploadFiles/category/'
+const spuPath = host + '/Data/UploadFiles/spu/'
+const skuPath = host + '/Data/UploadFiles/sku/'
+export default {
 
   /**
    * @description: 全局title
@@ -13,8 +18,11 @@ module.exports = {
    * api小程序后台接口路径
    * api登录接口路径
    */
-  host: 'https://szdot.top',
+  host: host,
-  baseURL: 'https://szdot.top/flycube.php',
+  baseURL: baseURL,
+  listPath: listPath,
+  spuPath: spuPath,
+  skuPath: skuPath,
   apiPlanePath: '/mpApi/Plane/',
   apiAdminPath: '/mpApi/Admin/',
   apiLoginPath: '/mpApi/Login/',

src/store/index.js

@@ -205,7 +205,6 @@ const store = new Vuex.Store({
      * @return {*} 服务器返回值
      */
     async fetchSaveAdmin ({ dispatch }, form) {
-      console.log(form)
       const params = new URLSearchParams()
       params.append('id', form.id)
       params.append('shop_id', form.shop_id)
@@ -558,6 +557,12 @@ const store = new Vuex.Store({
     async fetchCategoryList ({ commit }) {
       const res = await api.get('getCategoryList', 'Admin')
       if (res.data.status === 1) {
+        res.data.categoryList.forEach((category, index) => {
+          category.photo = JSON.parse(category.photo)// 反序列化 photo字段
+          category.photo.forEach((photo, i) => {
+            res.data.categoryList[index].photo[i] = settings.state.listPath + photo // 把绝对路径加上
+          })
+        })
         commit('setCategoryList', res.data.categoryList)
       } else {
         commit('setCategoryList', [])
@@ -637,6 +642,12 @@ const store = new Vuex.Store({
     async fetchSpuList ({ commit }) {
       const res = await api.get('getSpuList', 'Admin')
       if (res.data.status === 1) {
+        res.data.spuList.forEach((spu, index) => {
+          spu.photo = JSON.parse(spu.photo)// 反序列化 photo字段
+          spu.photo.forEach((photo, i) => {
+            res.data.spuList[index].photo[i] = settings.state.spuPath + photo // 把绝对路径加上
+          })
+        })
         commit('setSpuList', res.data.spuList)
       } else {
         commit('setSpuList', [])
@@ -804,6 +815,12 @@ const store = new Vuex.Store({
     async fetchSkuList ({ commit }) {
       const res = await api.get('getSkuList', 'Admin')
       if (res.data.status === 1) {
+        res.data.skuList.forEach((sku, index) => {
+          sku.photo = JSON.parse(sku.photo)// 反序列化 photo字段
+          sku.photo.forEach((photo, i) => {
+            res.data.skuList[index].photo[i] = settings.state.skuPath + photo // 把绝对路径加上
+          })
+        })
         commit('setSkuList', res.data.skuList)
       } else {
         commit('setSkuList', [])

src/store/modules/settings.js

@@ -4,6 +4,9 @@ const {
   title,
   host,
   baseURL,
+  listPath,
+  spuPath,
+  skuPath,
   apiPlanePath,
   apiAdminPath,
   apiLoginPath,
@@ -17,6 +20,9 @@ const state = {
   title: title,
   host: host,
   baseURL: baseURL,
+  listPath: listPath,
+  spuPath: spuPath,
+  skuPath: skuPath,
   apiPlanePath: apiPlanePath,
   apiAdminPath: apiAdminPath,
   apiLoginPath: apiLoginPath,

src/views/layout/components/main/category/index.vue

@@ -73,8 +73,8 @@
                   :before-upload="beforeAvatarUpload">
                   <img v-if="form.upFile != ''"
                     :src="$store.state.settings.host + '/Data/UploadFiles/temp/' + form.upFile" class="avatar" />
-                  <img v-else-if="form.oldFile != '' && form.upFile == ''"
+                  <img v-else-if="form.oldFile != [] && form.upFile == ''"
-                    :src="$store.state.settings.host + '/Data/UploadFiles/category/' + form.oldFile" class="avatar" />
+                    :src="form.oldFile[0]" class="avatar" />
                   <template v-else>
                     <i class="el-icon-plus f-s-30 m-t-70 seatFontColor"></i>
                     <div class="el-upload__text"><em>建议40*40像素 <br>svg jpg png gif </em></div>
@@ -119,7 +119,7 @@ export default {
         sort: '',
         show: false,
         upFile: '',
-        oldFile: '',
+        oldFile: [],
         desc: ''
       },
       isStartDel: false,
@@ -276,7 +276,6 @@ export default {
     },
     categoryList () {
       this.categoryListData = this.buildTree(this.categoryList)
-      console.log(this.categoryListData)
     }
   },
   created () {

src/views/layout/components/main/product/sku/add.vue

@@ -44,8 +44,8 @@
                   :before-upload="beforeAvatarUpload">
                   <img v-if="form.upFile != ''"
                     :src="$store.state.settings.host + '/Data/UploadFiles/temp/' + form.upFile" class="avatar" />
-                  <img v-else-if="form.oldFile != '' && form.upFile == ''"
+                  <img v-else-if="form.oldFile != [] && form.upFile == ''"
-                    :src="$store.state.settings.host + '/Data/UploadFiles/sku/' + form.oldFile" class="avatar" />
+                    :src="form.oldFile[0]" class="avatar" />
                   <template v-else>
                     <i class="el-icon-plus f-s-30 m-t-70 seatFontColor"></i>
                     <div class="el-upload__text"><em>建议400*400像素 <br> jpg png </em></div>
@@ -94,7 +94,7 @@ export default {
         stock: '',
         purchase_channel: '',
         upFile: '',
-        oldFile: ''
+        oldFile: []
       },
       skuId: this.$route.params.id, // get参数 获取商品id 没有为添加页面
       pageState: 'add', // 页面状态

src/views/layout/components/main/product/sku/index.vue

@@ -29,9 +29,9 @@
       <el-table-column prop="unit" label="单位" width="60" min-width="60">
       </el-table-column>
       <el-table-column label="图片" width="120" min-width="120">
-        <template v-if="scope.row.photo != ''" slot-scope="scope">
+        <template v-if="scope.row.photo != []" slot-scope="scope">
-          <el-image :src="$store.state.settings.host + '/Data/UploadFiles/sku/' + scope.row.photo"
+          <el-image :src="scope.row.photo[0]"
-            :preview-src-list="[$store.state.settings.host + '/Data/UploadFiles/sku/' + scope.row.photo]">
+            :preview-src-list="scope.row.photo">
             <div slot="error" class="image-slot">
               <i class="el-icon-picture-outline"></i>
             </div>

src/views/layout/components/main/product/spu/add.vue

@@ -56,8 +56,8 @@
                   :before-upload="beforeAvatarUpload">
                   <img v-if="form.upFile != ''"
                     :src="$store.state.settings.host + '/Data/UploadFiles/temp/' + form.upFile" class="avatar" />
-                  <img v-else-if="form.oldFile != '' && form.upFile == ''"
+                  <img v-else-if="form.oldFile != [] && form.upFile == ''"
-                    :src="$store.state.settings.host + '/Data/UploadFiles/spu/' + form.oldFile" class="avatar" />
+                    :src="form.oldFile[0]" class="avatar" />
                   <template v-else>
                     <i class="el-icon-plus f-s-30 m-t-70 seatFontColor"></i>
                     <div class="el-upload__text"><em>建议288*216像素 <br> jpg png </em></div>

src/views/layout/components/main/product/spu/index.vue

@@ -34,8 +34,8 @@
       </el-table-column>
       <el-table-column label="图片" width="120" min-width="120">
         <template v-if="scope.row.photo != ''" slot-scope="scope">
-          <el-image :src="$store.state.settings.host + '/Data/UploadFiles/spu/' + scope.row.photo"
+          <el-image :src="scope.row.photo[0]"
-            :preview-src-list="[$store.state.settings.host + '/Data/UploadFiles/spu/' + scope.row.photo]">
+            :preview-src-list="scope.row.photo">
             <div slot="error" class="image-slot">
               <i class="el-icon-picture-outline"></i>
             </div>