1、新增旧货市场
2、新增用户等级
This commit is contained in:
+119
-5
@@ -5,7 +5,7 @@
|
||||
<category-bar></category-bar>
|
||||
<view class="w-1200 m-a">
|
||||
<view class="mt-20 bg-white rounded p-20">
|
||||
<view class="flex justify-between">
|
||||
<view class="flex justify-between pb-20 border-bottom">
|
||||
<text class="font-bold text-40">
|
||||
购物车(全部{{ list.length }})
|
||||
</text>
|
||||
@@ -15,6 +15,75 @@
|
||||
<el-button type="primary" round>结算</el-button>
|
||||
</view>
|
||||
</view>
|
||||
<view class="py-20">
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="3">
|
||||
<el-checkbox v-model="selectedAll" @change="doSelectAll">
|
||||
<view class="text-35 font-bold">全选</view>
|
||||
</el-checkbox>
|
||||
</el-col>
|
||||
<el-col :span="9">
|
||||
<text class="text-35 font-bold w-">商品信息</text>
|
||||
</el-col>
|
||||
<el-col :span="3">
|
||||
<text class="text-35 font-bold flex-1">单价</text>
|
||||
</el-col>
|
||||
<el-col :span="3">
|
||||
<text class="text-35 font-bold flex-1">数量</text>
|
||||
</el-col>
|
||||
<el-col :span="3">
|
||||
<text class="text-35 font-bold flex-1">金额</text>
|
||||
</el-col>
|
||||
<el-col :span="3">
|
||||
<text class="text-35 font-bold flex-1">操作</text>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</view>
|
||||
<view class="p-20 mb-20" v-for="(item, index) in list" :key="index"
|
||||
:class="[item.checked ? 'active' :'']">
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="12">
|
||||
<view class="flex justify-start items-start">
|
||||
<el-checkbox v-model="list[index].checked" @change="changeCheck($event, item._id)">
|
||||
</el-checkbox>
|
||||
<el-image :src="item.goods.cover" class="cover ml-20" fit="fit"/>
|
||||
<view class="flex flex-col justify-start items-start ml-20">
|
||||
{{ item.goods.name }}
|
||||
</view>
|
||||
</view>
|
||||
</el-col>
|
||||
<el-col :span="3">
|
||||
<text class="text-35 font-bold flex-1">￥{{ item.goods.amount }}</text>
|
||||
</el-col>
|
||||
<el-col :span="3">
|
||||
<text class="text-35 font-bold flex-1">
|
||||
<el-input-number v-model="list[index].num" @change="changeNum" :min="1" size="small"/>
|
||||
</text>
|
||||
</el-col>
|
||||
<el-col :span="3">
|
||||
<text class="text-35 font-bold flex-1 text-main">￥{{
|
||||
parseFloat(item.goods.amount) * item.num
|
||||
}}
|
||||
</text>
|
||||
</el-col>
|
||||
<el-col :span="3">
|
||||
<el-button type="info" @click.native="remove(index)">移出购物车</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</view>
|
||||
<view class="mt-20 flex justify-between items-center">
|
||||
<el-button type="text">移出购物车</el-button>
|
||||
<view class="flex justify-end items-center">
|
||||
<view>
|
||||
<text>已选商品</text>
|
||||
<text class="mx-15 font-bold text-35 text-main">{{ selectedList.length }}</text>
|
||||
<text>件</text>
|
||||
</view>
|
||||
<text class="ml-35">合计(不含运费):</text>
|
||||
<text class="mx-15 font-bold text-40 text-main">￥{{ amount }}</text>
|
||||
<el-button type="primary" round :disabled="selectedList.length === 0">结算</el-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<gap height="50"/>
|
||||
@@ -29,7 +98,7 @@ export default {
|
||||
return {
|
||||
list: [],
|
||||
selectedList: [],
|
||||
|
||||
selectedAll: false,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
@@ -37,16 +106,61 @@ export default {
|
||||
const {rows} = await vk.callFunction({
|
||||
url: "client/cart/kh/getList"
|
||||
})
|
||||
this.list = rows
|
||||
this.list = rows.map(item => {
|
||||
item.checked = false
|
||||
return item
|
||||
})
|
||||
},
|
||||
doSelectAll() {
|
||||
this.list.forEach((item, index) => {
|
||||
this.list[index].checked = this.selectedAll
|
||||
})
|
||||
},
|
||||
changeNum(e) {
|
||||
console.log(e)
|
||||
},
|
||||
changeCheck(e, id) {
|
||||
const index = this.selectedList.indexOf(id)
|
||||
if (index === -1) this.selectedList.push(id)
|
||||
else this.selectedList.splice(index, 1)
|
||||
this.selectedAll = this.selectedList.length === this.list.length
|
||||
},
|
||||
remove(index) {
|
||||
this.list.splice(index, 1)
|
||||
vk.callFunction({
|
||||
url: "client/cart/kh/delete",
|
||||
data: {
|
||||
ids: [this.list[index]._id]
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
onShow() {
|
||||
this.getList()
|
||||
},
|
||||
computed: {
|
||||
amount() {
|
||||
return 0
|
||||
let tmpAmount = 0
|
||||
this.list.forEach(item => {
|
||||
console.log(item.checked)
|
||||
if (item.checked) tmpAmount += parseFloat(item.goods.amount) * parseInt(item.num)
|
||||
})
|
||||
return tmpAmount
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.cover {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
.active {
|
||||
border: 1px solid #C23436;
|
||||
border-radius: 10px;
|
||||
background-color: #FFF9F6;
|
||||
}
|
||||
</style>
|
||||
+70
-45
@@ -12,14 +12,14 @@
|
||||
<view class="my-20">
|
||||
<text class="font-bold text-35">商品详情</text>
|
||||
<view class="flex justify-start items-start my-20">
|
||||
<text class="w-15p">封面</text>
|
||||
<text class="w-15p" v-if="info.type === 0">封面</text>
|
||||
<text class="w-40p">名称</text>
|
||||
<text class="w-15p">数量</text>
|
||||
<text class="w-15p">单价</text>
|
||||
<text class="w-15p">小计</text>
|
||||
</view>
|
||||
<view class="flex justify-start items-start my-20" v-for="(item, index) in info.goods" :key="index">
|
||||
<text class="w-15p">
|
||||
<text class="w-15p" v-if="info.type === 0">
|
||||
<image :src="item.goodsCover" mode="aspectFit" class="goods-cover"/>
|
||||
</text>
|
||||
<text class="w-40p font-bold text-35">{{ item.goodsName }}</text>
|
||||
@@ -29,50 +29,56 @@
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<el-row :gutter="10" class="mb-20">
|
||||
<el-col :span="4">
|
||||
<el-input v-model="name" placeholder="请输入收件人姓名"/>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-input v-model="phone" placeholder="请输入收件人手机号"/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="10" class="border-bottom pb-20">
|
||||
<el-col :span="4">
|
||||
<el-select v-model="addressIndex[0]" placeholder="请选择省">
|
||||
<el-option v-for="(item, index) in provinceData" :key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="addressIndex[1]" placeholder="请选择市" :disabled="addressIndex.length === 0">
|
||||
<template v-if="addressIndex[0] !== null">
|
||||
<el-option v-for="(item, index) in cityData[addressIndex[0]]" :key="index"
|
||||
<template v-if="info.type === 0">
|
||||
<el-row :gutter="10" class="mb-20">
|
||||
<el-col :span="4">
|
||||
<el-input v-model="name" placeholder="请输入收件人姓名"/>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-input v-model="phone" placeholder="请输入收件人手机号"/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="10" class="border-bottom pb-20">
|
||||
<el-col :span="4">
|
||||
<el-select v-model="addressIndex[0]" placeholder="请选择省">
|
||||
<el-option v-for="(item, index) in provinceData" :key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="addressIndex[2]" placeholder="请选择区" :disabled="addressIndex.length === 1">
|
||||
<template v-if="addressIndex[0] !== null && addressIndex[1] !== null">
|
||||
<el-option v-for="(item, index) in areaData[addressIndex[0]][addressIndex[1]]" :key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-input v-model="addressDetail" placeholder="请输入详细地址"/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="addressIndex[1]" placeholder="请选择市"
|
||||
:disabled="addressIndex.length === 0">
|
||||
<template v-if="addressIndex[0] !== null">
|
||||
<el-option v-for="(item, index) in cityData[addressIndex[0]]" :key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="addressIndex[2]" placeholder="请选择区"
|
||||
:disabled="addressIndex.length === 1">
|
||||
<template v-if="addressIndex[0] !== null && addressIndex[1] !== null">
|
||||
<el-option v-for="(item, index) in areaData[addressIndex[0]][addressIndex[1]]"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-input v-model="addressDetail" placeholder="请输入详细地址"/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
<view class="mt-20 w-50p flex flex-col justify-center items-center m-a">
|
||||
<text class="text-main font-bold text-40 mb-20">订单金额:￥{{ info.amount }}</text>
|
||||
<el-button type="primary" round :disabled="!phone || !name || addressIndex.length < 3" @click="onPay">
|
||||
<text class="text-main font-bold text-40 mb-20" v-if="info">订单金额:￥{{ info.amount }}</text>
|
||||
<el-button type="primary" round
|
||||
:disabled="(info.type === 0 && (!phone || !name || addressIndex.length < 3))" @click="onPay">
|
||||
立即支付
|
||||
</el-button>
|
||||
</view>
|
||||
@@ -106,7 +112,9 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
id: null,
|
||||
info: null,
|
||||
info: {
|
||||
type: null
|
||||
},
|
||||
provinceData: provinces,
|
||||
cityData: citys,
|
||||
areaData: areas,
|
||||
@@ -128,7 +136,7 @@ export default {
|
||||
})
|
||||
if (this.info.orderStatus === 1) {
|
||||
this.$message({
|
||||
type:'success',
|
||||
type: 'success',
|
||||
message: '订单已支付成功'
|
||||
})
|
||||
setTimeout(() => {
|
||||
@@ -138,7 +146,21 @@ export default {
|
||||
}, 1000)
|
||||
}
|
||||
},
|
||||
onPay() {
|
||||
async onPay() {
|
||||
if (this.info.type === 0) {
|
||||
if (this.addressIndex.length > 2 && this.addressIndex[2] === null) {
|
||||
await vk.callFunction({
|
||||
url: 'client/order/kh/updateAddress',
|
||||
data: {
|
||||
id: this.id,
|
||||
address: [provinces[this.addressIndex[0]], citys[this.addressIndex[0]][this.addressIndex[1]], areas[this.addressIndex[0]][this.addressIndex[1]][this.addressIndex[2]]],
|
||||
addressDetail: this.addressDetail,
|
||||
phone: this.phone,
|
||||
name: this.name,
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
const requestTimestamp = dayjs().format('YYYY-MM-DD HH:mm:ss')
|
||||
const timestamp = dayjs().format('YYYYMMDDHHmmss')
|
||||
const goods = []
|
||||
@@ -183,6 +205,9 @@ export default {
|
||||
this.id = options.id
|
||||
this.getInfo()
|
||||
}
|
||||
},
|
||||
onUnload() {
|
||||
if (this.checkPayInterval) clearInterval(this.checkPayInterval)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -8,7 +8,8 @@
|
||||
<view class="tool-bar">
|
||||
<view class="search">
|
||||
<text>地区：</text>
|
||||
<el-cascader :options="options" :props="{label: 'name', value: 'code'}" v-model="address"/>
|
||||
<el-cascader :options="options" :props="{label: 'name', value: 'code'}" v-model="address"
|
||||
@change="getGoodsList()" clearable/>
|
||||
</view>
|
||||
<view class="buy-btn">
|
||||
<image src="https://oss.wsdns.cn/20231204/bcc976f4396e437abf19deb11c1f06b4.png" mode="widthFix"/>
|
||||
@@ -16,8 +17,11 @@
|
||||
</view>
|
||||
<view class="tool-bar">
|
||||
<view class="item">分类：</view>
|
||||
<view class="item">全部</view>
|
||||
<view class="item" v-for="(item, index) in categoryList" :key="index">{{ item.name }}</view>
|
||||
<view class="item" @click="selectCate(null)">全部</view>
|
||||
<view class="item" v-for="(item, index) in categoryList" :key="index"
|
||||
@click="selectCate(item._id)"
|
||||
:class="[categoryId === item._id? 'active' : '']">{{ item.name }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@@ -42,7 +46,10 @@
|
||||
<el-pagination
|
||||
background
|
||||
layout="prev, pager, next"
|
||||
:total="1000">
|
||||
:total="total"
|
||||
:page-size="pageSize"
|
||||
@click="getGoodsList"
|
||||
>
|
||||
</el-pagination>
|
||||
</div>
|
||||
</view>
|
||||
@@ -79,7 +86,11 @@ export default {
|
||||
}
|
||||
],
|
||||
options: [],
|
||||
address: []
|
||||
address: [],
|
||||
pageIndex: 1,
|
||||
pageSize: 20,
|
||||
total: 0,
|
||||
categoryId: null
|
||||
};
|
||||
},
|
||||
onLoad(options) {
|
||||
@@ -112,14 +123,24 @@ export default {
|
||||
this.categoryList = res.rows
|
||||
})
|
||||
},
|
||||
getGoodsList() {
|
||||
getGoodsList(pageIndex = 1) {
|
||||
vk.callFunction({
|
||||
url: 'client/goods/list/pub/getList'
|
||||
url: 'client/goods/list/pub/getList',
|
||||
data: {
|
||||
pageIndex,
|
||||
pageSize: this.pageSize,
|
||||
city: this.address.length > 1 ? this.address[1] : null,
|
||||
parentId: this.categoryId
|
||||
}
|
||||
}).then(res => {
|
||||
this.goodsList = res.rows
|
||||
})
|
||||
},
|
||||
|
||||
selectCate(cateId) {
|
||||
if (this.categoryId === cateId) this.categoryId = null
|
||||
else this.categoryId = cateId
|
||||
this.getGoodsList()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -146,7 +167,7 @@ export default {
|
||||
|
||||
.tool-bar {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
padding: 20px;
|
||||
font-size: 16px;
|
||||
@@ -155,6 +176,16 @@ export default {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.item {
|
||||
margin-right: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.item:hover, .active {
|
||||
color: #bf2b28;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user