新增店铺管理

src/router/index.js

@@ -808,6 +808,44 @@ export const asyncRouterMap = [
       }
     ]
   },
+  {
+    path: '/shop',
+    component: Layout,
+    redirect: 'noredirect',
+    alwaysShow: true,
+    name: 'finance',
+    meta: {
+      title: '店铺管理',
+      icon: 'shopping'
+    },
+    children: [
+      {
+        path: 'shopManagerList',
+        component: () => import('@/views/shop/shopManagerList'),
+        name: 'shopManagerList',
+        meta: {
+          perms: [],
+          title: '店铺管理列表',
+          icon: 'drag',
+          noCache: true,
+          keepAlive: true
+        }
+      },
+      {
+        path: 'shopManagerDetail',
+        component: () => import('@/views/shop/shopManagerDetail'),
+        name: 'shopManagerDetail',
+        meta: {
+          perms: [],
+          title: '店铺详情',
+          icon: 'list',
+          noCache: true,
+          keepAlive: true
+        },
+        hidden: true
+      }
+    ]
+  },
   /* {
     path: '/service',
     component: Layout,

src/views/shop/components/ExchangeLogisticIdentifyDialog.vue

+<template>
+  <el-dialog
+    v-if="logisticDialogShow"
+    :visible.sync="logisticDialogShow"
+    :before-close="handleCancelLogisticDialog"
+    width="600px"
+    height="800px"
+    title="寄出快递">
+    <el-form ref="imageValue" :model="logisticForm" :rules="logisticRules">
+      <el-form-item label="物流公司" label-width="100px" prop="outLogisticsCode">
+        <el-select v-model="logisticForm.logisticsCode" placeholder="请选择物流公司" style="width: 240px;margin-right: 10px;margin-bottom: 10px">
+          <el-option
+            v-for="item in logisticList"
+            :key="item.code"
+            :label="item.name"
+            :value="item.code"/>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="快递单号" label-width="100px" prop="outWaybill">
+        <el-input
+          v-model="logisticForm.waybill"
+          clearable
+          class="filter-item"
+          style="width: 240px;margin-right: 10px"
+          placeholder="请输入快递单号" />
+      </el-form-item>
+    </el-form>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="handleCancelLogisticDialog">取 消</el-button>
+      <el-button type="primary" @click="handleLogistic">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { MessageBox } from 'element-ui'
+import { requestIdentifyDelivery, requestIdentifySendBack, requestLogisticsList, requestDelivery } from '@/api/business/order'
+export default {
+  name: 'ExchangeLogisticIdentifyDialog',
+  props: {
+    logisticDialogShow: {
+      type: Boolean,
+      default: false
+    },
+    distributionOrderId: {
+      type: String,
+      default: ''
+    },
+    identifyOrderId: {
+      type: String,
+      default: ''
+    },
+    type: {
+      type: Number,
+      default: 1
+    }
+  },
+  data() {
+    return {
+      logisticForm: {
+        logisticsCode: '',
+        waybill: ''
+      },
+      logisticRules: {
+        logisticsCode: [
+          { required: true, message: '请选择物流公司', trigger: 'blur' }
+        ],
+        waybill: [
+          { required: true, message: '请输入快递单号', trigger: 'blur' }
+        ]
+      },
+      logisticList: [
+        {
+          'code': 'JD',
+          'name': '京东快递'
+        },
+        {
+          'code': 'SF',
+          'name': '顺丰快递'
+        },
+        {
+          'code': 'STO',
+          'name': '申通快递'
+        },
+        {
+          'code': 'YTO',
+          'name': '圆通快递'
+        },
+        {
+          'code': 'ZTO',
+          'name': '中通快递'
+        },
+        {
+          'code': 'YD',
+          'name': '韵达快递'
+        }
+      ]
+    }
+  },
+  created() {
+    this.getLogisticsList()
+  },
+  methods: {
+    handleCancelLogisticDialog() {
+      this.$emit('cancelDialog')
+    },
+    /**
+     * 获取物流公司列表
+     */
+    getLogisticsList() {
+      requestLogisticsList().then((response) => {
+        console.log('==response===', response)
+        this.logisticList = response.data.data
+      }).catch((err) => {
+        console.log('==err===', err)
+      })
+    },
+    /**
+     * 实物评估
+     */
+    handleLogistic() {
+      const params = { ...this.logisticForm, distributionOrderId: this.distributionOrderId, identifyOrderId: this.identifyOrderId }
+      this.$refs.imageValue.validate((valid) => {
+        if (valid) {
+          if (this.type === 1) {
+            requestIdentifyDelivery(params)
+              .then(response => {
+                this.itemContent = {}
+                this.logisticForm = {}
+                this.$notify.success({
+                  message: '发货成功'
+                })
+                this.$emit('refreshDelivery')
+              })
+              .catch(response => {
+                MessageBox.alert('业务错误：' + response.data.errmsg, '警告', {
+                  confirmButtonText: '确定',
+                  type: 'error'
+                })
+              })
+          } if (this.type === 3) {
+            requestDelivery(params)
+              .then(response => {
+                this.itemContent = {}
+                this.logisticForm = {}
+                this.$notify.success({
+                  message: '发货成功'
+                })
+                this.$emit('refreshDelivery')
+              })
+              .catch(response => {
+                MessageBox.alert('业务错误：' + response.data.errmsg, '警告', {
+                  confirmButtonText: '确定',
+                  type: 'error'
+                })
+              })
+          } else {
+            requestIdentifySendBack(params)
+              .then(response => {
+                this.itemContent = {}
+                this.logisticForm = {}
+                this.$notify.success({
+                  message: '退回成功'
+                })
+                this.$emit('refreshSendBack')
+              })
+              .catch(response => {
+                MessageBox.alert('业务错误：' + response.data.errmsg, '警告', {
+                  confirmButtonText: '确定',
+                  type: 'error'
+                })
+              })
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.content {
+  width: 100%;
+  text-align: center;
+}
+
+.image {
+  width: 400px;
+  height: auto;
+}
+
+</style>

src/views/shop/components/NoPassIdentifyDialog.vue

+<template>
+
+  <el-dialog
+    v-if="showNoPassIdentifyDialogShow"
+    :visible.sync="showNoPassIdentifyDialogShow"
+    :before-close="handleCancelConsignDialog"
+    width="600px"
+    height="600px"
+    title="审核结果">
+    <el-form ref="cancel" :model="cancelForm" :rules="cancelRules">
+      <el-form-item label="" label-width="80px" prop="content">
+        <div>该商家不通过原因：</div>
+      </el-form-item>
+      <el-form-item label="" label-width="80px" prop="remark">
+        <el-input
+          v-model="cancelForm.remark"
+          :autosize="{ minRows: 8, maxRows: 8}"
+          style="width: 400px"
+          maxlength="50"
+          type="textarea"
+          show-word-limit
+          placeholder="请填写不通过原因" />
+      </el-form-item>
+    </el-form>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="handleCancelConsignDialog">取 消</el-button>
+      <el-button type="primary" @click="handleCancelValue">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { MessageBox } from 'element-ui'
+import { requestIdentify } from '@/api/business/order'
+export default {
+  name: 'NoPassIdentifyDialog',
+  props: {
+    showNoPassIdentifyDialogShow: {
+      type: Boolean,
+      default: false
+    },
+    distributionOrderId: {
+      type: String,
+      default: ''
+    },
+    identifyOrderId: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      cancelForm: {
+        remark: ''
+      },
+      cancelRules: {
+        remark: [
+          { required: true, message: '原因不能为空', trigger: 'blur' }
+        ]
+      }
+    }
+  },
+  methods: {
+    handleCancelConsignDialog() {
+      this.$emit('cancelDialog')
+    },
+    /**
+     * 取消
+     */
+    handleCancelValue() {
+      if (this.distributionOrderId) {
+        const params = { ...this.cancelForm, distributionOrderId: this.distributionOrderId, identifyOrderId: this.identifyOrderId, approved: 0 }
+        this.$refs.cancel.validate((valid) => {
+          if (valid) {
+            requestIdentify(params)
+              .then(response => {
+                this.$notify.success({
+                  message: '操作成功'
+                })
+                this.cancelForm = {}
+                this.$emit('refreshItem', this.distributionOrderId)
+              })
+              .catch(response => {
+                MessageBox.alert('业务错误：' + response.data.errmsg, '警告', {
+                  confirmButtonText: '确定',
+                  type: 'error'
+                })
+              })
+          }
+        })
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.content {
+  width: 100%;
+  text-align: center;
+}
+
+.image {
+  width: 400px;
+  height: auto;
+}
+
+</style>

src/views/shop/components/ReturnLogisticIdentifyDialog.vue

+<template>
+  <el-dialog
+    v-if="logisticDialogShow"
+    :visible.sync="logisticDialogShow"
+    :before-close="handleCancelLogisticDialog"
+    width="600px"
+    height="800px"
+    title="寄出快递">
+    <el-form ref="imageValue" :model="logisticForm" :rules="logisticRules">
+      <el-form-item label="物流公司" label-width="100px" prop="outLogisticsCode">
+        <el-select v-model="logisticForm.outLogisticsCode" placeholder="请选择物流公司" style="width: 240px;margin-right: 10px;margin-bottom: 10px">
+          <el-option
+            v-for="item in logisticList"
+            :key="item.code"
+            :label="item.name"
+            :value="item.code"/>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="快递单号" label-width="100px" prop="outWaybill">
+        <el-input
+          v-model="logisticForm.outWaybill"
+          clearable
+          class="filter-item"
+          style="width: 240px;margin-right: 10px"
+          placeholder="请输入快递单号" />
+      </el-form-item>
+    </el-form>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="handleCancelLogisticDialog">取 消</el-button>
+      <el-button type="primary" @click="handleLogistic">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { MessageBox } from 'element-ui'
+import { requestIdentifyDelivery, requestIdentifySendBack, requestLogisticsList, requestDelivery} from '@/api/business/order'
+export default {
+  name: 'ReturnLogisticIdentifyDialog',
+  props: {
+    logisticDialogShow: {
+      type: Boolean,
+      default: false
+    },
+    distributionOrderId: {
+      type: String,
+      default: ''
+    },
+    identifyOrderId: {
+      type: String,
+      default: ''
+    },
+    type: {
+      type: Number,
+      default: 1
+    }
+  },
+  data() {
+    return {
+      logisticForm: {
+        outLogisticsCode: '',
+        outWaybill: ''
+      },
+      logisticRules: {
+        outLogisticsCode: [
+          { required: true, message: '请选择物流公司', trigger: 'blur' }
+        ],
+        outWaybill: [
+          { required: true, message: '请输入快递单号', trigger: 'blur' }
+        ]
+      },
+      logisticList: [
+        {
+          'code': 'JD',
+          'name': '京东快递'
+        },
+        {
+          'code': 'SF',
+          'name': '顺丰快递'
+        },
+        {
+          'code': 'STO',
+          'name': '申通快递'
+        },
+        {
+          'code': 'YTO',
+          'name': '圆通快递'
+        },
+        {
+          'code': 'ZTO',
+          'name': '中通快递'
+        },
+        {
+          'code': 'YD',
+          'name': '韵达快递'
+        }
+      ]
+    }
+  },
+  created() {
+    this.getLogisticsList()
+  },
+  methods: {
+    handleCancelLogisticDialog() {
+      this.$emit('cancelDialog')
+    },
+    /**
+     * 获取物流公司列表
+     */
+    getLogisticsList() {
+      requestLogisticsList().then((response) => {
+        console.log('==response===', response)
+        this.logisticList = response.data.data
+      }).catch((err) => {
+        console.log('==err===', err)
+      })
+    },
+    /**
+     * 实物评估
+     */
+    handleLogistic() {
+      const params = { ...this.logisticForm, distributionOrderId: this.distributionOrderId, identifyOrderId: this.identifyOrderId }
+      this.$refs.imageValue.validate((valid) => {
+        if (valid) {
+          if (this.type === 1) {
+            requestIdentifyDelivery(params)
+              .then(response => {
+                this.itemContent = {}
+                this.logisticForm = {}
+                this.$notify.success({
+                  message: '发货成功'
+                })
+                this.$emit('refreshDelivery')
+              })
+              .catch(response => {
+                MessageBox.alert('业务错误：' + response.data.errmsg, '警告', {
+                  confirmButtonText: '确定',
+                  type: 'error'
+                })
+              })
+          } if (this.type === 3) {
+            requestDelivery(params)
+              .then(response => {
+                this.itemContent = {}
+                this.logisticForm = {}
+                this.$notify.success({
+                  message: '发货成功'
+                })
+                this.$emit('refreshDelivery')
+              })
+              .catch(response => {
+                MessageBox.alert('业务错误：' + response.data.errmsg, '警告', {
+                  confirmButtonText: '确定',
+                  type: 'error'
+                })
+              })
+          }
+          else {
+            requestIdentifySendBack(params)
+              .then(response => {
+                this.itemContent = {}
+                this.logisticForm = {}
+                this.$notify.success({
+                  message: '退回成功'
+                })
+                this.$emit('refreshSendBack')
+              })
+              .catch(response => {
+                MessageBox.alert('业务错误：' + response.data.errmsg, '警告', {
+                  confirmButtonText: '确定',
+                  type: 'error'
+                })
+              })
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.content {
+  width: 100%;
+  text-align: center;
+}
+
+.image {
+  width: 400px;
+  height: auto;
+}
+
+</style>

src/views/shop/components/exchangeItemListView.vue

+<template>
+  <div class="exchange_list">
+    <el-table :data="itemList" size="small" border fit highlight-current-row>
+      <el-table-column type="expand">
+        <template slot-scope="props">
+          <el-form label-position="right" class="table-expand" label-width="100px">
+            <el-form-item v-if="props.row.images" label="藏品图片：">
+              <div class="image_list">
+                <div v-for="pic in props.row.images.split(';')" :key="pic">
+                  <el-image
+                    :preview-src-list="[pic]"
+                    :src="pic"
+                    class="table-td-thumb"
+                  />
+                </div>
+              </div>
+            </el-form-item>
+            <el-form-item label="详情：">
+              <span>{{ props.row.description }}</span>
+            </el-form-item>
+          </el-form>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" min-width="200" label="商品ID" prop="itemId"/>
+      <el-table-column align="center" min-width="200" label="名称" prop="name">
+        <template slot-scope="scope" >
+          <Line2Hidden :text="scope.row.name" />
+        </template>
+      </el-table-column>
+
+      <el-table-column align="center" property="homePageImage" label="图片">
+        <template slot-scope="scope">
+          <div v-if="scope.row.images && scope.row.images.split(';').length > 0" class="image_preview">
+            <el-image
+              :preview-src-list="[scope.row.images.split(';')[0]]"
+              :src="scope.row.images.split(';')[0]"
+              class="table-td-thumb"
+            />
+          </div>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="售价" min-width="200" prop="distributionPrice">
+        <template slot-scope="scope">
+          <span class="tooltip-span">{{ `${scope.row.distributionPrice ? `¥ ${scope.row.distributionPrice}` : '-'}` }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="官方估价" min-width="200" prop="officialEstimatedPrice">
+        <template slot-scope="scope">
+          <span class="tooltip-span">{{ `${scope.row.officialEstimatedPrice ? `¥ ${scope.row.officialEstimatedPrice}` : '-'}` }}</span>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+
+</template>
+
+<script>
+import Line2Hidden from '@/components/line2Hidden'
+export default {
+  name: 'ExchangeItemListView',
+  components: {
+    Line2Hidden
+  },
+  props: {
+    itemList: {
+      type: Array,
+      default: () => {
+        return []
+      }
+    }
+  },
+  data() {
+    return {
+      imageUrl: '',
+      showLargeDialog: false
+    }
+  },
+  methods: {
+    handleShowLargeDialog(imageUrl) {
+      this.imageUrl = imageUrl
+      this.showLargeDialog = true
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.exchange_list {
+  padding: 10px;
+  margin-left: 20px;
+}
+.table-expand {
+  margin-left: 10px;
+}
+.image_list {
+  display: flex;
+  flex-direction: row;
+}
+
+.table-td-thumb {
+  width: 60px;
+  height: 60px;
+  margin-right: 10px;
+}
+
+</style>

src/views/shop/saleList.vue

+<template>
+  <div class="page_consignList">
+    <div class="filter-container">
+      <div class="button_left">
+        <el-input v-model="listQuery.name" clearable class="filter-item" style="width: 200px;" placeholder="请输入标题"/>
+        <el-input v-model="listQuery.name" clearable class="filter-item" style="width: 200px;" placeholder="请输入藏家ID"/>
+        <!-- <el-select v-model="listQuery.isAbleSale" placeholder="请选择商品状态" class="filter-item" style="width: 200px;">
+          <el-option
+            v-for="item in options"
+            :key="item.label"
+            :label="item.label"
+            :value="item.value"
+            size="mini"/>
+        </el-select> -->
+        <el-button class="filter-item" type="primary" icon="el-icon-search" style="margin-left: 12px" @click="handleFilter">查找</el-button>
+        <el-button class="filter-item" type="primary" style="margin-left: 12px" @click="handleReset">重置</el-button>
+      </div>
+      <el-button size="mini" class="filter-item" type="primary" icon="el-icon-edit" @click="handleCreate">添加</el-button>
+    </div>
+    <el-table
+      v-loading="listLoading"
+      :data="list"
+      size="small"
+      element-loading-text="正在查询中..."
+      height="800"
+      border
+      fit
+      highlight-current-row>
+      <!--      <el-table-column align="center" label="排行" width="100px" type="index" />-->
+      <el-table-column align="center" min-width="100px" prop="id" label="商品ID" />
+      <el-table-column align="center" label="封面图" prop="itemImg">
+        <template slot-scope="scope">
+          <div class="image_preview">
+            <el-image
+              :preview-src-list="scope.row.images.split(';')"
+              :src="scope.row.images.split(';')[0]"
+              class="table-td-thumb"
+            />
+          </div>
+        </template>
+      </el-table-column>
+
+      <el-table-column align="center" label="藏品名称" min-width="150px" prop="name">
+        <template slot-scope="scope">
+          <Line2Hidden :text="scope.row.name" />
+        </template>
+      </el-table-column>
+
+      <!-- <el-table-column align="center" label="上架类型" prop="type" >
+        <template slot-scope="scope">
+          <span class="tooltip-span">{{ `${scope.row.type === 1 ? '一口价' : scope.row.type === 3 ? '帖子' : '竞拍'}` }}</span>
+        </template>
+      </el-table-column> -->
+      <el-table-column align="center" label="估价" prop="distributionPrice">
+        <template slot-scope="scope">
+          <span class="tooltip-span">{{ `¥ ${scope.row.distributionPrice}` }}</span>
+        </template>
+      </el-table-column>
+      <!-- <el-table-column align="center" label="进货价" prop="supplyPrice">
+        <template slot-scope="scope">
+          <span class="tooltip-span">{{ `${scope.row.supplyPrice ? `¥ ${scope.row.supplyPrice}` : '-'}` }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="状态" prop="isOnSale" min-width="100px">
+        <template slot-scope="scope" style="height: 100px">
+          <el-switch
+            v-model="scope.row.isOnSale"
+            :active-text="scope.row.isOnSale ? '上架' : '下架'"
+            style="display: block"
+            @change="handleSaleSwitch($event, scope.row)" />
+        </template>
+      </el-table-column> -->
+      <el-table-column align="center" label="数量" prop="stock" />
+      <el-table-column align="center" label="藏家昵称" prop="selledNum" />
+      <el-table-column align="center" label="藏家ID" prop="updateTime" />
+      <el-table-column align="center" label="仓位" prop="updateTime" />
+      <el-table-column align="center" label="入库时间" prop="updateTime" />
+      <el-table-column align="center" label="操作" width="300">
+        <template slot-scope="scope">
+          <el-button
+            type="primary"
+            size="mini"
+            @click="handleToDetail(scope.row)">编辑
+          </el-button>
+          <!-- <el-button
+            :disabled="(!scope.row.editAble && scope.row.type === 2)"
+            type="danger"
+            size="mini"
+            @click="handleDelete(scope.row)">删除
+          </el-button> -->
+        </template>
+      </el-table-column>
+
+    </el-table>
+
+    <Pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="listQuery.page"
+      :limit.sync="listQuery.limit"
+      @pagination="getList" />
+
+  </div>
+</template>
+
+<script>
+import Line2Hidden from '@/components/line2Hidden'
+import Pagination from '@/components/Pagination'
+import { getSaleList, updateOnSale, deleteSaleItem } from '@/api/business/sale'
+import { MessageBox } from 'element-ui'
+
+export default {
+  name: 'SaleList',
+  components: {
+    Pagination,
+    Line2Hidden
+  },
+  data() {
+    return {
+      itemKey: 0,
+      options: [{
+        value: 1,
+        label: '上架'
+      }, {
+        value: 0,
+        label: '下架'
+      }],
+      listLoading: true,
+      listQuery: {
+        page: 1,
+        limit: 20
+      },
+      list: [],
+      total: 0,
+      // 图文估价
+      imageValueDialogShow: false,
+      // 建议寄售价
+      identifyValueDialogShow: false,
+      // 货品售出
+      finishDialogShow: false,
+      // 寄售凭证
+      finishSettlementDialogShow: false,
+      // 取消
+      cancelConsignDialogShow: false,
+      currentSaleId: ''
+    }
+  },
+  created() {
+    this.getList()
+  },
+  methods: {
+    handleFilter() {
+      this.listQuery.page = 1
+      this.getList()
+    },
+    handleReset() {
+      this.listQuery = {
+        page: 1,
+        limit: 20
+      }
+      this.getList()
+    },
+    handleSaleSwitch(e, item) {
+      const params = { id: item.id, isOnSale: e }
+      updateOnSale(params)
+        .then(response => {
+          this.$notify.success({
+            message: e ? '上架成功' : '下架成功'
+          })
+        })
+        .catch(response => {
+          item.isOnSale = !e
+          MessageBox.alert('业务错误：' + response.data.errmsg, '警告', {
+            confirmButtonText: '确定',
+            type: 'error'
+          })
+        })
+    },
+    handleCreate() {
+      this.$router.push({ path: '/sale/saleAdd' })
+    },
+    handlerGetList() {
+      this.listQuery.page = 1
+      this.getList()
+    },
+    handleClick(tab, event) {
+      this.listQuery.page = 1
+      this.getList()
+    },
+    getList() {
+      localStorage.setItem('systemState', '')
+      this.listLoading = true
+      getSaleList(this.listQuery).then(response => {
+        this.list = response.data.data.dataList
+        this.total = response.data.data.total
+        this.listLoading = false
+      }).catch((e) => {
+        this.list = []
+        this.total = 0
+        this.listLoading = false
+      })
+    },
+    /**
+     * 详情
+     */
+    handleToDetail(item) {
+      this.$router.push({ path: '/factory/factorySaleAdd', query: { id: item.id }})
+    },
+    /**
+     * 删除
+     */
+    handleDelete(item) {
+      this.$confirm('你确定删除吗?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        const data = {
+          id: item.id
+        }
+        deleteSaleItem(data).then((res) => {
+          this.$notify.success({
+            title: '成功',
+            message: '删除成功'
+          })
+          this.getList()
+        }).catch(err => {
+          this.$notify.error({
+            title: '失败',
+            message: err.data.errmsg
+          })
+        })
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+/deep/ .el-switch {
+  height: 30px;
+}
+
+/deep/ .cell {
+  display: flex;
+  justify-content: center;
+}
+
+.page_consignList {
+  padding: 20px;
+  .filter-container {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+  }
+  .image_preview {
+    width: 60px;
+    height: 60px;
+    align-content: center;
+    justify-content: center;
+  }
+}
+
+</style>