|
@@ -1,39 +1,39 @@
|
|
|
<template>
|
|
|
- <a-card :bordered="false" class="shopOrder-table-page-search-wrapper">
|
|
|
- <div class="shopOrder-searchForm">
|
|
|
+ <a-card :bordered="false" class="goodsList-table-page-wrapper">
|
|
|
+ <div class="goodsList-searchForm">
|
|
|
<a-form layout="inline" @keyup.enter.native="$refs.table.refresh(true)">
|
|
|
<a-row :gutter="48">
|
|
|
<a-col :span="6">
|
|
|
<a-form-item label="商品名称" :label-col="{ span:7 }" :wrapper-col="{ span:17}">
|
|
|
- <a-input allowClear v-model.trim="queryParam.contactPhone" :maxLength="11" placeholder="请输入商品名称" />
|
|
|
+ <a-input allowClear v-model.trim="queryParam.name" :maxLength="11" placeholder="请输入商品名称" />
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
<a-col :span="6">
|
|
|
<a-form-item label="供货商" :label-col="{ span:7 }" :wrapper-col="{ span:17}">
|
|
|
- <a-input allowClear v-model.trim="queryParam.name" placeholder="请输入供货商" />
|
|
|
+ <a-input allowClear v-model.trim="queryParam.supplierName" placeholder="请输入供货商" />
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
<a-col :span="6">
|
|
|
<a-form-item label="商品状态" :label-col="{ span:7 }" :wrapper-col="{ span:17}">
|
|
|
<v-select
|
|
|
- v-model="queryParam.status"
|
|
|
- ref="salesChannelSettleStatus"
|
|
|
- id="shopOrder-status"
|
|
|
+ v-model="queryParam.goodsStatus"
|
|
|
+ ref="goodsStatus"
|
|
|
+ id="goodsList-status"
|
|
|
code="SETTLE_STATUS_ALL"
|
|
|
placeholder="请选择商品状态"
|
|
|
allowClear></v-select>
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
<a-col :span="6">
|
|
|
- <a-button class="handle-btn serach-btn" id="shopOrder-serach" type="primary" @click="$refs.table.refresh(true)">查询</a-button>
|
|
|
- <a-button class="handle-btn" type="" id="shopOrder-reset" @click="handleReset">重置</a-button>
|
|
|
+ <a-button class="handle-btn serach-btn" id="goodsList-serach" type="primary" @click="$refs.table.refresh(true)">查询</a-button>
|
|
|
+ <a-button class="handle-btn" type="" id="goodsList-reset" @click="handleReset">重置</a-button>
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
</a-form>
|
|
|
</div>
|
|
|
<a-divider />
|
|
|
<div class="table-operator">
|
|
|
- <a-button type="primary" icon="plus" @click="openModal">新增</a-button>
|
|
|
+ <a-button type="primary" icon="plus" @click="handleGoods('add')">新增</a-button>
|
|
|
</div>
|
|
|
<s-table
|
|
|
ref="table"
|
|
@@ -42,14 +42,14 @@
|
|
|
:columns="columns"
|
|
|
:data="loadData"
|
|
|
bordered>
|
|
|
- <!-- 订单状态 -->
|
|
|
+ <!-- 商品状态 -->
|
|
|
<template slot="orderStatus" slot-scope="text, record">
|
|
|
- <span :class="[record.orderStatus==1 ? 'green' : 'red']">{{ record.orderStatus==1 ? '已启用' : '已禁用' }}</span>
|
|
|
+ <span>{{ record.orderStatus==1 ? '已启用' : '已禁用' }}</span>
|
|
|
</template>
|
|
|
<!-- 操作 -->
|
|
|
<template slot="action" slot-scope="text, record">
|
|
|
- <a-icon title="编辑" type="edit" class="actionBtn icon-blues" @click="openModal(record)" />
|
|
|
- <!-- <a-icon title="删除" type="delete" class="actionBtn icon-red" v-if="record.status == '0'" @click="delect(record)" /> -->
|
|
|
+ <a-icon title="编辑" type="edit" id="goodsList-delect" class="actionBtn icon-blues" @click="handleGoods('edit', record)" />
|
|
|
+ <a-icon title="删除" type="delete" id="goodsList-delect" class="actionBtn icon-red" @click="handleDel(record)" />
|
|
|
</template>
|
|
|
</s-table>
|
|
|
</a-card>
|
|
@@ -57,14 +57,8 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import {
|
|
|
- STable,
|
|
|
- VSelect
|
|
|
-} from '@/components'
|
|
|
-import {
|
|
|
- getTenantsList,
|
|
|
- tenantsDelete
|
|
|
-} from '@/api/tenants.js'
|
|
|
+import { STable, VSelect } from '@/components'
|
|
|
+import { getTenantsList, tenantsDelete } from '@/api/tenants.js'
|
|
|
import getDate from '@/libs/getDate.js'
|
|
|
import moment from 'moment'
|
|
|
export default {
|
|
@@ -72,51 +66,49 @@ export default {
|
|
|
components: { STable, VSelect },
|
|
|
data () {
|
|
|
return {
|
|
|
- pageNo: 1,
|
|
|
- pageSize: 10,
|
|
|
- openTenantsModal: false, // 打开授权弹窗
|
|
|
- itemId: '', // 要编辑的租户id
|
|
|
// 查询参数
|
|
|
queryParam: {
|
|
|
- beginDate: null, // 开始时间
|
|
|
- endDate: null, // 结束时间
|
|
|
- name: '',
|
|
|
- contactPhone: '',
|
|
|
- status: '' // 状态
|
|
|
+ name: '', // 商品名称
|
|
|
+ supplierName: '', // 供货商
|
|
|
+ goodsStatus: '' // 商品状态
|
|
|
},
|
|
|
loading: false, // 导出loading
|
|
|
// 表头
|
|
|
columns: [
|
|
|
- { title: '序号', dataIndex: 'no', width: 60, align: 'center' },
|
|
|
+ { title: '序号', dataIndex: 'no', width: 80, align: 'center' },
|
|
|
{ title: '商品名称', dataIndex: 'orderDate', width: 200, align: 'center' },
|
|
|
{ title: '商品价格(乐豆)', dataIndex: 'userMoblie', width: 200, align: 'center' },
|
|
|
{ title: '供货商', dataIndex: 'orderNo', width: 200, align: 'center' },
|
|
|
- { title: '商品状态', scopedSlots: { customRender: 'orderStatus' }, width: 80, align: 'center' },
|
|
|
+ { title: '商品状态', scopedSlots: { customRender: 'orderStatus' }, width: 200, align: 'center' },
|
|
|
{ title: '库存数量', dataIndex: 'orderPrice', width: 200, align: 'center' },
|
|
|
{ title: '已售数量', dataIndex: 'orderNum', width: 200, align: 'center' },
|
|
|
- { title: '操作', scopedSlots: { customRender: 'action' }, width: 100, align: 'center' }
|
|
|
+ { title: '操作', scopedSlots: { customRender: 'action' }, width: 150, align: 'center' }
|
|
|
],
|
|
|
// 加载数据方法 必须为 Promise 对象
|
|
|
loadData: parameter => {
|
|
|
- return getTenantsList(Object.assign(parameter, this.queryParam)).then(res => {
|
|
|
- console.log(res, 'rrrrrrr')
|
|
|
- if (res.status == 200) {
|
|
|
- const no = (res.data.pageNo - 1) * res.data.pageSize
|
|
|
- for (let i = 0; i < res.data.list.length; i++) {
|
|
|
- const _item = res.data.list[i]
|
|
|
- _item.no = no + i + 1
|
|
|
- _item.status = _item.status + '' === '1'
|
|
|
- }
|
|
|
- return res.data
|
|
|
- }
|
|
|
+ // return getTenantsList(Object.assign(parameter, this.queryParam)).then(res => {
|
|
|
+ // if (res.status == 200) {
|
|
|
+ // const no = (res.data.pageNo - 1) * res.data.pageSize
|
|
|
+ // for (let i = 0; i < res.data.list.length; i++) {
|
|
|
+ // const _item = res.data.list[i]
|
|
|
+ // _item.no = no + i + 1
|
|
|
+ // _item.status = _item.status + '' === '1'
|
|
|
+ // }
|
|
|
+ // return res.data
|
|
|
+ // }
|
|
|
+ // })
|
|
|
+ return new Promise((resolve) => {
|
|
|
+ const data = [
|
|
|
+ { no: 1, orderDate: '2020-10-30 09:14', userMoblie: '15709252525', orderNo: 'NO54456798', orderStatus: '1', orderPrice: '155', orderNum: '67' },
|
|
|
+ { no: 2, orderDate: '2020-10-30 09:14', userMoblie: '15709252525', orderNo: 'NO54456798', orderStatus: '0', orderPrice: '155', orderNum: '67' },
|
|
|
+ { no: 3, orderDate: '2020-10-30 09:14', userMoblie: '15709252525', orderNo: 'NO54456798', orderStatus: '1', orderPrice: '155', orderNum: '67' },
|
|
|
+ { no: 4, orderDate: '2020-10-30 09:14', userMoblie: '15709252525', orderNo: 'NO54456798', orderStatus: '1', orderPrice: '155', orderNum: '67' },
|
|
|
+ { no: 5, orderDate: '2020-10-30 09:14', userMoblie: '15709252525', orderNo: 'NO54456798', orderStatus: '0', orderPrice: '155', orderNum: '67' },
|
|
|
+ { no: 6, orderDate: '2020-10-30 09:14', userMoblie: '15709252525', orderNo: 'NO54456798', orderStatus: '0', orderPrice: '155', orderNum: '67' }
|
|
|
+ ]
|
|
|
+ resolve(data)
|
|
|
})
|
|
|
- },
|
|
|
- // 将默认当天时间日期回显在时间选择框中
|
|
|
- time: [
|
|
|
- moment(getDate.getToday().starttime, this.dateFormat),
|
|
|
- moment(getDate.getToday().endtime, this.dateFormat)
|
|
|
- ],
|
|
|
- dateFormat: 'YYYY-MM-DD'
|
|
|
+ }
|
|
|
}
|
|
|
},
|
|
|
beforeRouteEnter (to, from, next) {
|
|
@@ -137,89 +129,48 @@ export default {
|
|
|
this.searchForm.endDate = dateStrings[1]
|
|
|
}
|
|
|
},
|
|
|
- // 打开新增/编辑 弹窗
|
|
|
- openModal (row) {
|
|
|
- this.itemId = row ? row.id : ''
|
|
|
- this.openTenantsModal = true
|
|
|
+ // 新增、编辑商品
|
|
|
+ handleGoods (type, row) {
|
|
|
+ if (type == 'add') {
|
|
|
+ this.$router.push({ path: '/shop/goods/add' })
|
|
|
+ } else if (type == 'edit') {
|
|
|
+ this.$router.push({ path: `/shop/goods/edit/${row.no}` })
|
|
|
+ }
|
|
|
},
|
|
|
- // 删除
|
|
|
- delect (row) {
|
|
|
+ // 删除商品
|
|
|
+ handleDel (row) {
|
|
|
const _this = this
|
|
|
this.$confirm({
|
|
|
- title: '警告',
|
|
|
+ title: '提示',
|
|
|
centered: true,
|
|
|
content: '删除后原数据不可恢复,是否删除?',
|
|
|
okText: '确定',
|
|
|
cancelText: '取消',
|
|
|
onOk () {
|
|
|
- tenantsDelete({
|
|
|
- id: row.id
|
|
|
- }).then(res => {
|
|
|
- if (res.status == 200) {
|
|
|
- _this.$message.success('res.message')
|
|
|
- _this.$refs.table.refresh()
|
|
|
- }
|
|
|
- })
|
|
|
+ // tenantsDelete({
|
|
|
+ // id: row.id
|
|
|
+ // }).then(res => {
|
|
|
+ // if (res.status == 200) {
|
|
|
+ // _this.$message.success('res.message')
|
|
|
+ // _this.$refs.table.refresh()
|
|
|
+ // }
|
|
|
+ // })
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
// 重置
|
|
|
handleReset () {
|
|
|
- this.queryParam.beginDate = getDate.getToday().starttime
|
|
|
- this.queryParam.endDate = getDate.getToday().endtime
|
|
|
- this.time = [
|
|
|
- moment(getDate.getToday().starttime, this.dateFormat),
|
|
|
- moment(getDate.getToday().endtime, this.dateFormat)
|
|
|
- ]
|
|
|
- this.queryParam.bundleName = ''
|
|
|
- this.queryParam.number = ''
|
|
|
- this.queryParam.orderFlag = null
|
|
|
+ this.queryParam.name = ''
|
|
|
+ this.queryParam.supplierName = ''
|
|
|
+ this.queryParam.goodsStatus = null
|
|
|
this.$refs.table.refresh(true)
|
|
|
- },
|
|
|
- // 导出
|
|
|
- handleExport () {
|
|
|
- const params = {
|
|
|
- beginDate: this.searchForm.beginDate == null ? getDate.getToday().starttime : this.searchForm.beginDate,
|
|
|
- endDate: this.searchForm.endDate == null ? getDate.getToday().endtime : this.searchForm.endDate,
|
|
|
- bundleName: this.searchForm.bundleName,
|
|
|
- number: this.searchForm.number,
|
|
|
- queryWord: this.searchForm.queryWord,
|
|
|
- orderFlag: this.searchForm.orderFlag,
|
|
|
- salesChannelSettleStatus: this.searchForm.salesChannelSettleStatus
|
|
|
- }
|
|
|
- if (!params.beginDate && !params.endDate) {
|
|
|
- this.$message.error('请先选择需要导出的下单时间区间再进行导出!')
|
|
|
- return
|
|
|
- }
|
|
|
- // 判断两个时间段是否相差m个月
|
|
|
- if (!completeDate(params.beginDate, params.endDate, 3)) {
|
|
|
- this.$message.error('单次最多只能导出3个月的数据,请缩小查询区间后再进行导出!')
|
|
|
- return
|
|
|
- }
|
|
|
- this.loading = true
|
|
|
- exportBundle(params).then(res => {
|
|
|
- this.loading = false
|
|
|
- this.download(res)
|
|
|
- })
|
|
|
- },
|
|
|
- download (data) {
|
|
|
- if (!data) { return }
|
|
|
- const url = window.URL.createObjectURL(new Blob([data]))
|
|
|
- const link = document.createElement('a')
|
|
|
- link.style.display = 'none'
|
|
|
- link.href = url
|
|
|
- const a = moment().format('YYYYMMDDhhmmss')
|
|
|
- const fname = '已购套餐记录-' + a
|
|
|
- link.setAttribute('download', fname + '.xlsx')
|
|
|
- document.body.appendChild(link)
|
|
|
- link.click()
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
<style lang="less" scoped>
|
|
|
- .shopOrder-table-page-search-wrapper{
|
|
|
- .shopOrder-searchForm{
|
|
|
+ .goodsList-table-page-wrapper{
|
|
|
+ .goodsList-searchForm{
|
|
|
.ant-form-inline .ant-form-item{
|
|
|
width: 100%;
|
|
|
}
|