细节

src/views/goods/Index.vue

@@ -36,18 +36,16 @@
           </a-form-item>
           <a-form-item label="商品价格">
             <div style="display: flex" class="goodsType">
-              <a-input v-decorator="['goods_price_min']" placeholder="请输入" /><span
+              <a-input v-decorator="['goods_price_min']" placeholder="请输入" /><span style="padding: 0 3px 0 5px"
-                style="padding: 0 3px 0 5px"
+                >-</span
-              >-</span
               >
               <a-input style="margin-left: 5px" v-decorator="['goods_price_max']" placeholder="请输入" />
             </div>
           </a-form-item>
           <a-form-item label="利润率">
             <div style="display: flex" class="goodsType">
-              <a-input v-decorator="['profit_rate_min']" placeholder="请输入" /><span
+              <a-input v-decorator="['profit_rate_min']" placeholder="请输入" /><span style="padding: 0 3px 0 5px"
-                style="padding: 0 3px 0 5px"
+                >-</span
-              >-</span
               >
               <a-input style="margin-left: 5px" v-decorator="['profit_rate_max']" placeholder="请输入" />
             </div>
@@ -67,41 +65,27 @@
             <a-radio-button value="sold_out">已售罄</a-radio-button>
           </a-radio-group>
         </div>
-        <a-button
+        <a-button v-if="$auth('/goods/create')" class="fl-l" type="primary" icon="plus" @click="handleCreate()"
-          v-if="$auth('/goods/create')"
+          >创建商品</a-button
-          class="fl-l"
-          type="primary"
-          icon="plus"
-          @click="handleCreate()"
-        >创建商品</a-button
         >
         <a-button
           v-if="$module('goods-import') && $auth('/goods/import/batch')"
           class="fl-l"
           icon="arrow-up"
           @click="handleImport()"
-        >批量导入</a-button
+          >批量导入</a-button
         >
-        <a-button
+        <a-button style="background-color: #501212; color: #fff; border: none" @click="handleExport(selectedRowKeys)"
-          style="background-color: #501212; color: #fff; border: none"
+          >导出</a-button
-          @click="handleExport(selectedRowKeys)"
-        >导出</a-button
         >
-        <a-button
+        <a-button class="fl-l" style="background-color: #f0baae; border: none" type="primary" @click="handleModify()"
-          class="fl-l"
+          >批量修改</a-button
-          style="background-color: #f0baae; border: none"
-          type="primary"
-          @click="handleModify()"
-        >批量修改</a-button
         >
         <div v-if="selectedRowKeys.length" class="button-group">
           <a-button-group class="ml-10">
             <a-button v-action:status icon="arrow-up" @click="handleUpdateStatus(selectedRowKeys, true)">上架</a-button>
-            <a-button
+            <a-button v-action:status icon="arrow-down" @click="handleUpdateStatus(selectedRowKeys, false)"
-              v-action:status
+              >下架</a-button
-              icon="arrow-down"
-              @click="handleUpdateStatus(selectedRowKeys, false)"
-            >下架</a-button
             >
             <a-button v-action:delete icon="delete" @click="handleDelete(selectedRowKeys)">删除</a-button>
           </a-button-group>
@@ -137,7 +121,7 @@
           class="cur-p"
           :color="text == 10 ? 'green' : 'red'"
           @click="handleUpdateStatus([item.goods_id], text != 10)"
-        >{{ text == 10 ? '上架' : '下架' }}</a-tag
+          >{{ text == 10 ? '上架' : '下架' }}</a-tag
         >
       </span>
       <!-- 操作项 -->
@@ -151,7 +135,7 @@
         <router-link
           v-if="$module('goods-copy') && $auth('/goods/copy')"
           :to="{ path: '/goods/copy', query: { goodsId: item.goods_id } }"
-        >复制</router-link
+          >复制</router-link
         >
         <a v-action:delete @click="handleDelete([item.goods_id])">删除</a>
       </div>
