Skip to content

C
center-shop
提交 90a27164 authored 作者: 王鹏飞's avatar 王鹏飞
浏览文件
操作

update

上级 e7a90348
全部展开 显示空白字符变更
内嵌 并排
正在显示 包含 229 行增加 和 46 行删除
src/components/base/tableList.vue
浏览文件 @ 90a27164
......@@ -60,6 +60,7 @@
:current-page.sync="page.currentPage"
@size-change="pageSizeChange"
@current-change="fetchList"
:hide-on-single-page="true"
v-if="hasPagination"
>
</el-pagination>
......
src/pages/goods/goods/edit.vue
浏览文件 @ 90a27164
......@@ -284,7 +284,7 @@ export default {
},
// 成功回调
handleSuccess(data) {
this.$message({ message: '保存商品成功', type: 'success' })
// this.$message({ message: '保存商品成功', type: 'success' })
this.$router.push({ path: '/preview', query: { shop_id: this.shopId, id: data.spu_id } })
},
// 确定添加商品
......
src/pages/goods/goods/index.vue
浏览文件 @ 90a27164
......@@ -9,6 +9,20 @@
<el-button type="primary">发布商品</el-button>
</router-link>
</template>
<template v-slot:table-goods="{ row }">
<div class="table-goods">
<el-image :src="imageUrl(row.chart_oss)" fit="cover" class="table-goods-pic">
<div slot="error" class="image-slot">
<i class="el-icon-picture-outline"></i>
</div>
</el-image>
<div class="table-goods-name">{{ row.spu_name }}</div>
</div>
</template>
<template v-slot:table-view="{ row }">
<p>访客数：{{ row.usesr_view }}</p>
<p>浏览量：{{ row.page_view }}</p>
</template>
<template v-slot:table-x="{ row }">
<el-button type="text" @click="handleUpdate(row)">编辑</el-button>
<el-button type="text" @click="handlePromote(row)">推广</el-button>
......@@ -74,27 +88,37 @@ export default {
}
],
columns: [
{ type: 'selection', align: 'left' },
{ label: '商品名', prop: 'spu_name' },
{ label: '价格(元)', prop: 'price_zone' },
{ label: '访问量', prop: 'page_view' },
{ label: '库存', prop: 'stock' },
{ label: '销量', prop: 'sales_volume' },
{ label: '创建时间', prop: 'create_time', width: 180 },
{ type: 'selection' },
{ label: '商品名', prop: 'spu_name', slots: 'table-goods', minWidth: 140 },
{ label: '价格(元)', prop: 'price_zone', align: 'center' },
{ label: '访问量', prop: 'page_view', slots: 'table-view', minWidth: 120 },
{ label: '库存', prop: 'stock', align: 'center' },
{ label: '销量', prop: 'sales_volume', align: 'center' },
{ label: '创建时间', prop: 'create_time', width: 110 },
{
label: '商品状态',
prop: 'status',
align: 'center',
computed({ row }) {
const map = { 1: '仓库中', 2: '销售中', 3: '已售罄', 4: '下架', 5: '已删除' }
return map[row.status]
}
},
{ label: '操作', slots: 'table-x', width: 150 }
{ label: '操作', slots: 'table-x', align: 'right', width: 150 }
]
}
}
},
methods: {
imageUrl(value) {
try {
const imgList = value ? JSON.parse(value) : []
const [first = {}] = imgList
return first.url
} catch (error) {
return ''
}
},
beforeRequest(params) {
params.status = this.activeName === '0' ? '' : this.activeName
return params
......@@ -145,3 +169,33 @@ export default {
}
}
</script>
<style lang="scss">
.table-goods {
display: flex;
align-items: center;
}
.table-goods-pic {
margin-right: 10px;
width: 60px;
height: 60px;
}
.table-goods-name {
flex: 1;
color: #3276fc;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
}
.image-slot {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
background: #f5f7fa;
color: #909399;
font-size: 14px;
}
</style>
src/pages/order/detail.vue
浏览文件 @ 90a27164
差异被折叠。
src/pages/order/index.vue
浏览文件 @ 90a27164
......@@ -10,14 +10,22 @@
<el-button type="primary">新增订单</el-button>
</router-link>
</template>
<template v-slot:table-goods="{ row }">
<div class="table-goods">
<el-image :src="imageUrl(row.chart_oss)" fit="cover" class="table-goods-pic">
<div slot="error" class="image-slot">
<i class="el-icon-picture-outline"></i>
</div>
</el-image>
<div class="table-goods-name">{{ row.spu_name }}</div>
</div>
</template>
<template v-slot:table-price="{ row }">
<p>{{ row.product_price }}</p>
<p>{{ row.buy_count }}</p>
<p>1件</p>
</template>
<template v-slot:table-x="{ row }">
<el-button type="text" @click="handleUpdate(row)">编辑</el-button>
<el-button type="text" @click="handlePromote(row)">推广</el-button>
<el-button type="text" @click="handleCopy(row)">复制</el-button>
<el-button type="text" @click="handleView(row)">查看</el-button>
</template>
</table-list>
</app-card>
......@@ -37,7 +45,7 @@ export default {
activeName: '0',
tabList: [
{ label: '全部', name: '0' },
{ label: '代付款', name: '2' },
{ label: '待付款', name: '2' },
{ label: '待发货', name: '3' },
{ label: '已发货', name: '4' },
{ label: '已完成', name: '5' },
......@@ -52,53 +60,118 @@ export default {
return {
remote: {
httpRequest: getOrderList,
params: { shop_id: this.$store.state.shopId },
params: { shop_id: this.$store.state.shopId, spu_id: '', order_status: '' },
beforeRequest: this.beforeRequest
},
filters: [
{
type: 'input',
prop: 'name',
placeholder: '请输入商品名称'
prop: 'spu_id',
placeholder: '请输入商品编号'
},
{
type: 'select',
prop: 'group_id',
prop: 'order_status',
options: [
{ label: '活动', value: 1 },
{ label: '报名费', value: 2 },
{ label: '学费', value: 3 },
{ label: '活动', value: 4 }
]
{ label: '待付款', name: '2' },
{ label: '待发货', name: '3' },
{ label: '已发货', name: '4' },
{ label: '已完成', name: '5' },
{ label: '已关闭', name: '6' },
{ label: '售后中', name: '7' }
],
valueKey: 'name'
}
],
columns: [
{ label: '商品', prop: 'shop_name' },
{ label: '单价(元)/数量', prop: 'product_price', slots: 'table-price' },
{ label: '售后', prop: 'sellPrice' },
{ label: '买家 / 收货人', prop: 'shipping_user' },
{ label: '配送方式', prop: 'sellCount' },
{ label: '实收金额(元)', prop: 'payment_money' },
{ label: '订单状态', prop: 'order_status' },
{ label: '操作', slots: 'table-x' }
{ label: '商品', prop: 'shop_name', slots: 'table-goods', minWidth: 140 },
{ label: '单价(元)/数量', prop: 'product_price', slots: 'table-price', align: 'right' },
{ label: '订单号', prop: 'order_id' },
{ label: '下单时间', prop: 'create_time', width: 110 },
{ label: '买家 / 收货人', prop: 'shipping_user', align: 'center' },
{ label: '实收金额(元)', prop: 'payment_money', align: 'center' },
{
label: '支付方式',
prop: 'payment_method',
align: 'center',
computed({ row }) {
const map = {
1: '现金',
2: '余额',
3: '网银',
4: '支付宝',
5: '微信',
7: '微信JSAPI',
8: '微信H5'
}
return map[row.payment_method]
}
},
{
label: '订单状态',
prop: 'order_status',
align: 'center',
computed({ row }) {
const map = { 1: '待付款', 2: '待发货', 3: '已发货', 4: '已完成', 5: '已关闭', 6: '售后' }
return map[row.order_status]
}
},
{ label: '操作', slots: 'table-x', align: 'right', width: 60 }
]
}
}
},
methods: {
imageUrl(value) {
try {
const imgList = value ? JSON.parse(value) : []
const [first = {}] = imgList
return first.url
} catch (error) {
return ''
}
},
beforeRequest(params) {
params.status = this.activeName === '0' ? '' : this.activeName
// params.order_status = this.activeName === '0' ? '' : this.activeName
return params
},
handleClick() {
this.$refs.list.refetch(true)
},
// 编辑
handleUpdate() {},
// 推广
handlePromote() {},
// 复制
handleCopy() {}
// 查看
handleView(row) {
this.$router.push({ name: 'orderDetail', params: { id: row.order_id } })
}
}
}
</script>
<style lang="scss">
.table-goods {
display: flex;
align-items: center;
}
.table-goods-pic {
margin-right: 10px;
width: 60px;
height: 60px;
}
.table-goods-name {
flex: 1;
color: #3276fc;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
}
.image-slot {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
background: #f5f7fa;
color: #909399;
font-size: 14px;
}
</style>
src/pages/preview.vue
浏览文件 @ 90a27164
<template>
<div class="preview"></div>
<div class="preview">
<div class="preview-hd">
<div class="preview-hd-inner">
<div class="preview-hd-left">预览：<span class="active">手机版</span><span>PC版</span></div>
<div class="preview-hd-right">
<el-button size="small" type="primary" plain @click="handleEdit">编辑本商品</el-button>
<el-button size="small" type="primary" plain @click="handleAdd">发布新商品</el-button>
<el-button size="small" type="primary" @click="handleClose">关闭</el-button>
</div>
</div>
</div>
<div class="preview-bd"></div>
</div>
</template>
<script>
export default {}
export default {
computed: {
shopId() {
return this.$route.query.shop_id
},
goodsId() {
return this.$route.query.id
}
},
methods: {
handleEdit() {
this.$router.push({ name: 'goodsEdit', params: { id: this.goodsId } })
},
handleAdd() {
this.$router.push({ name: 'goodsAdd' })
},
handleClose() {
this.$router.replace({ name: 'goodsList' })
}
}
}
</script>
<style>
<style lang="scss">
.preview-hd {
background-color: #fff;
border-bottom: 1px solid #c1c1c1;
}
.preview-hd-inner {
display: flex;
align-items: center;
max-width: 720px;
margin: 0 auto;
padding: 10px 0;
}
.preview-hd-left {
flex: 1;
span {
margin-right: 20px;
}
.active {
border-bottom: 1px solid #3276fc;
}
}
</style>
src/router/routes.js
浏览文件 @ 90a27164
......@@ -33,6 +33,7 @@ export default [
meta: { title: '商品' },
children: [
{
name: 'goodsList',
path: '',
component: () => import(/* webpackChunkName: "goods" */ '@/pages/goods/goods/index'),
meta: { title: '商品列表' }
......@@ -64,15 +65,17 @@ export default [
meta: { title: '订单' },
children: [
{
name: 'orderList',
path: '',
component: () => import(/* webpackChunkName: "order" */ '@/pages/order/index'),
meta: { title: '订单列表' }
},
{
name: 'orderDetail',
path: 'detail/:id',
component: () => import(/* webpackChunkName: "order" */ '@/pages/order/detail'),
meta: { title: '订单详情' }
}
// {
// path: 'detail/:id',
// component: orderDetail,
// meta: { title: '订单详情' }
// }
]
},
// 设置
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论