商品 spu sku删除功能， 订单管理页面

src/store/index.js

@@ -100,6 +100,7 @@ const store = new Vuex.Store({
       if (res.data.status === 1) {
         commit('setShopList', res.data.shopList)
       } else {
+        commit('setShopList', [])
         Message.error(res.data.msg)
       }
     },
@@ -172,6 +173,7 @@ const store = new Vuex.Store({
         })
         commit('setAdminList', res.data.adminList)
       } else {
+        commit('setAdminList', [])
         Message.error(res.data.msg)
       }
     },
@@ -276,6 +278,7 @@ const store = new Vuex.Store({
       if (res.data.status === 1) {
         commit('setAirList', res.data.airList)
       } else {
+        commit('setAirList', [])
         Message.warning(res.data.msg)
       }
       return res.data.airList
@@ -367,6 +370,7 @@ const store = new Vuex.Store({
       if (res.data.status === 1) {
         commit('setSiteList', res.data.siteList)
       } else {
+        commit('setSiteList', [])
         Message.warning(res.data.msg)
       }
     },
@@ -469,6 +473,7 @@ const store = new Vuex.Store({
       if (res.data.status === 1) {
         commit('setRouteList', res.data.routeList)
       } else {
+        commit('setRouteList', [])
         Message.warning(res.data.msg)
       }
       return res.data.routeList
@@ -551,6 +556,8 @@ const store = new Vuex.Store({
       const res = await api.get('getCategoryList', 'Admin')
       if (res.data.status === 1) {
         commit('setCategoryList', res.data.categoryList)
+      } else {
+        commit('setCategoryList', [])
       }
       return res
     },
@@ -611,7 +618,7 @@ const store = new Vuex.Store({
       const params = new URLSearchParams()
       params.append('delIdArr', form.delIdArr)
       params.append('shop_id', form.shop_id)
-      api.post('delCategory', params, 'Admin').then(res => {
+      api.post('deleteCategory', params, 'Admin').then(res => {
         if (res.data.status === 1) {
           Message.success(res.data.msg)
           dispatch('fetchCategoryList')// 刷新分类列表
@@ -628,6 +635,8 @@ const store = new Vuex.Store({
       const res = await api.get('getSpuList', 'Admin')
       if (res.data.status === 1) {
         commit('setSpuList', res.data.spuList)
+      } else {
+        commit('setSpuList', [])
       }
       return res
     },
@@ -757,6 +766,34 @@ const store = new Vuex.Store({
       }
       return res
     },
+    /**
+     * @description: 删除spu
+     * @param {*} 多选id组
+     */
+    async fetchDelSpu ({ dispatch }, idArr) {
+      if (idArr.length === 0) {
+        Message.error('未勾选记录')
+      } else {
+        MessageBox.confirm('请谨慎操作 确认删除?', '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(() => {
+          const params = new URLSearchParams()
+          params.append('idArr', idArr)
+          api.post('deleteSpu', params, 'Admin').then(res => {
+            if (res.data.status === 1) {
+              Message.success(res.data.msg)
+              dispatch('fetchSpuList')// 刷新列表
+            } else {
+              Message.error(res.data.msg)
+            }
+          })
+        }).catch(() => {
+          Message.info('取消操作')
+        })
+      }
+    },
     /**
      * @description: 获取商品sku列表
      * @return {*} 列表
@@ -765,6 +802,8 @@ const store = new Vuex.Store({
       const res = await api.get('getSkuList', 'Admin')
       if (res.data.status === 1) {
         commit('setSkuList', res.data.skuList)
+      } else {
+        commit('setSkuList', [])
       }
       return res
     },
@@ -818,6 +857,34 @@ const store = new Vuex.Store({
       }
       return res
     },
+    /**
+     * @description: 删除sku
+     * @param {*} 多选id组
+     */
+    async fetchDelSku ({ dispatch }, idArr) {
+      if (idArr.length === 0) {
+        Message.error('未勾选记录')
+      } else {
+        MessageBox.confirm('请谨慎操作 确认删除?', '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(() => {
+          const params = new URLSearchParams()
+          params.append('idArr', idArr)
+          api.post('deleteSku', params, 'Admin').then(res => {
+            if (res.data.status === 1) {
+              Message.success(res.data.msg)
+              dispatch('fetchSkuList')// 刷新列表
+            } else {
+              Message.error(res.data.msg)
+            }
+          })
+        }).catch(() => {
+          Message.info('取消操作')
+        })
+      }
+    },
     /**
      * @description: 获取订单列表 ps:待发货及待收货 并且不是退款成功状态
      * @return {*} 列表
@@ -826,6 +893,8 @@ const store = new Vuex.Store({
       const res = await api.get('getQuestList')
       if (res.data.status === 1) {
         commit('setQuestList', res.data.questList)
+      } else {
+        commit('setQuestList', [])
       }
       return res
     },

src/styles/element-ui.scss

@@ -29,9 +29,10 @@
   .el-upload {
     width: 100%;
 
-    
+
   }
 }
+
 .el-upload-dragger {
   width: 178px !important;
   height: 178px !important;
@@ -55,13 +56,18 @@
   top: 10px !important;
 }
 
-.el-drawer__header{
+.el-drawer__header {
-  margin-bottom:15px;
+  margin-bottom: 15px;
 }
 
-.el-tabs__nav .is-top{
+.el-tabs__nav .is-top {
   cursor: pointer;
 }
-.el-tabs__header{
+
+.el-tabs__header {
   margin-bottom: -16px;
+}
+
+.el-table th.el-table__cell {
+  background-color: #F2F6FC !important;
 }

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

@@ -29,10 +29,10 @@
                     @click="openWin(`${data.name} : 添加子分类`, { id: data.id, path: data.path, bz_1: '' })">
                     添加子分类
                   </el-button>
-                  <el-button type="text" @click.stop="" @click="openWin(`${data.name} : 编辑`, data)">
+                  <el-button type="text" class="textEditBut" @click.stop="" @click="openWin(`${data.name} : 编辑`, data)">
                     编辑
                   </el-button>
-                  <el-button type="text" @click.stop="" @click="delCategory(data.id)">
+                  <el-button type="text" class="textDelBut" @click.stop="" @click="delCategory(data.id)">
                     删除
                   </el-button>
                 </span>
@@ -303,4 +303,12 @@ export default {
 .el-upload__text {
   line-height: 1.2em !important;
 }
+
+.textEditBut {
+  color: $warning-color !important;
+}
+
+.textDelBut {
+  color: $danger-color !important;
+}
 </style>

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

@@ -0,0 +1,257 @@
+<template>
+  <div class="app-container">
+    <!-- 组合按钮 -->
+    <el-button-group>
+      <el-button type="primary" icon="el-icon-plus" @click="$router.replace('/spu/add')">添加</el-button>
+      <el-button type="danger" icon="el-icon-delete" @click="deleteSpu(countSelIdArr($refs.myTable.selection))">删除
+      </el-button>
+      <el-button type="warning" icon="el-icon-edit" @click="toEditPage()">编辑</el-button>
+    </el-button-group>
+    <!-- 用户select选项 -->
+    <el-button-group class="m-l-20">
+      <SelectionShopId v-model="form.shop_id" :allSel="true" />
+    </el-button-group>
+    <!-- 分类select选项 -->
+    <el-button-group class="m-l-20">
+      <SelectionPath v-model="form.path" :shop_id="form.shop_id" :allSel="true" />
+    </el-button-group>
+    <!-- 商品spu表格 -->
+    <el-table class="m-t-20 w-100" ref="myTable"
+      :data="spuListArr.slice((currentPage - 1) * pageSize, currentPage * pageSize)" border tooltip-effect="dark">
+      <el-table-column align="center" type="selection" width="40">
+      </el-table-column>
+      <el-table-column align="center" label="排序" width="70">
+        <template slot-scope="scope">
+          <el-input v-model="scope.row.sort" @focus="tempSort = scope.row.sort"
+            @blur="blurOrder(scope.row.id, scope.row.sort)"></el-input>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" prop="id" label="id" width="50">
+      </el-table-column>
+      <el-table-column prop="name" label="名称" width="150" min-width="150">
+      </el-table-column>
+      <el-table-column prop="spu_number" label="编号" min-width="120">
+      </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"
+            :preview-src-list="[$store.state.settings.host + '/Data/UploadFiles/spu/' + scope.row.photo]">
+            <div slot="error" class="image-slot">
+              <i class="el-icon-picture-outline"></i>
+            </div>
+          </el-image>
+        </template>
+      </el-table-column>
+      <el-table-column prop="controler" label="操作" width="380" min-width="380">
+        <template slot-scope="scope">
+          <el-button-group>
+            <el-button :type="scope.row.recommend == '1' ? 'success' : 'info'" class="iconfont icon-tuijian"
+              @click="handeleRecommend(scope.row.id, scope.row.recommend)"><span class="m-l-5">推荐</span></el-button>
+            <el-button :type="scope.row.show == '1' ? 'primary' : 'info'"
+              :class="scope.row.show == '1' ? 'iconfont icon-yanjing' : 'iconfont icon-biyanjing'"
+              @click="handeleShow(scope.row.id, scope.row.show)"><span class="m-l-5">显示</span></el-button>
+            <el-button type="warning" icon="el-icon-edit"
+              @click="$router.replace(`/spu/edit/${scope.row.id}`)">编辑</el-button>
+            <el-button type="danger" icon="el-icon-delete" @click="deleteSpu([scope.row.id])">删除</el-button>
+          </el-button-group>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 分页 -->
+    <el-pagination class="m-t-20" layout="prev, pager, next" :current-page.sync="currentPage" :page-size="pageSize"
+      :total="spuListArr.length">
+    </el-pagination>
+  </div>
+</template>
+
+<script>
+import { countSelIdArr } from '@/utils'
+import SelectionShopId from '@/components/SelectionShopId'
+import SelectionPath from '@/components/SelectionPath'
+
+export default {
+  name: 'Spu',
+  data () {
+    return {
+      pageSize: 30, // 每页显示记录条数
+      currentPage: 1, // 当前页
+      form: {
+        shop_id: '',
+        path: ''
+      },
+      tempSort: ''// 临时记录 商品排序序号
+    }
+  },
+  components: {
+    SelectionShopId,
+    SelectionPath
+  },
+  computed: {
+    // 获取商品列表
+    spuList () {
+      return this.$store.state.spuList
+    },
+    // 获取分类列表
+    categoryList () {
+      return this.$store.state.categoryList
+    },
+    /**
+     * @description: 按照shop_id path条件过滤 商品列表
+     * @return: 商品列表
+     */
+    spuListArr () {
+      // 过滤出对应商铺的商品
+      let pList = this.spuList
+      if (this.form.shop_id !== '') { // 如果不是"所有商铺" 则按shop_id过滤
+        pList = pList.filter((item) => item.shop_id === this.form.shop_id)
+      }
+      // 过滤出 分类已经被删除的商品 （未分类）
+      if (this.form.path === 'none') {
+        const list = pList.filter((item) => {
+          let t = true
+          for (let index = 0; index < this.categoryList.length; index++) {
+            if (this.categoryList[index].path === item.path) {
+              t = false
+              break
+            }
+          }
+          return t
+        })
+        return list
+      } else if (this.form.path !== '') {
+        var pattern = this.form.path // selection path分类条件
+        // 对特殊字符进行转义，以防止它们影响正则表达式的匹配
+        var escapedPattern = pattern.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
+        // 构建动态正则表达式对象
+        var regexPattern = new RegExp('^' + escapedPattern + '(-|$)')
+        const list = pList.filter((item) => {
+          let t = false
+          for (let index = 0; index < this.categoryList.length; index++) { // 先确保 商品的path 在分类列表path中是存在的
+            if (this.categoryList[index].path === item.path) {
+              t = true
+              break
+            }
+          }
+          if (t) {
+            return regexPattern.test(item.path)
+          } else {
+            return false
+          }
+        })
+        return list
+      } else {
+        return pList // 所有分类显示所有商品
+      }
+    }
+  },
+  methods: {
+    countSelIdArr,
+    // 搜索标签
+    handleClose (tag) {
+      this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1)
+    },
+    showInput () {
+      this.inputVisible = true
+      this.$nextTick(_ => {
+        this.$refs.saveTagInput.$refs.input.focus()
+      })
+    },
+    handleInputConfirm () {
+      const inputValue = this.inputValue
+      if (inputValue) {
+        this.dynamicTags.push(inputValue)
+      }
+      this.inputVisible = false
+      this.inputValue = ''
+    },
+    /**
+     * @description: 跳转到编辑页面
+     */
+    toEditPage () {
+      const selId = this.countSelIdArr(this.$refs.myTable.selection)
+      switch (selId.length) {
+        case 0:
+          this.$message.error('请选择一条需要编辑的记录')
+          break
+        case 1:
+          this.$router.push('/register/edit/' + selId['0'])
+          break
+        default:
+          this.$message.error('只能选择一条记录')
+      }
+    },
+    /**
+     * @description: 删除spu
+     */
+    deleteSpu (idArr) {
+      this.$store.dispatch('fetchDelSpu', idArr)
+    },
+    /**
+     * @description: 排序input失焦 更新数据库的排序
+     * @param {*} id 商品id
+     * @param {*} sort 排序序号
+     */
+    async blurOrder (id, sort) {
+      if (this.tempSort !== sort) { // 失焦时 和 之前点击时 排序做一下对比 有更新 再向api提交数据
+        this.form.id = id
+        this.form.sort = sort
+        const res = await this.$store.dispatch('fetchOrderSpu', this.form)
+        if (res.data.status === 1) {
+          this.$router.push({ path: '/spu/index', query: { refresh: Date.now() } })
+        }
+      }
+    },
+    /**
+     * @description: 设置前端是否显示 商品
+     * @param {*} id 商品id
+     * @param {*} show 0隐藏 1显示
+     */
+    async handeleShow (id, show) {
+      this.form.id = id
+      if (show === '0') {
+        this.form.show = '1'
+      } else {
+        this.form.show = '0'
+      }
+      const res = await this.$store.dispatch('fetchShowSpu', this.form)
+      if (res.data.status === 1) {
+        this.$router.push({ path: '/spu/index', query: { refresh: Date.now() } })
+      }
+    },
+    /**
+     * @description: 设置前端是否推荐 商品
+     * @param {*} id 商品id
+     * @param {*} recommend 0推荐 1不推荐
+     */
+    async handeleRecommend (id, recommend) {
+      this.form.id = id
+      if (recommend === '0') {
+        this.form.recommend = '1'
+      } else {
+        this.form.recommend = '0'
+      }
+      const res = await this.$store.dispatch('fetchRecommendSpu', this.form)
+      if (res.data.status === 1) {
+        this.$router.push({ path: '/spu/index', query: { refresh: Date.now() } })
+      }
+    }
+  },
+  watch: {
+  },
+  created () {
+  },
+  filters: {
+    countSelIdArr
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "@/styles/theme.scss";
+
+i {
+  font-size: 18px !important;
+  margin-right: 12px;
+  vertical-align: middle;
+}
+</style>

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

@@ -30,10 +30,10 @@ export default {
   },
   computed: {
     plane () {
-      if (!this.$store.state.airList) {
+      if (this.$store.state.airList.length > 0) {
-        return null
+        return this.$store.state.airList.find(plane => plane.id === this.planesId)
       }
-      return this.$store.state.airList.find(plane => plane.id === this.planesId)
+      return null
     },
     position () {
       if (this.plane) {

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

@@ -3,7 +3,7 @@
     <!-- 组合按钮 -->
     <el-button-group>
       <el-button type="primary" icon="el-icon-plus" @click="$router.replace('/sku/add')">添加</el-button>
-      <el-button type="danger" icon="el-icon-delete" @click="deleteAir(countSelIdArr($refs.myTable.selection))">删除
+      <el-button type="danger" icon="el-icon-delete" @click="deleteSku(countSelIdArr($refs.myTable.selection))">删除
       </el-button>
       <el-button type="warning" icon="el-icon-edit" @click="toEditPage()">编辑</el-button>
     </el-button-group>

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

@@ -3,7 +3,7 @@
     <!-- 组合按钮 -->
     <el-button-group>
       <el-button type="primary" icon="el-icon-plus" @click="$router.replace('/spu/add')">添加</el-button>
-      <el-button type="danger" icon="el-icon-delete" @click="deleteAir(countSelIdArr($refs.myTable.selection))">删除
+      <el-button type="danger" icon="el-icon-delete" @click="deleteSpu(countSelIdArr($refs.myTable.selection))">删除
       </el-button>
       <el-button type="warning" icon="el-icon-edit" @click="toEditPage()">编辑</el-button>
     </el-button-group>
@@ -52,7 +52,7 @@
               @click="handeleShow(scope.row.id, scope.row.show)"><span class="m-l-5">显示</span></el-button>
             <el-button type="warning" icon="el-icon-edit"
               @click="$router.replace(`/spu/edit/${scope.row.id}`)">编辑</el-button>
-            <el-button type="danger" icon="el-icon-delete" @click="deleteAir([scope.row.id])">删除</el-button>
+            <el-button type="danger" icon="el-icon-delete" @click="deleteSpu([scope.row.id])">删除</el-button>
           </el-button-group>
         </template>
       </el-table-column>
@@ -181,10 +181,10 @@ export default {
       }
     },
     /**
-     * @description: 删除飞机
+     * @description: 删除spu
      */
-    deleteAir (idArr) {
+    deleteSpu (idArr) {
-      this.$store.dispatch('fetchDelAir', idArr)
+      this.$store.dispatch('fetchDelSpu', idArr)
     },
     /**
      * @description: 排序input失焦 更新数据库的排序