@@ -172,102 +156,109 @@ const columns = [
     title: '商品ID',
     dataIndex: 'goods_id',
     width: '80px',
-    sorter: true
+    sorter: true,
   },
   {
     title: '渠道',
     width: '50px',
-    dataIndex: 'channel_name'
+    dataIndex: 'channel_name',
   },
   {
     title: '商品编号',
     dataIndex: 'goods_no',
-    width: '100px'
+    width: '100px',
   },
   {
     title: '商品图片',
     width: '100px',
     dataIndex: 'goods_image',
-    scopedSlots: { customRender: 'goods_image' }
+    scopedSlots: { customRender: 'goods_image' },
   },
   {
     title: '商品名称',
     dataIndex: 'goods_name',
     width: '260px',
-    scopedSlots: { customRender: 'goods_name' }
+    scopedSlots: { customRender: 'goods_name' },
   },
   {
     title: '商品价格',
     width: '90px',
     dataIndex: 'goods_price_min',
     scopedSlots: { customRender: 'goods_price_min' },
-    sorter: true
+    sorter: true,
   },
   {
     title: '成本价',
     width: '80px',
     dataIndex: 'cost_price_min',
     scopedSlots: { customRender: 'cost_price_min' },
-    sorter: true
+    sorter: true,
   },
   {
     title: '利润',
     width: '80px',
     dataIndex: 'profit',
-    sorter: true
+    sorter: true,
   },
   {
     title: '利润率',
     width: '80px',
     dataIndex: 'profit_rate',
     sorter: true,
-    scopedSlots: { customRender: 'profit_rate' }
+    scopedSlots: { customRender: 'profit_rate' },
+  },
+  {
+    title: '加价率',
+    width: '90px',
+    dataIndex: 'markup_rate',
+    sorter: true,
+    scopedSlots: { customRender: 'markup_rate' },
   },
   {
     title: '总销量',
     width: '80px',
     dataIndex: 'sales_actual',
-    sorter: true
+    sorter: true,
   },
   {
     title: '库存总量',
     width: '90px',
     dataIndex: 'stock_total',
-    sorter: true
+    sorter: true,
   },
   {
     title: '状态',
     width: '60px',
     dataIndex: 'status',
-    scopedSlots: { customRender: 'status' }
+    scopedSlots: { customRender: 'status' },
   },
   {
     title: '排序',
     width: '80px',
     dataIndex: 'sort',
-    sorter: true
+    sorter: true,
   },
   {
     title: '添加时间',
     width: '150px',
     dataIndex: 'create_time',
-    sorter: true
+    sorter: true,
   },
   {
     title: '操作',
     dataIndex: 'action',
     width: '150px',
-    scopedSlots: { customRender: 'action' }
+    scopedSlots: { customRender: 'action' },
-  }
+  },
 ]
 export default {
   name: 'Index',
   components: {
     ContentHeader,
     STable,
-    Update
+    Update,
   },
-  data () {
+  data() {
     return {
       // 当前表单元素
       searchForm: this.$form.createForm(this),
@@ -277,7 +268,7 @@ export default {
       queryParam: {
         listType: 'all',
         spec_type: '',
-        channel: ''
+        channel: '',
       },
       // 正在加载
       isLoading: false,
@@ -290,7 +281,7 @@ export default {
         const data = { ...param, ...this.queryParam }
         const orderEnum = {
           ascend: 'asc',
-          descend: 'desc'
+          descend: 'desc',
         }
 
         if (data.sortField && data.sortOrder && orderEnum[data.sortOrder]) {
@@ -309,12 +300,12 @@ export default {
       specsType: [
         { name: '全部', val: '' },
         { name: '单规格', val: 10 },
-        { name: '多规格', val: 20 }
+        { name: '多规格', val: 20 },
       ],
-      checkList: []
+      checkList: [],
     }
   },
-  created () {
+  created() {
     // 默认的查询参数
     if (this.$route.query.listType) {
       this.queryParam.listType = this.$route.query.listType
@@ -324,20 +315,20 @@ export default {
     this.getDataList() // 渠道
   },
   computed: {
-    rowSelection () {
+    rowSelection() {
       return {
         selectedRowKeys: this.selectedRowKeys,
-        onChange: this.onSelectChange
+        onChange: this.onSelectChange,
       }
-    }
+    },
   },
   methods: {
     // 批量修改
-    handleModify () {
+    handleModify() {
       this.$router.push('/goods/modify')
     },
     // 导出
-    handleExport (goodsIds) {
+    handleExport(goodsIds) {
       const formData = this.searchForm.getFieldsValue()
       var index = window.publicConfig.BASE_API.indexOf('?')
       var resolve = window.publicConfig.BASE_API.substring(0, index)
@@ -365,10 +356,10 @@ export default {
       console.log(params)
       window.open(resolve + '?s=/store/goods/export' + params)
     },
-    getChannel (val) {
+    getChannel(val) {
       this.queryParam.channel = val
     },
-    getDataList () {
+    getDataList() {
       return GoodsApi.getDataList().then((result) => {
         const obj = result.data
         Object.keys(obj).forEach((item) => {
@@ -376,22 +367,22 @@ export default {
         })
       })
     },
-    onchangeSpecs (val) {
+    onchangeSpecs(val) {
       this.queryParam.spec_type = val
     },
     // 选中项发生变化时的回调
-    onSelectChange (selectedRowKeys) {
+    onSelectChange(selectedRowKeys) {
       this.selectedRowKeys = selectedRowKeys
     },
 
     // 切换tab
-    handleTabs (e) {
+    handleTabs(e) {
       this.queryParam.listType = e.target.value
       this.handleRefresh(true)
     },
 
     // 确认搜索
-    handleSearch (e) {
+    handleSearch(e) {
       e.preventDefault()
       this.searchForm.validateFields((error, values) => {
         if (!error) {
@@ -401,16 +392,16 @@ export default {
       })
     },
 
-    refreshParentMethod(){
+    refreshParentMethod() {
       this.handleRefresh(false)
     },
     // 重置搜索表单
-    handleReset () {
+    handleReset() {
       this.searchForm.resetFields()
     },
 
     // 获取分类列表
-    getCategoryList () {
+    getCategoryList() {
       this.isLoading = true
       CategoryModel.getListFromScreen()
         .then((selectList) => {
@@ -420,7 +411,7 @@ export default {
     },
 
     // 修改商品状态(上下架)
-    handleUpdateStatus (goodsIds, state = true) {
+    handleUpdateStatus(goodsIds, state = true) {
       if (!this.$auth('/goods/index.status')) {
         return false
       }
@@ -437,33 +428,33 @@ export default {
     },
 
     // 删除记录
-    handleDelete (goodsIds) {
+    handleDelete(goodsIds) {
       const app = this
       const modal = this.$confirm({
         title: '您确定要删除该记录吗?',
         content: '删除后不可恢复',
-        onOk () {
+        onOk() {
           return GoodsApi.deleted({ goodsIds })
             .then((result) => {
               app.$message.success(result.message, 1.5)
               app.handleRefresh()
             })
             .finally((result) => modal.destroy())
-        }
+        },
       })
     },
-      // 编辑记录
+    // 编辑记录
-    async handleEdit (id) {
+    async handleEdit(id) {
       // 显示对话框
       this.$refs.UpdateRef.initData(id)
     },
     // 新增记录
-    handleCreate () {
+    handleCreate() {
       this.$router.push('/goods/create')
     },
 
     // 批量导入
-    handleImport () {
+    handleImport() {
       this.$router.push('/goods/import/batch')
     },
 
@@ -471,11 +462,11 @@ export default {
      * 刷新列表
      * @param Boolean bool 强制刷新到第一页
      */
-    handleRefresh (bool = false) {
+    handleRefresh(bool = false) {
       this.selectedRowKeys = []
       this.$refs.table.refresh(bool)
-    }
+    },
-  }
+  },
 }
 </script>
 <style lang="less" scoped>