feat(liveroomProd): 导入直播间商品

package.json

@@ -9,7 +9,7 @@
     "analyze": "NODE_OPTIONS=--openssl-legacy-provider NODE_ENV=production ANALYZER=true vue-cli-service build"
   },
   "dependencies": {
-    "@smallwei/avue": "2.8.27",
+    "@smallwei/avue": "2.10.15",
     "axios": "0.18.1",
     "core-js": "3.6.5",
     "crypto-js": "^4.1.1",

pnpm-lock.yaml

@@ -1,13 +1,9 @@
 lockfileVersion: '6.0'
 
-settings:
-  autoInstallPeers: true
-  excludeLinksFromLockfile: false
-
 dependencies:
   '@smallwei/avue':
-    specifier: 2.8.27
-    version: registry.npmmirror.com/@smallwei/avue@2.8.27
+    specifier: 2.10.15
+    version: registry.npmmirror.com/@smallwei/avue@2.10.15(element-ui@2.15.7)(vue@2.7.14)
   axios:
     specifier: 0.18.1
     version: registry.npmmirror.com/axios@0.18.1
@@ -2068,20 +2064,21 @@ packages:
     version: 1.0.0-next.21
     dev: true
 
-  registry.npmmirror.com/@smallwei/avue@2.8.27:
-    resolution: {integrity: sha512-qRENOs91FIJ6nUdaAoKUt9rDr7DabvRsk5vMF/ZtmvBcw3x8xeR5LVhpnpTdSTkOGI5nfHKT0AT8fLrL9DMQ8w==, registry: https://registry.npm.taobao.org/, tarball: https://registry.npmmirror.com/@smallwei/avue/-/avue-2.8.27.tgz}
+  registry.npmmirror.com/@smallwei/avue@2.10.15(element-ui@2.15.7)(vue@2.7.14):
+    resolution: {integrity: sha512-YWs6+64fy0aidmqui2xKIb/bwhWIycRZf8PowlHMqNM63SskTUTlIx0bRuF2e1gla6bldKX/LJNw9WKtOiDVkg==, registry: https://registry.npm.taobao.org/, tarball: https://registry.npmmirror.com/@smallwei/avue/-/avue-2.10.15.tgz}
+    id: registry.npmmirror.com/@smallwei/avue/2.10.15
     name: '@smallwei/avue'
-    version: 2.8.27
+    version: 2.10.15
+    peerDependencies:
+      element-ui: '>=2.15.3'
+      vue: '>=2.5.17'
     dependencies:
-      axios: registry.npmmirror.com/axios@0.21.4
       countup.js: registry.npmmirror.com/countup.js@1.9.3
       dayjs: registry.npmmirror.com/dayjs@1.11.9
-      deepmerge: registry.npmmirror.com/deepmerge@3.3.0
       element-ui: registry.npmmirror.com/element-ui@2.15.7(vue@2.7.14)
       nprogress: registry.npmmirror.com/nprogress@0.2.0
       vue: registry.npmmirror.com/vue@2.7.14
-    transitivePeerDependencies:
-      - debug
+      vue-cropper: registry.npmmirror.com/vue-cropper@0.5.11
     dev: false
 
   registry.npmmirror.com/@soda/friendly-errors-webpack-plugin@1.8.1(webpack@4.46.0):
@@ -3746,16 +3743,6 @@ packages:
       - supports-color
     dev: false
 
-  registry.npmmirror.com/axios@0.21.4:
-    resolution: {integrity: sha512-ut5vewkiu8jjGBdqpM44XxjuCjq9LAKeHVmoVfHVzy8eHgxxq8SbAVQNovDA8mVi05kP0Ea/n/UzcSHcTJQfNg==, registry: https://registry.npm.taobao.org/, tarball: https://registry.npmmirror.com/axios/-/axios-0.21.4.tgz}
-    name: axios
-    version: 0.21.4
-    dependencies:
-      follow-redirects: registry.npmmirror.com/follow-redirects@1.15.2(debug@4.3.4)
-    transitivePeerDependencies:
-      - debug
-    dev: false
-
   registry.npmmirror.com/babel-code-frame@6.26.0:
     resolution: {integrity: sha512-XqYMR2dfdGMW+hd0IUZ2PwK+fGeFkOxZJ0wY+JaQAHzt1Zx8LcvpiZD2NiGkEG8qx0CfkAOr5xt76d1e8vG90g==, registry: https://registry.npm.taobao.org/, tarball: https://registry.npmmirror.com/babel-code-frame/-/babel-code-frame-6.26.0.tgz}
     name: babel-code-frame
@@ -5854,6 +5841,7 @@ packages:
     dependencies:
       ms: registry.npmmirror.com/ms@2.1.2
       supports-color: registry.npmmirror.com/supports-color@6.1.0
+    dev: true
 
   registry.npmmirror.com/decamelize@1.2.0:
     resolution: {integrity: sha512-z2S+W9X73hAUUki+N+9Za2lBlun89zigOyGrsax+KUQ6wKW4ZoWpEYBkGhQjwAjjDCkWxhY0VKEhk8wzY7F5cA==, registry: https://registry.npm.taobao.org/, tarball: https://registry.npmmirror.com/decamelize/-/decamelize-1.2.0.tgz}
@@ -5900,13 +5888,6 @@ packages:
     version: 1.5.2
     engines: {node: '>=0.10.0'}
 
-  registry.npmmirror.com/deepmerge@3.3.0:
-    resolution: {integrity: sha512-GRQOafGHwMHpjPx9iCvTgpu9NojZ49q794EEL94JVEw6VaeA8XTUyBKvAkOOjBX9oJNiV6G3P+T+tihFjo2TqA==, registry: https://registry.npm.taobao.org/, tarball: https://registry.npmmirror.com/deepmerge/-/deepmerge-3.3.0.tgz}
-    name: deepmerge
-    version: 3.3.0
-    engines: {node: '>=0.10.0'}
-    dev: false
-
   registry.npmmirror.com/deepmerge@4.3.1:
     resolution: {integrity: sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==, registry: https://registry.npm.taobao.org/, tarball: https://registry.npmmirror.com/deepmerge/-/deepmerge-4.3.1.tgz}
     name: deepmerge
@@ -7340,6 +7321,7 @@ packages:
         optional: true
     dependencies:
       debug: registry.npmmirror.com/debug@4.3.4(supports-color@6.1.0)
+    dev: true
 
   registry.npmmirror.com/follow-redirects@1.5.10:
     resolution: {integrity: sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==, registry: https://registry.npm.taobao.org/, tarball: https://registry.npmmirror.com/follow-redirects/-/follow-redirects-1.5.10.tgz}
@@ -10494,6 +10476,7 @@ packages:
     resolution: {integrity: sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==, registry: https://registry.npm.taobao.org/, tarball: https://registry.npmmirror.com/ms/-/ms-2.1.2.tgz}
     name: ms
     version: 2.1.2
+    dev: true
 
   registry.npmmirror.com/ms@2.1.3:
     resolution: {integrity: sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==, registry: https://registry.npm.taobao.org/, tarball: https://registry.npmmirror.com/ms/-/ms-2.1.3.tgz}
@@ -14672,6 +14655,12 @@ packages:
       tiny-cookie: registry.npmmirror.com/tiny-cookie@1.0.1
     dev: false
 
+  registry.npmmirror.com/vue-cropper@0.5.11:
+    resolution: {integrity: sha512-UeA3qL2BLCTGkOEAxEsxSNFO+qLYAn6YRHv4oS32cP9lMhF1vFmnAf/z+ZamtR0/Fh3sbZeZUCLVR2Ol2/dpTQ==, registry: https://registry.npm.taobao.org/, tarball: https://registry.npmmirror.com/vue-cropper/-/vue-cropper-0.5.11.tgz}
+    name: vue-cropper
+    version: 0.5.11
+    dev: false
+
   registry.npmmirror.com/vue-hot-reload-api@2.3.4:
     resolution: {integrity: sha512-BXq3jwIagosjgNVae6tkHzzIk6a8MHFtzAdwhnV5VlvPTFxDCvIttgSiHWjdGoTJvXtmRu5HacExfdarRcFhog==, registry: https://registry.npm.taobao.org/, tarball: https://registry.npmmirror.com/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz}
     name: vue-hot-reload-api
@@ -15510,3 +15499,7 @@ packages:
       normalize-path: registry.npmmirror.com/normalize-path@1.0.0
       strip-indent: registry.npmmirror.com/strip-indent@2.0.0
     dev: true
+
+settings:
+  autoInstallPeers: true
+  excludeLinksFromLockfile: false

src/avue/crud/liveroomProdSelect.ts

@@ -0,0 +1,22 @@
+import { tableOption } from "./prodList"
+
+export default {
+  border: false,
+  selection: true,
+  stripe: true,
+  align: 'center',
+  searchShow: false,
+  searchBtn: false,
+  refreshBtn: false,
+  columnBtn: false,
+  menu: false,
+  searchShowBtn: false,
+  addBtn: false,
+  rowKey: 'id',
+  reserveSelection: true,
+  props: {
+    label: 'label',
+    value: 'value'
+  },
+  column: [...tableOption.column]
+}

src/avue/crud/prodList.js

@@ -13,6 +13,7 @@ export const tableOption = {
   editBtn: false,
   delBtn: false,
   viewBtn: false,
+  searchShow: true,
   searchShowBtn: false,
   refreshBtn: false,
   columnBtn: false,
@@ -22,42 +23,42 @@ export const tableOption = {
     value: 'value'
   },
   column: [
-  {
-    label: "#",
-    prop: "id",
-    width: 70,
-  }, {
-    label: '产品名',
-    prop: 'name',
-    search: true,
-  }, {
-    label: '商品原价',
-    prop: 'price',
-    formatter: row_currencyFormatter,
-    width: 100,
-  }, {
-    label: '商品库存',
-    prop: 'stockAmount',
-    width: 100,
-  }, {
-    label: '运费',
-    prop: 'deliverPrice',
-    formatter: row_currencyFormatter,
-    width: 100,
-  }, {
-    label: '售出',
-    prop: 'soldAmount',
-    width: 100,
-  }, {
-    label: '类别',
-    prop: 'kind',
-    slot: true,
-    width: 100,
-  }, {
-    label: '产品图片',
-    prop: 'cover',
-    type: 'upload',
-    listType: 'picture-img',
-    width: 100,
-  }]
+    {
+      label: "#",
+      prop: "id",
+      width: 70,
+    }, {
+      label: '产品名',
+      prop: 'name',
+      search: true,
+    }, {
+      label: '商品原价',
+      prop: 'price',
+      formatter: row_currencyFormatter,
+      width: 100,
+    }, {
+      label: '商品库存',
+      prop: 'stockAmount',
+      width: 100,
+    }, {
+      label: '运费',
+      prop: 'deliverPrice',
+      formatter: row_currencyFormatter,
+      width: 100,
+    }, {
+      label: '售出',
+      prop: 'soldAmount',
+      width: 100,
+    }, {
+      label: '类别',
+      prop: 'kind',
+      slot: true,
+      width: 100,
+    }, {
+      label: '产品图片',
+      prop: 'cover',
+      type: 'upload',
+      listType: 'picture-img',
+      width: 100,
+    }]
 }

src/components/prods-select/index.vue

@@ -1,188 +0,0 @@
-<template>
-  <el-dialog title="选择商品"
-             :modal="false"
-             :close-on-click-modal="false"
-             :visible.sync="visible">
-    <el-table ref="prodTable"
-              :data="dataList"
-              border
-              v-loading="dataListLoading"
-              @selection-change="selectChangeHandle"
-              style="width: 100%;"
-              >
-      <el-table-column v-if="isSingle" width="50"
-                       header-align="center"
-                       align="center">
-        <template slot-scope="scope">
-          <div>
-            <el-radio :label="scope.row.prodId"
-                      v-model="singleSelectProdId"
-                      @change.native="getSelectProdRow(scope.row)">&nbsp;</el-radio>
-          </div>
-        </template>
-      </el-table-column>
-      <el-table-column v-if="!isSingle"
-                       type="selection"
-                       header-align="center"
-                       align="center"
-                       width="50">
-      </el-table-column>
-      <el-table-column prop="prodName"
-                       header-align="center"
-                       align="center"
-                       label="产品名称">
-      </el-table-column>
-      <el-table-column align="center"
-                       width="140"
-                       label="产品图片">
-        <template slot-scope="scope">
-          <img :src="scope.row.pic"
-               width="100"
-               height="100" />
-        </template>
-      </el-table-column>
-    </el-table>
-    <el-pagination @size-change="sizeChangeHandle"
-                   @current-change="currentChangeHandle"
-                   :current-page="pageIndex"
-                   :page-sizes="[10, 20, 50, 100]"
-                   :page-size="pageSize"
-                   :total="totalPage"
-                   layout="total, sizes, prev, pager, next, jumper">
-    </el-pagination>
-    <span slot="footer">
-      <el-button @click="visible = false">取消</el-button>
-      <el-button type="primary"
-                 @click="submitProds()">确定</el-button>
-    </span>
-  </el-dialog>
-</template>
-
-<script>
-export default {
-  data () {
-    return {
-      visible: false,
-      dataForm: {
-        product: ''
-      },
-      singleSelectProdId: 0,
-      allData: [],
-      selectProds: [],
-      dataList: [],
-      pageIndex: 1,
-      pageSize: 10,
-      totalPage: 0,
-      dataListLoading: false,
-      dataListSelections: [],
-      addOrUpdateVisible: false
-    }
-  },
-  props: {
-    isSingle: {
-      default: false,
-      type: Boolean
-    }
-  },
-  activated () {
-    this.getDataList()
-  },
-  methods: {
-    // 获取数据列表
-    init (selectProds) {
-      this.selectProds = selectProds
-      this.visible = true
-      this.dataListLoading = true
-      if (this.selectProds) {
-        this.selectProds.forEach(row => {
-          this.dataListSelections.push(row)
-        })
-      }
-      this.getDataList()
-    },
-    getDataList () {
-      this.$http({
-        url: this.$http.adornUrl('/prod/prod/page'),
-        method: 'get',
-        params: this.$http.adornParams(
-          Object.assign(
-            {
-              current: this.pageIndex,
-              size: this.pageSize
-            },
-            {
-              prodName: this.dataForm.prodName
-            }
-          )
-        )
-      }).then(({ data }) => {
-        this.dataList = data.records
-        this.totalPage = data.total
-        this.dataListLoading = false
-        if (this.selectProds) {
-          this.$nextTick(() => {
-            this.selectProds.forEach(row => {
-              let index = this.dataList.findIndex((prodItem) => prodItem.prodId === row.prodId)
-              this.$refs.prodTable.toggleRowSelection(this.dataList[index])
-            })
-          })
-        }
-      })
-    },
-    // 每页数
-    sizeChangeHandle (val) {
-      this.pageSize = val
-      this.pageIndex = 1
-      this.getDataList()
-    },
-    // 当前页
-    currentChangeHandle (val) {
-      this.pageIndex = val
-      this.getDataList()
-    },
-    // 单选商品事件
-    getSelectProdRow (row) {
-      this.dataListSelections = [row]
-    },
-    // 多选点击事件
-    selectChangeHandle (selection) {
-      this.dataList.forEach((tableItem) => {
-        let selectedProdIndex = selection.findIndex((selectedProd) => {
-          if (!selectedProd) {
-            return false
-          }
-          return selectedProd.prodId === tableItem.prodId
-        })
-        let dataSelectedProdIndex = this.dataListSelections.findIndex((dataSelectedProd) => dataSelectedProd.prodId === tableItem.prodId)
-        if (selectedProdIndex > -1 && dataSelectedProdIndex === -1) {
-          this.dataListSelections.push(tableItem)
-        } else if (selectedProdIndex === -1 && dataSelectedProdIndex > -1) {
-          this.dataListSelections.splice(dataSelectedProdIndex, 1)
-        }
-      })
-    },
-    // 确定事件
-    submitProds () {
-      if (!this.dataListSelections.length) {
-        this.$message({
-          message: '请选择商品',
-          type: 'error',
-          duration: 1000,
-          onClose: () => {}
-        })
-        return
-      }
-      let prods = []
-      this.dataListSelections.forEach(item => {
-        let prodIndex = prods.findIndex((prod) => prod.prodId === item.prodId)
-        if (prodIndex === -1) {
-          prods.push({ prodId: item.prodId, prodName: item.prodName, pic: item.pic })
-        }
-      })
-      this.$emit('refreshSelectProds', prods)
-      this.dataListSelections = []
-      this.visible = false
-    }
-  }
-}
-</script>

src/element-ui.ts

@@ -25,9 +25,9 @@ import {
   Radio,
   RadioGroup,
   RadioButton,
-  // Checkbox,
-  // CheckboxButton,
-  // CheckboxGroup,
+  Checkbox,
+  CheckboxButton,
+  CheckboxGroup,
   Switch,
   Select,
   Option,
@@ -80,6 +80,7 @@ import {
   Notification,
   Descriptions,
   DescriptionsItem,
+  Empty,
 } from 'element-ui'
 
 export default {
@@ -100,9 +101,9 @@ export default {
     Vue.use(Radio)
     Vue.use(RadioGroup)
     Vue.use(RadioButton)
-    // Vue.use(Checkbox)
-    // Vue.use(CheckboxButton)
-    // Vue.use(CheckboxGroup)
+    Vue.use(Checkbox)
+    Vue.use(CheckboxButton)
+    Vue.use(CheckboxGroup)
     Vue.use(Switch)
     Vue.use(Select)
     Vue.use(Option)
@@ -152,6 +153,7 @@ export default {
     Vue.use(Descriptions)
     Vue.use(DescriptionsItem)
     Vue.use(Loading.directive)
+    Vue.use(Empty)
 
     Vue.prototype.$loading = Loading.service
     Vue.prototype.$msgbox = MessageBox

src/main.ts

@@ -14,7 +14,7 @@ Vue.config.productionTip = false
 Vue.prototype.isAuth = isAuth     // 权限方法
 Vue.prototype.$shortcut = {
   notFound() {
-    router.push({ name: "404" })
+    return router.replace({ name: "404" })
   }
 }
 

src/views/modules/liveroom/liveroomEdit.vue

@@ -40,7 +40,8 @@ export default Vue.extend({
       if (id_str === "new") {
         this.new = true
       } else {
-        this.notFound()
+        //@ts-ignore
+        this.$shortcut.notFound()
       }
     } else {
       this.new = false
@@ -77,7 +78,9 @@ export default Vue.extend({
           showInList: roominfo.showInList,
           hours: roominfo.hours,
         }
-      }).catch(this.notFound)
+      }).catch(// @ts-ignore
+        this.$shortcut.notFound
+      )
     },
 
     onSubmit(form: any, done: Function) {
@@ -112,9 +115,6 @@ export default Vue.extend({
         this.$router.back()
       })
       done()
-    },
-    notFound() {
-      this.$router.replace("/404")
     }
   }
 

src/views/modules/liveroom/liveroomList-opbar.vue

@@ -16,7 +16,9 @@
         <el-button type="primary" size="small" disabled><icon-svg name="question" /></el-button>
       </el-tooltip>
       <el-tooltip effect="dark" content="商品跳转记录" placement="top" :enterable="false">
-        <el-button type="info" size="small" @click="$router.push(`/liveroom/liveroom-product-jump-record/${id}`)"><icon-svg name="record" /></el-button>
+        <el-button type="info" size="small" @click="$router.push(`/liveroom/liveroom-product-jump-record/${id}`)">
+          <icon-svg name="record" />
+        </el-button>
       </el-tooltip>
       <el-tooltip effect="dark" content="邀约码统计" placement="top" :enterable="false">
         <el-button type="info" size="small" disabled><icon-svg name="share" /></el-button>

src/views/modules/liveroom/liveroomProd-select.vue

@@ -0,0 +1,116 @@
+<template>
+  <div class="liveroomprod-select">
+    <el-dialog title="选择商品" :visible="true" width="85%" top="5vh" :before-close="onCancel" :destroy-on-close="true"
+      :close-on-click-modal="true">
+      <avue-crud ref="crud" :option="tableOption" :page="page" :data="dataList" :table-loading="dataListLoading"
+        @on-load="getDataList" @selection-change="onSelectionChange" />
+      <div slot="footer">
+        <el-button type="info" @click="onCancel">取 消</el-button>
+        <el-button type="primary" @click="onSubmit">确 定</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue'
+import tableOption from "@/avue/crud/liveroomProdSelect"
+import httpx from '@/utils/httpx'
+import { IPage } from '@/utils/vo'
+
+export default Vue.extend({
+  props: {
+    prodId: {
+      type: Number,
+      default: 0
+    }
+  },
+  data() {
+    return {
+      tableOption,
+      dataList: [],
+      page: {
+        total: 0, // 总页数
+        currentPage: 1, // 当前页数
+        pageSize: 10 // 每页显示多少条
+      },
+      dataListLoading: false,
+      selected: [] as number[],
+    }
+  },
+
+  mounted() {
+    this.getRoomGoodsIds()
+  },
+
+  methods: {
+    getDataList(page?: IPage, params?: { name: string }, done?: Function) {
+      this.dataListLoading = true
+      httpx.post(httpx.makeurl('/goods/queryGoodList'), {
+        name: "",
+        limit: page == null ? this.page.pageSize : page.pageSize,
+        page: page == null ? this.page.currentPage : page.currentPage,
+      }).then(({ data }) => {
+        const items = data.goodList
+        this.dataList = items
+        this.page.total = data.total
+        this.dataListLoading = false
+        if (done) {
+          done()
+        }
+      })
+    },
+    getRoomGoodsIds() {
+      httpx.post(httpx.makeurl('/rooms/getRoomGoodsIds'), { id: this.prodId }).then(({ data }) => {
+        this.selected = data.goodsIds
+        this.updateSelection(this.selected)
+      })
+    },
+    onCancel() {
+      this.$emit("cancel")
+    },
+    onSubmit() {
+      httpx.post(
+        httpx.makeurl('/rooms/updateRoomGoods'),
+        { id: this.prodId, goodsIdList: this.selected }
+      ).then(({ data }) => {
+        this.$message({
+          message: '操作成功',
+          type: 'success',
+          duration: 1500
+        })
+        this.$emit("submit", this.selected)
+      })
+    },
+    onSelectionChange(selections: any[]) {
+      const selected_ids = selections.map(v => v.id)
+      this.selected = selected_ids
+    },
+    updateSelection(selection: number[]) {
+      //@ts-ignore
+      this.$refs.crud.clearSelection()
+      //@ts-ignore
+      this.$refs.crud.toggleSelection(selection.map(id => { return { id } }))
+    }
+  }
+})
+</script>
+
+<style lang="scss">
+.liveroomprod-select {
+
+  .avue-crud__menu,
+  .avue-crud__header {
+    display: none !important;
+  }
+
+  .el-form {
+    height: 60vh;
+    overflow-y: auto;
+  }
+
+  .el-dialog__body {
+    padding: 10px 20px;
+  }
+}
+</style>

src/views/modules/liveroom/liveroomProd.vue

@@ -1,16 +1,23 @@
 <template>
-  <avue-crud ref="crud" :page="page" :data="dataList" :table-loading="dataListLoading" :option="tableOption">
-    <template slot-scope="scope" slot="kind">
-      <el-tag v-if="scope.row.kind" size="small" :type="scope.row.kind === '自营' ? 'primary' : 'success'">
-        {{ scope.row.kind }}
-      </el-tag>
-    </template>
+  <div>
+    <avue-crud ref="crud" :page="page" :data="dataList" :table-loading="dataListLoading" :option="tableOption"
+      @on-load="getDataList">
+      <template slot="menuLeft">
+        <el-button type="primary" icon="el-icon-plus" size="small" @click="showSelect = true">导入商品</el-button>
+      </template>
+      <template slot-scope="scope" slot="kind">
+        <el-tag v-if="scope.row.kind" size="small" :type="scope.row.kind === '自营' ? 'primary' : 'success'">
+          {{ scope.row.kind }}
+        </el-tag>
+      </template>
+      <template slot-scope="{row,index}" slot="menu">
+        <el-button type="primary" icon="el-icon-edit" size="small"
+          @click="$router.push({ name: 'prodInfo', params: { id: row.id.toString() } })">修改</el-button>
+      </template>
+    </avue-crud>
 
-    <template slot-scope="{row,index}" slot="menu">
-      <el-button type="primary" icon="el-icon-edit" size="small"
-        @click="$router.push({ name: 'prodInfo', params: { id: row.id.toString() } })">修改</el-button>
-    </template>
-  </avue-crud>
+    <product-select v-if="showSelect" :prodId="id" @cancel="showSelect = false" @submit="onSelectSubmit" />
+  </div>
 </template>
 
 <script lang="ts">
@@ -19,26 +26,25 @@ import { tableOption } from '@/avue/crud/prodList.js'
 import httpx from '@/utils/httpx'
 import { IPage } from '@/utils/vo'
 import { isInteger } from 'lodash'
+import ProductSelect from './liveroomProd-select.vue'
 
 export default Vue.extend({
   data() {
     return {
-      dataForm: {
-        prodName: ''
-      },
       dataList: [],
       page: {
-        total: 0, // 总页数
+        total: 1, // 总页数
         currentPage: 1, // 当前页数
         pageSize: 10 // 每页显示多少条
       },
-      dataListSelections: [],
       dataListLoading: false,
-      tableOption: tableOption,
-      resourcesUrl: process.env.VUE_APP_RESOURCES_URL,
       id: 0,
+      showSelect: false,
     }
   },
+  components: {
+    ProductSelect
+  },
 
   mounted() {
     const id_str = this.$route.params.id
@@ -52,6 +58,15 @@ export default Vue.extend({
     }
   },
 
+  computed: {
+    tableOption() {
+      const option: typeof tableOption & { menuWidth?: number } = { ...tableOption }
+      option.searchShow = false
+      option.menuWidth = 100
+      return option
+    }
+  },
+
   methods: {
     // 获取数据列表
     getDataList(page?: IPage, params?: null, done?: Function) {
@@ -69,6 +84,10 @@ export default Vue.extend({
         }
       })
     },
+    onSelectSubmit() {
+      this.showSelect = false
+      this.getDataList()
+    }
   }
 })
 </script>

src/views/modules/prod/prodInfo.vue

@@ -60,7 +60,8 @@ export default Vue.extend({
       if (id_str === "new") {
         this.new = true
       } else {
-        this.notFound()
+        // @ts-ignore
+        this.$shortcut.notFound()
       }
     } else {
       this.new = false
@@ -98,7 +99,8 @@ export default Vue.extend({
         id
       ).then(({ data }) => {
         if ((data?.goodList?.length || 0) === 0) {
-          this.notFound()
+          //@ts-ignore
+          this.$shortcut.notFound()
         }
         const item = data.goodList[0]
         const categories_raw: ICategoryProdRelation[] = data?.goodsGoodsTypesEntityList || []
@@ -147,9 +149,6 @@ export default Vue.extend({
         })
         this.$router.back()
       }).finally(() => done())
-    },
-    notFound() {
-      this.$router.replace("/404")
     }
   },
 })

vue.config.js

@@ -47,7 +47,7 @@ module.exports = {
     devServer: {
       proxy: {
         // "^/user": {target: "http://192.168.58.137:10086"},
-        "^/(user|goods|goodsTypes|order|orderItem|rooms)/": { target: "http://192.168.43.46:10086" },
+        "^/(user|goods|goodsTypes|order|orderItem|rooms)/": { target: "http://127.0.0.1:10086" },
         "^/.*": { target: "http://116.63.32.160:8085" },
       },
     }