韩昌 / 3z-healthMall-v3-uni · 提交

转到一个项目

作者 韩昌
提交 c97f1a9580cd343eae22b69b5bb77aa99fbaa973 1 个父辈 7b2d3b33

10.47修改bug

内嵌 并排对比
正在显示 41 个修改的文件 包含 2308 行增加 和 2101 行删除

要显示太多修改。
重新载入完整差异 差异文件 邮件补丁

为保证性能只显示 41 of 41+ 个文件。

export default {
// 上传图片
upload (url, callBack) {
let arr = {}
uni.chooseImage({
success: chooseImageRes => {
const tempFilePaths = chooseImageRes.tempFilePaths
arr['avatar'] = tempFilePaths[0]
uni.uploadFile({
url: url, //仅为示例，非真实的接口地址
filePath: tempFilePaths[0],
name: 'file',
formData: {
user: 'test',
token: uni.getStorageSync('token')
},
success: uploadFileRes => {
console.log(JSON.parse(uploadFileRes.data), '图片路径')
arr['upImg'] = JSON.parse(uploadFileRes.data).data.url
// console.log(arr, '没问题')
callBack(arr)
}
})
}
})
},
//支付
pay(res) {
if(res.appId) {
uni.requestPayment({
"provider": "wxpay",
timeStamp: res.timeStamp, // 时间戳（单位：秒）
nonceStr: res.nonceStr, // 随机字符串1
package: res.package, // 固定值
signType: res.signType, // 签名，这里用的 MD5/RSA 签名
appid: res.appId, // 微信开放平台 - 应用 - AppId，注意和微信小程序、公众号 AppId 可能不一致1
paySign:res.paySign,
success(res) {
console.log('支付成功')
uni.showToast({ title: '支付成功~'})
setTimeout(()=>{
uni.navigateBack()
},1500)
},
fail(e) {
console.log('支付失败',e)
uni.showToast({ title: '支付取消~', icon: "none", })
}
})
}
},
// 提示,一秒后返回上一页
showTN(title) {
uni.showToast({title: title,icon:"none"})
setTimeout(()=>{
uni.navigateBack()
},1000)
}
// 上传图片
upload(url, callBack) {
let arr = {}
uni.chooseImage({
success: chooseImageRes => {
const tempFilePaths = chooseImageRes.tempFilePaths
arr['avatar'] = tempFilePaths[0]
uni.uploadFile({
url: url, //仅为示例，非真实的接口地址
filePath: tempFilePaths[0],
name: 'file',
formData: {
user: 'test',
token: uni.getStorageSync('token')
},
success: uploadFileRes => {
console.log(JSON.parse(uploadFileRes.data), '图片路径')
arr['upImg'] = JSON.parse(uploadFileRes.data).data.url
// console.log(arr, '没问题')
callBack(arr)
}
})
}
})
},
//支付
pay(res) {
if (res.appId) {
uni.requestPayment({
provider: 'wxpay',
timeStamp: res.timeStamp, // 时间戳（单位：秒）
nonceStr: res.nonceStr, // 随机字符串1
package: res.package, // 固定值
signType: res.signType, // 签名，这里用的 MD5/RSA 签名
appid: res.appId, // 微信开放平台 - 应用 - AppId，注意和微信小程序、公众号 AppId 可能不一致1
paySign: res.paySign,
success(res) {
console.log('支付成功')
uni.showToast({ title: '支付成功~' })
setTimeout(() => {
uni.navigateBack()
}, 1500)
},
fail(e) {
console.log('支付失败', e)
uni.showToast({ title: '支付取消~', icon: 'none' })
}
})
}
},
// 提示,一秒后返回上一页
showTN(title) {
uni.showToast({ title: title, icon: 'none' })
setTimeout(() => {
uni.navigateBack()
}, 1000)
}
}
... ...
<template>
<view class="">
<!-- 方式支付弹窗 -->
<u-popup :show="modeShow" bgColor="#F6F8FA" :closeable="true" round="12" @close="canclePop">
<view class="popBox iosAuto">
<view class="title">选择支付方式</view>
<view class="popModeBox flexJ" v-for="(item,index) in payMode" :key="item.id" @click="checkPay(index)">
<view class="mode flexA">
<image :src="item.modeUrl" mode=""></image>
{{item.name}}
</view>
<image v-if="item.shows" :src=" defaultMode == index ? '/static/shopCarIc/modeCheck.png': '/static/shopCarIc/checks.png'" mode=""></image>
<view class="insufficient flexA" v-else @click="goRecharge">
余额不足
<view class="go flexA">
去充值
<image src="/static/indexIc/orangeRight.png" mode=""></image>
</view>
</view>
</view>
<view class="subOrder flexC" @click="subOrder">提交订单</view>
</view>
</u-popup>
</view>
<view class="">
<!-- 方式支付弹窗 -->
<u-popup :show="modeShow" bgColor="#F6F8FA" :closeable="true" round="12" @close="canclePop">
<view class="popBox iosAuto">
<view class="title">选择支付方式</view>
<view class="popModeBox flexJ" v-for="(item, index) in payMode" :key="item.id" @click="checkPay(index)">
<view class="mode flexA">
<image :src="item.modeUrl" mode=""></image>
{{ item.name }}
</view>
<image v-if="item.shows" :src="defaultMode == index ? '/static/shopCarIc/modeCheck.png' : '/static/shopCarIc/checks.png'" mode=""></image>
<view class="insufficient flexA" v-else @click="goRecharge">
余额不足
<view class="go flexA">
去充值
<image src="/static/indexIc/orangeRight.png" mode=""></image>
</view>
</view>
</view>
<view class="subOrder flexC" @click="subOrder">提交订单</view>
</view>
</u-popup>
</view>
</template>
<script setup>
import { ref,reactive,onMounted,getCurrentInstance,defineEmits,watchEffect } from 'vue'
import {onShow,onLoad} from '@dcloudio/uni-app'
import { getPay,getOrderPay,getCarPay } from '@/api/'
const props = defineProps({
payParams:{
type:Object,
default:{}
},
modeShow:{
type:Boolean,
default:false
},
adressId:{
type:String,
default:''
},
// 商品总价
totalPrice:{
type:String,
default:0
},
// 余额
balance:{
type:String,
default:0
},
// 是否订单支付
isOrderPay:{
type:Boolean,
default:false
},
orderId:{
type:String,
default:''
},
// 购物车id
carId:{
type:String,
default:''
}
})
onMounted(()=> {
setTimeout(()=>{
if(props.totalPrice >props.balance) {
payMode[1].shows = false
}
},100)
})
watchEffect(()=>{
// console.log('余额',props.balance) 余额不足点击充值，返回页面刷新余额
if(props.totalPrice < props.balance) {
payMode[1].shows = true
}
})
// 支付方式数组
const payMode = reactive([{id:1,name:'微信支付',check:true,modeUrl:'/static/shopCarIc/weCaat.png',shows:true},
{id:2,name:'余额支付',check:false,modeUrl:'/static/shopCarIc/yue.png',shows:true}])
// 余额是否为0
let balance = ref(0)
// 默认支付方式
let defaultMode = ref(0)
// 选择支付方式
let checkPay = (index)=> {
defaultMode.value = index
}
// 支付方式弹窗提交订单按钮
const subOrder = ()=> {
if(props.car_Id) {
console.log('购物车支付',props.car_Id)
getCarPays()
} else {
console.log('dindan支付',props.car_Id)
//订单支付 普通支付
props.isOrderPay ? getOrderPays() : getPays()
}
}
// 去充值
const goRecharge = ()=> {
uni.navigateTo({ url:'/pages/mine/recharge' })
}
const emit = defineEmits(['canclePop'])
const canclePop = ()=> {
emit('canclePop')
}
const { proxy } = getCurrentInstance() //获取当前实例
// 支付
const getPays = async ()=>{
try {
let { id,num,specId } = props.payParams
let params = {
goods_id:id, //integer 是 商品ID
num:num, //integer 是 数量
goods_spec_id:specId, //integer 是 规格ID
address_id:props.adressId, //integer 是 地址ID
fangs:defaultMode.value == 0 ? 1 : 2, //integer 否 支付方式:1是微信支付,2是余额支付
remark:'' //string 否 备注
}
const res = await getPay(params)
proxy.$methods.pay(res)
canclePop()
console.log('getPay', res)
uni.showToast({ title: '支付成功', icon: 'none' })
setTimeout(() => {
uni.navigateBack()
}, 1500);
// 保存数据
} catch (err) {
uni.showToast({ title:err,icon:'none' })
console.log('getPay', err)
}
}
// 购物车支付
const getCarPays = async ()=> {
try {
let params = {
cart_ids:props.car_Id, //string 是 购物车ID，多个英文逗号隔开
address_id:props.adressId, //integer 是 地址ID
remark:'', //string 否 备注
fangs:defaultMode.value == 0 ? 1 : 2, //integer 否 支付方式:2是余额支付
}
const res = await getCarPay(params)
proxy.$methods.showTN('余额支付成功~')
canclePop()
console.log('getCarPay', res)
// 保存数据
} catch (err) {
uni.showToast({ title:err,icon:'none' })
console.log('getCarPay', err)
}
}
// 订单支付
const getOrderPays = async ()=> {
try {
const res = await getOrderPay(props.orderId,defaultMode.value == 0 ? 1 : 2)
proxy.$methods.pay(res)
canclePop()
console.log('getOrderPay', res)
// 保存数据
} catch (err) {
uni.showToast({ title:err,icon:'none' })
console.log('getOrderPay', err)
}
}
import { ref, reactive, onMounted, getCurrentInstance, defineEmits, watchEffect } from 'vue'
import { onShow, onLoad } from '@dcloudio/uni-app'
import { getPay, getOrderPay, getCarPay } from '@/api/'
const props = defineProps({
payParams: {
type: Object,
default: {}
},
modeShow: {
type: Boolean,
default: false
},
adressId: {
type: String,
default: ''
},
// 商品总价
totalPrice: {
type: String,
default: 0
},
// 余额
balance: {
type: String,
default: 0
},
// 是否订单支付
isOrderPay: {
type: Boolean,
default: false
},
orderId: {
type: String,
default: ''
},
// 购物车id
carId: {
type: String,
default: ''
}
})
onMounted(() => {
setTimeout(() => {
if (props.totalPrice > props.balance) {
payMode[1].shows = false
}
}, 100)
})
watchEffect(() => {
// console.log('余额',props.balance) 余额不足点击充值，返回页面刷新余额
if (props.totalPrice < props.balance) {
payMode[1].shows = true
}
})
// 支付方式数组
const payMode = reactive([
{ id: 1, name: '微信支付', check: true, modeUrl: '/static/shopCarIc/weCaat.png', shows: true },
{ id: 2, name: '余额支付', check: false, modeUrl: '/static/shopCarIc/yue.png', shows: true }
])
// 余额是否为0
let balance = ref(0)
// 默认支付方式
let defaultMode = ref(0)
// 选择支付方式
let checkPay = index => {
defaultMode.value = index
}
// 支付方式弹窗提交订单按钮
const subOrder = () => {
if (props.car_Id) {
console.log('购物车支付', props.car_Id)
getCarPays()
} else {
console.log('dindan支付', props.car_Id)
//订单支付 普通支付
props.isOrderPay ? getOrderPays() : getPays()
}
}
// 去充值
const goRecharge = () => {
uni.navigateTo({ url: '/pages/mine/recharge' })
}
const emit = defineEmits(['canclePop'])
const canclePop = () => {
emit('canclePop')
}
const { proxy } = getCurrentInstance() //获取当前实例
// 支付
const getPays = async () => {
try {
let { id, num, specId } = props.payParams
let params = {
goods_id: id, //integer 是 商品ID
num: num, //integer 是 数量
goods_spec_id: specId, //integer 是 规格ID
address_id: props.adressId, //integer 是 地址ID
fangs: defaultMode.value == 0 ? 1 : 2, //integer 否 支付方式:1是微信支付,2是余额支付
remark: '' //string 否 备注
}
const res = await getPay(params)
proxy.$methods.pay(res)
canclePop()
// console.log('getPay', res)
// uni.showToast({ title: '支付成功', icon: 'none' })
// setTimeout(() => {
// uni.navigateBack()
// }, 1500);
// 保存数据
} catch (err) {
uni.showToast({ title: err, icon: 'none' })
console.log('getPay', err)
}
}
// 购物车支付
const getCarPays = async () => {
try {
let params = {
cart_ids: props.car_Id, //string 是 购物车ID，多个英文逗号隔开
address_id: props.adressId, //integer 是 地址ID
remark: '', //string 否 备注
fangs: defaultMode.value == 0 ? 1 : 2 //integer 否 支付方式:2是余额支付
}
const res = await getCarPay(params)
proxy.$methods.showTN('余额支付成功~')
canclePop()
console.log('getCarPay', res)
// 保存数据
} catch (err) {
uni.showToast({ title: err, icon: 'none' })
console.log('getCarPay', err)
}
}
// 订单支付
const getOrderPays = async () => {
try {
const res = await getOrderPay(props.orderId, defaultMode.value == 0 ? 1 : 2)
proxy.$methods.pay(res)
canclePop()
console.log('getOrderPay', res)
// 保存数据
} catch (err) {
uni.showToast({ title: err, icon: 'none' })
console.log('getOrderPay', err)
}
}
</script>
<style lang="scss">
.popBox {
padding: 32rpx 24rpx 0;
.title {
text-align: center;
margin-bottom: 60rpx;
color: #000000e6;
font-size: 32rpx;
font-weight: 700;
}
.popModeBox {
width: 100%;
padding: 32rpx 20rpx;
box-sizing: border-box;
border-radius: 16rpx;
background: #ffffffff;
.mode {
color: #000000e6;
font-size: 28rpx;
font-weight: 700;
image {
width: 52rpx;
height: 52rpx;
margin-right: 20rpx;
}
}
image {
width: 36rpx;
height: 36rpx;
}
.insufficient {
color: #00000066;
font-size: 24rpx;
.go {
margin-left: 8rpx;
font-size: 24rpx;
color: #FB3E3C;
line-height: 32rpx;
image {
width: 24rpx;
height: 24rpx;
}
}
}
}
.subOrder {
margin-top: 138rpx;
width: 100%;
height: 88rpx;
border-radius: 280rpx;
color: #ffffffff;
font-size: 32rpx;
font-weight: 700;
background: linear-gradient(139deg, #fb753cff 0%, #fb3e3cff 100%);
}
}
</style>
\ No newline at end of file
.popBox {
padding: 32rpx 24rpx 0;
.title {
text-align: center;
margin-bottom: 60rpx;
color: #000000e6;
font-size: 32rpx;
font-weight: 700;
}
.popModeBox {
width: 100%;
padding: 32rpx 20rpx;
box-sizing: border-box;
border-radius: 16rpx;
background: #ffffffff;
.mode {
color: #000000e6;
font-size: 28rpx;
font-weight: 700;
image {
width: 52rpx;
height: 52rpx;
margin-right: 20rpx;
}
}
image {
width: 36rpx;
height: 36rpx;
}
.insufficient {
color: #00000066;
font-size: 24rpx;
.go {
margin-left: 8rpx;
font-size: 24rpx;
color: #fb3e3c;
line-height: 32rpx;
image {
width: 24rpx;
height: 24rpx;
}
}
}
}
.subOrder {
margin-top: 138rpx;
width: 100%;
height: 88rpx;
border-radius: 280rpx;
color: #ffffffff;
font-size: 32rpx;
font-weight: 700;
background: linear-gradient(139deg, #fb753cff 0%, #fb3e3cff 100%);
}
}
</style>
... ...
... ... @@ -12,14 +12,14 @@
<view class="priceBox flexJ" v-if="it.goodstatus != 3">
<text>￥{{ it.total_price }}</text>
<view class="reality flexA">
<view class="shi">实付款:</view>
<view class="shi">{{ textHandler(shop.order_status) }}</view>
<text>￥</text>
<view class="price">{{ it.total_price }}</view>
</view>
</view>
<!-- 积分商品 -->
<view class="pointsShop" v-else>
<text>需付款：</text>
<text>{{ textHandler(shop.order_status) }}</text>
<image src="/static/shopCarIc/pointsIc.png" mode=""></image>
<view class="points">{{ it.coscore }}</view>
<view class="pointsPrice">￥{{ it.diff_price }}</view>
... ... @@ -29,7 +29,7 @@
</template>
<script setup>
import { ref, reactive, onMounted } from 'vue'
import { ref, reactive, onMounted, nextTick } from 'vue'
import { onShow, onLoad } from '@dcloudio/uni-app'
const props = defineProps({
shop: {
... ... @@ -37,7 +37,14 @@ const props = defineProps({
default: []
}
})
onMounted(() => {})
const textHandler = orderStatus => ([1, 11].includes(orderStatus) ? '需付款：' : [2, 3, 4, 21].includes(orderStatus) ? '实付款：' : '')
onMounted(() => {
nextTick(() => {
console.log(props.shop, '订单数据是什么')
})
})
</script>
<style lang="scss">
... ...
<template>
<!-- 底部按钮弹出成 -->
<u-popup :show="payPopShow" mode="bottom" :closeable="true" round="18" @close="close" @open="open">
<view class="popBox">
<view class="title flexC">{{btnType == 0? '加入购物车' : '立即购买'}}</view>
<!-- 价格 -->
<view class="topBox flexA">
<view class="shopPhoto">
<image :src="shopDetail.spec[0].spec_image" mode=""></image>
</view>
<view class="price">
<view class="shopName ellipsis">{{shopDetail.name}}</view>
<view class="money">
￥{{shopDetail.spec[0].goods_price}}
</view>
</view>
</view>
<!-- 商品规格 -->
<view v-for="(item,index) in data.speList" :key="item.group_id" style="margin-bottom: 44rpx;">
<view class="specificationsTile">
{{item.group_name}}
</view>
<view class="colorBox">
<view class="item" v-for="(it,idx) in item.spec_items" :key="it.item_id"
:class="idx == data.indexList[index].curIndex?'checked':''" @click="checkSpec(index,it,idx)">
{{it.spec_value}}
</view>
</view>
</view>
<!-- 数量加减 -->
<view class="numBox flexJ">
<view class="rightTitle flexA">
数量
</view>
<view class="and flexA">
<u-number-box v-model="value" @change="valChange"></u-number-box>
</view>
</view>
<!-- 加入购物车按钮 -->
<view v-if="btnType==0" class="popBtn flexC" @click="popBtn">
加入购物车
</view>
<!-- 立即购买按钮 -->
<view v-else class="popBtn1 flexC" @click="popBtn">
{{ shopDetail.goodstatus == 3 ?'立即兑换' : '立即购买'}}
</view>
</view>
</u-popup>
<!-- 底部按钮弹出成 -->
<u-popup :show="payPopShow" mode="bottom" :closeable="true" round="18" @close="close" @open="open">
<view class="popBox">
<view class="title flexC" v-if="shopType !== 3">{{ btnType == 0 ? '加入购物车' : '立即购买' }}</view>
<view class="title flexC" v-if="shopType === 3">立即兑换</view>
<!-- 价格 -->
<view class="topBox flexA">
<view class="shopPhoto">
<image :src="shopDetail.spec[0].spec_image" mode=""></image>
</view>
<view class="price">
<view class="shopName ellipsis">{{ shopDetail.name }}</view>
<view class="money" v-if="shopDetail.goodstatus !== 3">￥{{ shopDetail.spec[0].goods_price }}</view>
<view class="money" v-else>{{ shopDetail.spec[0].coscore }}积分</view>
</view>
</view>
<!-- 商品规格 -->
<view v-for="(item, index) in data.speList" :key="item.group_id" style="margin-bottom: 44rpx">
<view class="specificationsTile">
{{ item.group_name }}
</view>
<view class="colorBox">
<view class="item" v-for="(it, idx) in item.spec_items" :key="it.item_id" :class="idx == data.indexList[index].curIndex ? 'checked' : ''" @click="checkSpec(index, it, idx)">
{{ it.spec_value }}
</view>
</view>
</view>
<!-- 数量加减 -->
<view class="numBox flexJ">
<view class="rightTitle flexA">数量</view>
<view class="and flexA">
<u-number-box v-model="value" @change="valChange"></u-number-box>
</view>
</view>
<!-- 加入购物车按钮 -->
<view v-if="btnType == 0" class="popBtn flexC" @click="popBtn">加入购物车</view>
<!-- 立即购买按钮 -->
<view v-else class="popBtn1 flexC" @click="popBtn">
{{ shopDetail.goodstatus == 3 ? '立即兑换' : '立即购买' }}
</view>
</view>
</u-popup>
</template>
<script setup>
import { ref, reactive,onMounted } from 'vue'
import { getAddCar } from '@/api/'
let props = defineProps({
btnType: {
type: Number,
default: 0
},
payPopShow: {
type: Boolean,
default: false
},
shopDetail:{
type: Object,
default: {}
},
moreSpec:{
type: Object,
default: {}
}
})
let data = reactive({
value: 1,//商品数量
speList:[],//规格数组
indexList:[],//规格索引
specID:[],//选中的规格id
specIdList:[],//规格组合id数组
formList:{},//选择玩规格后的商品详情
goods_spec_id:'',//参数规格id
})
onMounted(()=> {
setTimeout(()=> {
console.log('多规格',props.moreSpec)
if(props.moreSpec != null) {
let spec = props.moreSpec.spec_attr //规格
let mateSpecId = props.moreSpec.spec_list //规格匹配id
data.speList = spec //渲染规格
data.specIdList = mateSpecId //组合id数组
spec.forEach((item,index)=>{
data.indexList.push({curIndex : 0})
data.specID.push(item.spec_items[0].item_id) //默认规格id
})
data.goods_spec_id = data.specID.join('_') //默认组合规格id
makeUpId()
} else {
data.goods_spec_id = props.shopDetail.spec[0].goods_spec_id
}
},200)
})
// 关闭弹窗
let emit = defineEmits(['close'])
const close = () => {
emit('close')
}
const valChange = (e) => {
console.log('数量' + e.value)
data.value = e.value
}
// 弹窗按钮props.btnType ==0加入购物车 1立即购买
const popBtn = ()=> {
let shopType = props.shopDetail.goodstatus //商品类型 1=普通商品,2=特价商品,3=积分商品
let buyData = {id:props.shopDetail.id,num:data.value,specId:data.goods_spec_id} //购买数据参数
console.log('当前值为: ' , buyData)
props.btnType ==0 ? getAddCars() : uni.navigateTo({ url:`/pages/shopCar/confirmOrder?params=${JSON.stringify(buyData)}&shopType=${shopType}` })
}
//选择规格
const checkSpec = (index,it,idx)=> {
console.log(index,it,idx)
data.indexList[index].curIndex = idx //选中高亮
if(data.speList.length==1) {
data.specID.splice(index,1,it.item_id)
} else {
data.specID.splice(index,data.specID.length>1?1:0,it.item_id)//规格组合的id
}
makeUpId()
}
// 组合id
const makeUpId = ()=> {
if(data.specID.length == data.speList.length) {
let str = data.specIdList.find(item=> item.spec_sku_id == data.specID.join('_'))
data.formList = str.form //所选规格对应详情
data.goods_spec_id = str.goods_spec_id //商品规格详情id
console.log('查找到的规格',str,data.specID.join('_'))
}
}
// 加入购物车
const getAddCars = async ()=>{
try {
let params = {
goods_id:props.shopDetail.id, //integer 是 商品ID
num:data.value, //integer //是 数量
goods_spec_id:data.goods_spec_id //integer 是 规格ID
}
const res = await getAddCar(params)
close()
uni.showToast({ title:'成功加入购物车~',icon:'none' })
console.log('getAddCar', res)
// 保存数据
} catch (err) {
uni.showToast({ title:err,icon:'none' })
console.log('getAddCar', err)
}
}
import { ref, reactive, onMounted } from 'vue'
import { getAddCar } from '@/api/'
let props = defineProps({
btnType: {
type: Number,
default: 0
},
shopType: Number,
payPopShow: {
type: Boolean,
default: false
},
shopDetail: {
type: Object,
default: {}
},
moreSpec: {
type: Object,
default: {}
}
})
let data = reactive({
value: 1, //商品数量
speList: [], //规格数组
indexList: [], //规格索引
specID: [], //选中的规格id
specIdList: [], //规格组合id数组
formList: {}, //选择玩规格后的商品详情
goods_spec_id: '' //参数规格id
})
onMounted(() => {
setTimeout(() => {
console.log('多规格', props.moreSpec)
if (props.moreSpec != null) {
let spec = props.moreSpec.spec_attr //规格
let mateSpecId = props.moreSpec.spec_list //规格匹配id
data.speList = spec //渲染规格
data.specIdList = mateSpecId //组合id数组
spec.forEach((item, index) => {
data.indexList.push({ curIndex: 0 })
data.specID.push(item.spec_items[0].item_id) //默认规格id
})
data.goods_spec_id = data.specID.join('_') //默认组合规格id
makeUpId()
} else {
data.goods_spec_id = props.shopDetail.spec[0].goods_spec_id
}
}, 200)
})
// 关闭弹窗
let emit = defineEmits(['close'])
const close = () => {
emit('close')
}
const valChange = e => {
console.log('数量' + e.value)
data.value = e.value
}
// 弹窗按钮props.btnType ==0加入购物车 1立即购买
const popBtn = () => {
let shopType = props.shopDetail.goodstatus //商品类型 1=普通商品,2=特价商品,3=积分商品
let buyData = { id: props.shopDetail.id, num: data.value, specId: data.goods_spec_id } //购买数据参数
console.log('当前值为: ', buyData)
props.btnType == 0 ? getAddCars() : uni.navigateTo({ url: `/pages/shopCar/confirmOrder?params=${JSON.stringify(buyData)}&shopType=${shopType}` })
}
//选择规格
const checkSpec = (index, it, idx) => {
console.log(index, it, idx)
data.indexList[index].curIndex = idx //选中高亮
if (data.speList.length == 1) {
data.specID.splice(index, 1, it.item_id)
} else {
data.specID.splice(index, data.specID.length > 1 ? 1 : 0, it.item_id) //规格组合的id
}
makeUpId()
}
// 组合id
const makeUpId = () => {
if (data.specID.length == data.speList.length) {
let str = data.specIdList.find(item => item.spec_sku_id == data.specID.join('_'))
data.formList = str.form //所选规格对应详情
data.goods_spec_id = str.goods_spec_id //商品规格详情id
console.log('查找到的规格', str, data.specID.join('_'))
}
}
// 加入购物车
const getAddCars = async () => {
try {
let params = {
goods_id: props.shopDetail.id, //integer 是 商品ID
num: data.value, //integer //是 数量
goods_spec_id: data.goods_spec_id //integer 是 规格ID
}
const res = await getAddCar(params)
close()
uni.showToast({ title: '成功加入购物车~', icon: 'none' })
console.log('getAddCar', res)
// 保存数据
} catch (err) {
uni.showToast({ title: err, icon: 'none' })
console.log('getAddCar', err)
}
}
</script>
<style lang="scss">
.popBox {
padding: 32rpx 24rpx 0;
.popBox {
padding: 32rpx 24rpx 0;
.title {
color: #000000e6;
font-size: 32rpx;
font-weight: 700;
}
.title {
color: #000000e6;
font-size: 32rpx;
font-weight: 700;
}
.topBox {
margin-top: 32rpx;
.topBox {
margin-top: 32rpx;
.shopPhoto {
width: 134rpx;
height: 138rpx;
margin-right: 24rpx;
.shopPhoto {
width: 134rpx;
height: 138rpx;
margin-right: 24rpx;
image {
border-radius: 12rpx;
width: 134rpx;
height: 138rpx;
}
}
image {
border-radius: 12rpx;
width: 134rpx;
height: 138rpx;
}
}
.price {
display: flex;
flex-direction: column;
justify-content: space-between;
height: 110rpx;
.price {
display: flex;
flex-direction: column;
justify-content: space-between;
height: 110rpx;
.money {
color: #fc4338ff;
font-size: 32rpx;
font-weight: 600;
}
.money {
color: #fc4338ff;
font-size: 32rpx;
font-weight: 600;
}
.shopName {
color: #000000e6;
font-size: 30rpx;
font-weight: 700;
line-height: 40rpx;
}
}
}
.shopName {
color: #000000e6;
font-size: 30rpx;
font-weight: 700;
line-height: 40rpx;
}
}
}
.specificationsTile {
color: #00000099;
font-size: 28rpx;
margin-bottom: 16rpx;
border: 1rpx solid transparent;
}
.specificationsTile {
color: #00000099;
font-size: 28rpx;
margin-bottom: 16rpx;
border: 1rpx solid transparent;
}
.colorBox {
display: flex;
flex-wrap: wrap;
.colorBox {
display: flex;
flex-wrap: wrap;
.item {
margin-right: 16rpx;
padding: 8rpx 32rpx;
border-radius: 46rpx;
color: #000;
font-size: 24rpx;
background: #1918330f;
border: 1rpx solid transparent;
}
.item {
margin-right: 16rpx;
padding: 8rpx 32rpx;
border-radius: 46rpx;
color: #000;
font-size: 24rpx;
background: #1918330f;
border: 1rpx solid transparent;
}
.checked {
color: #f43736ff;
font-size: 24rpx;
border-radius: 46rpx;
border: 1rpx solid #f43736ff;
background: #fff1efff;
}
}
.checked {
color: #f43736ff;
font-size: 24rpx;
border-radius: 46rpx;
border: 1rpx solid #f43736ff;
background: #fff1efff;
}
}
.numBox {
margin-top: 92rpx;
.numBox {
margin-top: 92rpx;
.rightTitle {
color: #00000099;
font-size: 28rpx;
.rightTitle {
color: #00000099;
font-size: 28rpx;
.surplus {
margin-left: 12rpx;
color: #ec3323ff;
font-size: 24rpx;
}
}
}
.surplus {
margin-left: 12rpx;
color: #ec3323ff;
font-size: 24rpx;
}
}
}
.payBox {
margin-top: 48rpx;
.payBox {
margin-top: 48rpx;
.payMode {
color: #000000e6;
font-size: 28rpx;
.payMode {
color: #000000e6;
font-size: 28rpx;
image {
margin-right: 12rpx;
width: 32rpx;
height: 32rpx;
}
}
image {
margin-right: 12rpx;
width: 32rpx;
height: 32rpx;
}
}
.yue {
color: #F33F2E;
font-size: 30rpx;
font-weight: 700;
.yue {
color: #f33f2e;
font-size: 30rpx;
font-weight: 700;
text {
margin-top: 5rpx;
color: #F33F2E;
font-size: 24rpx;
}
}
}
text {
margin-top: 5rpx;
color: #f33f2e;
font-size: 24rpx;
}
}
}
.popBtn {
border-radius: 280rpx;
margin: 50rpx auto 0;
width: 686rpx;
height: 88rpx;
color: #ffffffff;
font-size: 32rpx;
font-weight: 700;
background: linear-gradient(139deg, #ffac0bff 0%, #ffc24aff 100%);
}
.popBtn {
border-radius: 280rpx;
margin: 50rpx auto 0;
width: 686rpx;
height: 88rpx;
color: #ffffffff;
font-size: 32rpx;
font-weight: 700;
background: linear-gradient(139deg, #ffac0bff 0%, #ffc24aff 100%);
}
.popBtn1 {
margin: 50rpx auto 0;
width: 686rpx;
height: 88rpx;
border-radius: 96rpx;
opacity: 1;
color: #ffffffff;
font-size: 32rpx;
font-weight: 700;
background: linear-gradient(139deg, #fb753cff 0%, #fb3e3cff 100%);
}
.popBtn1 {
margin: 50rpx auto 0;
width: 686rpx;
height: 88rpx;
border-radius: 96rpx;
opacity: 1;
color: #ffffffff;
font-size: 32rpx;
font-weight: 700;
background: linear-gradient(139deg, #fb753cff 0%, #fb3e3cff 100%);
}
.notHave {
background: #ffd5d1ff;
}
}
.notHave {
background: #ffd5d1ff;
}
}
</style>
... ...
... ... @@ -11,6 +11,7 @@
<view class="shopPrice flexA" v-if="!pointShop">
<view class="new">￥{{ item.goods_price || item.spprice }}</view>
<view class="original" v-if="shopHeight == 322">￥{{ item.line_price }}</view>
<view class="original" v-if="isClass">￥{{ item.spyprice }}</view>
</view>
<view class="points" v-else>
<image src="/static/shopCarIc/pointsIc.png" mode=""></image>
... ... @@ -41,7 +42,8 @@ const props = defineProps({
list: {
type: Array,
default: []
}
},
isClass: Boolean
})
const wide = ref(props.shopWidth + 'rpx')
const heig = ref(props.shopHeight + 'rpx')
... ...
... ... @@ -31,6 +31,12 @@
}
},
{
"path": "pages/index/bargainPrice",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "pages/class/class",
"style": {
"navigationBarTitleText": "",
... ...
<template>
<search @doSearchs="doSearchs" @input="input" :keyWord="keyWord" :disabled="false"></search>
<search></search>
<view class="mainBox">
<shops :list="shopList" :shopWidth="344" :shopHeight="344" />
<shops :list="shopList" :shopWidth="344" :shopHeight="344" :isClass="true" />
</view>
<view class="null flexV" v-if="!shopList.length">
<image class="sss" src="/static/pointsMallic/pointsShopNull.png" mode=""></image>
... ... @@ -23,16 +23,6 @@ onLoad(async ({ pid }) => {
shopList.value = res
console.log(res, '分类商品列表')
})
const keyWord = ref('')
const doSearchs = () => {}
const input = e => {
if (e.detail.value == '') {
emit('input', e.detail.value)
}
}
</script>
<style lang="scss">
... ...
<template>
<view>
<u-navbar bgColor="#F6F8FA" title="特价专区" :placeholder="true" autoBack></u-navbar>
<view>
<search />
<view class="mainBox">
<shops :list="shopList" :shopWidth="344" :shopHeight="344" :pointShop="false" />
</view>
</view>
<view class="null flexV" v-if="!shopList.length">
<image class="sss" src="/static/pointsMallic/pointsShopNull.png" mode=""></image>
<text>暂无商品信息</text>
</view>
</view>
</template>
<script setup>
import { ref, reactive } from 'vue'
import { onShow, onLoad } from '@dcloudio/uni-app'
import search from '@/componets/searchBox.vue'
import shops from '@/componets/shops.vue'
import { getIndex } from '@/api/'
onShow(() => {
getIndexs()
})
let shopList = ref([]) // 积分商品
const getIndexs = async () => {
try {
const res = await getIndex()
shopList.value = res.tjgoods //特价商品
// 保存数据
} catch (err) {
uni.showToast({ title: err, icon: 'none' })
console.log('getIndex', err)
}
}
</script>
<style lang="scss">
page {
background: #f6f8fa;
}
.mainBox {
width: 100%;
padding: 16rpx 24rpx;
box-sizing: border-box;
}
.null {
margin-top: 266rpx;
text {
position: relative;
margin-top: -80rpx;
color: #00000066;
font-size: 26rpx;
}
image {
width: 348rpx;
height: 348rpx;
}
}
</style>
... ...
... ... @@ -32,9 +32,9 @@
<view class="topBox flexJ">
<view class="titles">
<view class="title">特价专区</view>
<text>JiangChengYuanTi</text>
<text>Special price zone</text>
</view>
<view class="more flexA">
<view class="more flexA" @click="toBargainPriceMoreHandler">
更多
<image src="/static/indexIc/orangeRight.png" mode=""></image>
</view>
... ... @@ -58,11 +58,18 @@
<script setup>
import { ref, reactive } from 'vue'
import { onShow, onLoad } from '@dcloudio/uni-app'
import { onShow, onLoad, onReachBottom } from '@dcloudio/uni-app'
import search from '@/componets/searchBox.vue'
import shops from '@/componets/shops.vue'
import { getIndex } from '@/api/'
const lastPage = ref(1)
const curPage = ref(1)
onShow(() => {
curPage.value = 1
data.recommendList.splice(0)
getIndexs()
})
// 跳转充值中心
... ... @@ -83,19 +90,30 @@ const jumpClass = item => {
}
const jumpClassHandler = () => uni.switchTab({ url: '/pages/class/class' })
const toBargainPriceMoreHandler = () => uni.navigateTo({ url: '/pages/index/bargainPrice' })
const getIndexs = async () => {
try {
const res = await getIndex()
const res = await getIndex({ page: curPage.value })
data.classList = res.fenlei //分类
data.specialList = res.tjgoods //特价商品
data.recommendList = res.goods //推荐商品
data.recommendList = data.recommendList.concat(res.goods.data) //推荐商品
console.log(data.recommendList, '推荐商品')
console.log('getIndex', res)
lastPage.value = res.goods.last_page
// 保存数据
} catch (err) {
uni.showToast({ title: err, icon: 'none' })
console.log('getIndex', err)
}
}
onReachBottom(() => {
curPage.value++
if (curPage.value >= lastPage.value) return
getIndex()
})
</script>
<style lang="scss">
... ...
<template>
<!-- 商品详情 -->
<view>
<u-navbar bgColor="transparent" :autoBack="true">
<template #left>
<view class="u-nav-slot">
<image src="/static/indexIc/back.png" mode=""></image>
</view>
</template>
</u-navbar>
<!-- 轮播图 -->
<view class="swiperBox">
<u-swiper height="375" :list="swiperList" @change="e => currentNum = e.current" :autoplay="false"
indicatorStyle="right: 20px">
<template #indicator >
<view class="indicator-num" v-if="shopType!=3">
<text class="indicator-num__text">{{ currentNum + 1 }}/{{ swiperList.length }}</text>
</view>
</template>
</u-swiper>
</view>
<!-- 商品信息 -->
<view class="info">
<shopInfo :info="detaileList"></shopInfo>
</view>
<view class="line"></view>
<view class="mainBox" >
<!-- 1=普通商品,2=特价商品,3=积分商品 -->
<view v-if="shopType==1" >
<view class="commentNmu flexJ" >
<text>评论({{commentList.length}})</text>
<view class="see flexA" v-if="commentList.length>0" @click="seeAll">
查看全部
<image src="/static/indexIc/orangeRight.png" mode=""></image>
</view>
</view>
<view v-if="commentList.length>0">
<comment :commentList="commentList"></comment>
</view>
<!-- 暂无评论 -->
<view class="commentNull flexV" v-else>
<image src="/static/indexIc/cpmmentNull.png" mode=""></image>
暂无评论
</view>
</view>
<view v-if="shopType!==3">
<view class="line"></view>
<view class="titles">商品详情</view>
<rich-text :nodes="detaileList.content"></rich-text>
</view>
</view>
<view class="lineBox flexC" v-if="shopType==3">
<view class="lines"></view>
<text>商品详情</text>
<view class="lines"></view>
</view>
<view class="" style="height: 300rpx;"></view>
<!-- 底部按钮 -->
<view class="btnBox iosAuto flexJ">
<view class="left flexA">
<view class="leftIc flexV" v-for="(item,index) in icList" :key="item.id" @click="btns(index)">
<view class="images">
<image :src="item.icon" mode=""></image>
<u-badge :absolute="true" v-if="index==2" :offset="[-6, -6]" color="#fff" bgColor="#F63D3A" max="99" :value="value"></u-badge>
</view>
<text v-if="index!=1">{{item.name}}</text>
<button v-if="index==1" open-type="contact">{{item.name}}</button>
</view>
</view>
<view class="flexA" v-if="shopType!=3">
<view class="add flexC" @click="toOrder(0)">加入购物车</view>
<view class="buy flexC" @click="toOrder(1)">立即购买</view>
</view>
<view v-else class="exchange flexC" @click="toOrder(3)">我要兑换</view>
</view>
<popPay :moreSpec="moreSpec" :shopDetail="detaileList" @close="payPopShow = false" :btnType="btnType" :payPopShow="payPopShow"></popPay>
</view>
<!-- 商品详情 -->
<view>
<u-navbar bgColor="transparent" :autoBack="true">
<template #left>
<view class="u-nav-slot">
<image src="/static/indexIc/back.png" mode=""></image>
</view>
</template>
</u-navbar>
<!-- 轮播图 -->
<view class="swiperBox">
<u-swiper height="375" :list="swiperList" @change="e => (currentNum = e.current)" :autoplay="false" indicatorStyle="right: 20px">
<template #indicator>
<view class="indicator-num" v-if="shopType != 3">
<text class="indicator-num__text">{{ currentNum + 1 }}/{{ swiperList.length }}</text>
</view>
</template>
</u-swiper>
</view>
<!-- 商品信息 -->
<view class="info">
<shopInfo :info="detaileList"></shopInfo>
</view>
<view class="line"></view>
<view class="mainBox">
<!-- 1=普通商品,2=特价商品,3=积分商品 -->
<view v-if="shopType == 1">
<view class="commentNmu flexJ">
<text>评论({{ commentList.length }})</text>
<view class="see flexA" v-if="commentList.length > 0" @click="seeAll">
查看全部
<image src="/static/indexIc/orangeRight.png" mode=""></image>
</view>
</view>
<view v-if="commentList.length > 0">
<comment :commentList="commentList"></comment>
</view>
<!-- 暂无评论 -->
<view class="commentNull flexV" v-else>
<image src="/static/indexIc/cpmmentNull.png" mode=""></image>
暂无评论
</view>
</view>
<view v-if="shopType !== 3">
<view class="line"></view>
<view class="titles">商品详情</view>
<rich-text :nodes="detaileList.content"></rich-text>
</view>
</view>
<view class="lineBox flexC" v-if="shopType == 3">
<view class="lines"></view>
<text>商品详情</text>
<view class="lines"></view>
</view>
<view class="" style="height: 300rpx"></view>
<!-- 底部按钮 -->
<view class="btnBox iosAuto flexJ">
<view class="left flexA">
<view class="leftIc flexV" v-for="(item, index) in icList" :key="item.id" @click="btns(index)">
<view class="images">
<image :src="item.icon" mode=""></image>
<u-badge :absolute="true" v-if="index == 2" :offset="[-6, -6]" color="#fff" bgColor="#F63D3A" max="99" :value="value"></u-badge>
</view>
<text v-if="index != 1">{{ item.name }}</text>
<button v-if="index == 1" open-type="contact">{{ item.name }}</button>
</view>
</view>
<view class="flexA" v-if="shopType != 3">
<view class="add flexC" @click="toOrder(0)">加入购物车</view>
<view class="buy flexC" @click="toOrder(1)">立即购买</view>
</view>
<view v-else class="exchange flexC" @click="toOrder(3)">我要兑换</view>
</view>
<popPay :moreSpec="moreSpec" :shopDetail="detaileList" @close="payPopShow = false" :shopType="shopType" :btnType="btnType" :payPopShow="payPopShow"></popPay>
</view>
</template>
<script setup>
import {ref,reactive} from 'vue'
import {onShow,onLoad,onHide} from '@dcloudio/uni-app'
import shopInfo from '@/componets/shopInfo.vue'
import comment from '@/componets/comment.vue'
import popPay from '@/componets/popPay.vue'
import { getShopDetaile } from '@/api/'
onLoad((e)=> {
console.log('商品id',e.id)
getShopDetailes(e.id)
})
onHide(()=>{
payPopShow.value = false
})
const currentNum = ref(0)
const list6 = reactive([
'https://cdn.uviewui.com/uview/swiper/swiper2.png',
'https://cdn.uviewui.com/uview/swiper/swiper3.png',
'https://cdn.uviewui.com/uview/swiper/swiper1.png',
])
const icList = reactive([{id:1,name:'店铺',icon:'/static/indexIc/shopIc.png'},
{id:2,name:'客服',icon:'/static/indexIc/service.png'},
{id:3,name:'购物车',icon:'/static/tabbarsIc/shopCar.png'}])
const value = ref('1') // 购物车徽章数
//查看全部评论
const seeAll = ()=>{
uni.navigateTo({
url:'/pages/index/allComment'
})
}
let btnType = ref(0) //按钮状态 0加入购物车 1立即购买
let payPopShow = ref(false) //按钮状态 0加入购物车 1立即购买
// 立即购买
const toOrder = (type)=> {
// if( type==3 ) return uni.navigateTo({url:`/pages/shopCar/confirmOrder?shopType=${shopType.value}`})
btnType.value = type
payPopShow.value = true
}
// 底部按钮
const btns = (index)=>{
switch (index) {
case 0:
console.log('店铺')
uni.switchTab({ url:'/pages/index/index'})
break;
case 2:
console.log('购物车')
uni.switchTab({ url:'/pages/shopCar/shopCar'})
break;
default:
break;
}
}
let detaileList = ref({}) //商品详情
let specList = ref({}) //默认规格第一项
let swiperList = ref([]) //轮播图
let commentList = ref([]) //评论
let moreSpec = ref({}) //多规格
let shopType = ref(1) //商品类型
// 获取详情
const getShopDetailes = async (id)=>{
try {
const res = await getShopDetaile(id)
detaileList.value = res.detail //详情
specList.value = res.detail.spec[0] //默认规格第一项
swiperList.value = res.detail.images //轮播图
commentList.value = res.pinglun //评论
moreSpec.value = res.specData //多规格
shopType.value = res.detail.goodstatus //商品类型
value.value = res.cartNum
console.log('getShopDetaile', res)
// 保存数据
} catch (err) {
uni.showToast({ title:err,icon:'none' })
console.log('', err)
}
}
import { ref, reactive } from 'vue'
import { onShow, onLoad, onHide } from '@dcloudio/uni-app'
import shopInfo from '@/componets/shopInfo.vue'
import comment from '@/componets/comment.vue'
import popPay from '@/componets/popPay.vue'
import { getShopDetaile } from '@/api/'
onLoad(e => {
console.log('商品id', e.id)
getShopDetailes(e.id)
})
onHide(() => {
payPopShow.value = false
})
const currentNum = ref(0)
const list6 = reactive(['https://cdn.uviewui.com/uview/swiper/swiper2.png', 'https://cdn.uviewui.com/uview/swiper/swiper3.png', 'https://cdn.uviewui.com/uview/swiper/swiper1.png'])
const icList = reactive([
{ id: 1, name: '店铺', icon: '/static/indexIc/shopIc.png' },
{ id: 2, name: '客服', icon: '/static/indexIc/service.png' },
{ id: 3, name: '购物车', icon: '/static/tabbarsIc/shopCar.png' }
])
const value = ref('1') // 购物车徽章数
//查看全部评论
const seeAll = () => {
uni.navigateTo({
url: '/pages/index/allComment'
})
}
let btnType = ref(0) //按钮状态 0加入购物车 1立即购买
let payPopShow = ref(false) //按钮状态 0加入购物车 1立即购买
// 立即购买
const toOrder = type => {
// if( type==3 ) return uni.navigateTo({url:`/pages/shopCar/confirmOrder?shopType=${shopType.value}`})
btnType.value = type
payPopShow.value = true
}
// 底部按钮
const btns = index => {
switch (index) {
case 0:
console.log('店铺')
uni.switchTab({ url: '/pages/index/index' })
break
case 2:
console.log('购物车')
uni.switchTab({ url: '/pages/shopCar/shopCar' })
break
default:
break
}
}
let detaileList = ref({}) //商品详情
let specList = ref({}) //默认规格第一项
let swiperList = ref([]) //轮播图
let commentList = ref([]) //评论
let moreSpec = ref({}) //多规格
let shopType = ref(1) //商品类型
// 获取详情
const getShopDetailes = async id => {
try {
const res = await getShopDetaile(id)
detaileList.value = res.detail //详情
specList.value = res.detail.spec[0] //默认规格第一项
swiperList.value = res.detail.images //轮播图
commentList.value = res.pinglun //评论
moreSpec.value = res.specData //多规格
shopType.value = res.detail.goodstatus //商品类型
value.value = res.cartNum
console.log('getShopDetaile', res)
// 保存数据
} catch (err) {
uni.showToast({ title: err, icon: 'none' })
console.log('', err)
}
}
</script>
<style lang="scss">
.u-nav-slot {
image {
width: 48rpx;
height: 48rpx;
}
}
.indicator-num {
padding: 2px 0;
background-color: rgba(0, 0, 0, 0.35);
border-radius: 100px;
width: 35px;
@include flex;
justify-content: center;
.u-nav-slot {
image {
width: 48rpx;
height: 48rpx;
}
}
.indicator-num {
padding: 2px 0;
background-color: rgba(0, 0, 0, 0.35);
border-radius: 100px;
width: 35px;
@include flex;
justify-content: center;
&__text {
color: #FFFFFF;
font-size: 12px;
}
&__text {
color: #ffffff;
font-size: 12px;
}
}
.swiperBox {
margin-bottom: 32rpx;
}
.info {
width: 702rpx;
margin: 0 auto;
}
.line {
width: 100%;
height: 6rpx;
opacity: 1;
background: #f7f8faff;
margin: 32rpx 0;
}
.mainBox {
padding: 0 24rpx;
.commentNmu {
margin-bottom: 40rpx;
text {
color: #1a1a1aff;
font-size: 28rpx;
font-weight: 700;
}
.see {
color: #ff7534ff;
font-size: 24rpx;
image {
margin-left: 2rpx;
width: 24rpx;
height: 24rpx;
}
}
}
.commentNull {
color: #00000066;
font-size: 26rpx;
margin-bottom: 212rpx;
image {
width: 348rpx;
height: 240rpx;
margin-bottom: 16rpx;
}
}
}
.titles {
color: #1a1a1aff;
font-size: 28rpx;
font-weight: 700;
}
.lineBox {
margin: 24rpx 0 30rpx;
.lines {
width: 149rpx;
height: 1rpx;
opacity: 1;
border: 0 solid #979797ff;
background: #dcdee0ff;
}
text {
margin: 0 24rpx;
color: #969799ff;
font-size: 24rpx;
}
}
.btnBox {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
height: 120rpx;
background: #ffffffff;
.left {
margin-left: 32rpx;
.leftIc {
margin-right: 34rpx;
.images {
position: relative;
width: 48rpx;
height: 48rpx;
margin-bottom: 8rpx;
image {
width: 48rpx;
height: 48rpx;
}
}
text {
color: #323233ff;
font-size: 20rpx;
}
button {
position: relative;
background: transparent;
width: 100%;
height: 100%;
color: #323233ff;
font-size: 20rpx;
border: none !important;
padding: 0 !important;
line-height: 28rpx;
&::after {
border: none;
}
}
}
.swiperBox {
margin-bottom: 32rpx;
}
.info {
width: 702rpx;
margin: 0 auto;
}
.line {
width: 100%;
height: 6rpx;
opacity: 1;
background: #f7f8faff;
margin: 32rpx 0;
}
.mainBox {
padding: 0 24rpx;
.commentNmu {
margin-bottom: 40rpx;
text {
color: #1a1a1aff;
font-size: 28rpx;
font-weight: 700;
}
.see {
color: #ff7534ff;
font-size: 24rpx;
image {
margin-left: 2rpx;
width: 24rpx;
height: 24rpx;
}
}
}
.commentNull {
color: #00000066;
font-size: 26rpx;
margin-bottom: 212rpx;
image {
width: 348rpx;
height: 240rpx;
margin-bottom: 16rpx;
}
}
}
.titles {
color: #1a1a1aff;
font-size: 28rpx;
font-weight: 700;
}
.lineBox {
margin: 24rpx 0 30rpx;
.lines {
width: 149rpx;
height: 1rpx;
opacity: 1;
border: 0 solid #979797ff;
background: #dcdee0ff;
}
text {
margin: 0 24rpx;
color: #969799ff;
font-size: 24rpx;
}
}
.btnBox {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
height: 120rpx;
background: #ffffffff;
.left {
margin-left: 32rpx;
.leftIc {
margin-right: 34rpx;
.images {
position: relative;
width: 48rpx;
height: 48rpx;
margin-bottom: 8rpx;
image {
width: 48rpx;
height: 48rpx;
}
}
text {
color: #323233ff;
font-size: 20rpx;
}
button {
position: relative;
background: transparent;
width: 100%;
height: 100%;
color: #323233ff;
font-size: 20rpx;
border: none !important;
padding: 0 !important;
line-height: 28rpx;
&::after {
border: none;
}
}
}
}
.buy{
margin-right: 32rpx;
width: 200rpx;
height: 80rpx;
border-radius: 80rpx;
color: #ffffffff;
font-size: 24rpx;
font-weight: 700;
background: linear-gradient(139deg, #fb753cff 0%, #fb3e3cff 100%);
}
.add {
margin-right: 14rpx;
width: 200rpx;
height: 80rpx;
border-radius: 80rpx;
color: #ffffffff;
font-size: 24rpx;
font-weight: 700;
background: linear-gradient(139deg, #ffac0bff 0%, #ffc24aff 100%);
}
.exchange {
margin-right: 32rpx;
width: 358rpx;
height: 80rpx;
border-radius: 80rpx;
color: #ffffffff;
font-size: 30rpx;
font-weight: 700;
background: linear-gradient(139deg, #fb753cff 0%, #fb3e3cff 100%);
}
}
}
.buy {
margin-right: 32rpx;
width: 200rpx;
height: 80rpx;
border-radius: 80rpx;
color: #ffffffff;
font-size: 24rpx;
font-weight: 700;
background: linear-gradient(139deg, #fb753cff 0%, #fb3e3cff 100%);
}
.add {
margin-right: 14rpx;
width: 200rpx;
height: 80rpx;
border-radius: 80rpx;
color: #ffffffff;
font-size: 24rpx;
font-weight: 700;
background: linear-gradient(139deg, #ffac0bff 0%, #ffc24aff 100%);
}
.exchange {
margin-right: 32rpx;
width: 358rpx;
height: 80rpx;
border-radius: 80rpx;
color: #ffffffff;
font-size: 30rpx;
font-weight: 700;
background: linear-gradient(139deg, #fb753cff 0%, #fb3e3cff 100%);
}
}
</style>
... ...
<template>
<!-- 评价 -->
<view>
<u-navbar :placeholder="true" title="评价" bgColor="transparent" :autoBack="true"></u-navbar>
<view class="boxs">
<view class="title">上传图片</view>
<view class="photoBox">
<view class="itemPhoto" v-for="(item,index) in photoList" :key="index">
<image class="photo" :src="item" mode=""></image>
<view class="delBox flexC" @click="delPhoto(index)">
<image class="del" src="/static/mineIc/close.png" mode=""></image>
</view>
</view>
<view class="addPhoto flexV" @click="addPhoto">
<image src="/static/mineIc/addIC.png" mode=""></image>
还可添加{{5 - photoList.length}}张
</view>
</view>
<view class="desc">
<textarea v-model="desc" placeholder-class="pls" placeholder="请输入" name="" id="" cols="30" rows="10"></textarea>
</view>
<view class="startBox flexA">
<text>综合评分</text>
<u-rate activeColor="#FEA302" :count="count" v-model="value"></u-rate>
</view>
</view>
<view class="btnBox iosAuto">
<view class="btn flexC" @click="submit"> 提交评论 </view>
</view>
</view>
<!-- 评价 -->
<view>
<u-navbar :placeholder="true" title="评价" bgColor="transparent" :autoBack="true"></u-navbar>
<view class="boxs">
<view class="title">上传图片</view>
<view class="photoBox">
<view class="itemPhoto" v-for="(item, index) in photoList" :key="index">
<image class="photo" :src="item" mode=""></image>
<view class="delBox flexC" @click="delPhoto(index)">
<image class="del" src="/static/mineIc/close.png" mode=""></image>
</view>
</view>
<view class="addPhoto flexV" @click="addPhoto">
<image src="/static/mineIc/addIC.png" mode=""></image>
还可添加{{ 5 - photoList.length }}张
</view>
</view>
<view class="desc">
<textarea v-model="desc" placeholder-class="pls" placeholder="请输入" name="" id="" cols="30" rows="10"></textarea>
</view>
<view class="startBox flexA">
<text>综合评分</text>
<u-rate activeColor="#FEA302" :count="count" v-model="value"></u-rate>
</view>
</view>
<view class="btnBox iosAuto">
<view class="btn flexC" @click="submit">提交评论</view>
</view>
</view>
</template>
<script setup>
import { ref,reactive,getCurrentInstance} from 'vue'
import {onShow,onLoad} from '@dcloudio/uni-app'
import { getComment } from '@/api/'
const count = ref(5) //最高可选星星数
const value = ref(0) //星星选中数
let photoList = reactive([]) //图片
let desc = ref('') //评论
const { proxy } = getCurrentInstance() //获取当前实例
// 提交评论
const submit = ()=> {
getComments()
}
// 上传图片
const addPhoto = ()=> proxy.$methods.upload('http://healthmall.shs.broing.cn/api/common/upload',(imgUrl) => {
console.log('返回图片',imgUrl)
photoList.push(imgUrl.avatar)
})
// 删除图片
const delPhoto = (index)=> {
photoList.splice(index,1)
}
// 写评论
const getComments = async ()=> {
try {
let params = {
goods_id:86, //integer 否 商品id
image:photoList.join(','), //string 是 图片
content:desc.value //integer 否 内容
}
const res = await getComment(params)
uni.showToast({ title:'感谢您的评论~',icon:'none' })
setTimeout(()=> {
uni.navigateBack()
},1000)
console.log('getComment', res)
// 保存数据
} catch (err) {
uni.showToast({ title:err,icon:'none' })
console.log('getComment', err)
}
}
import { ref, reactive, getCurrentInstance } from 'vue'
import { onShow, onLoad } from '@dcloudio/uni-app'
import { getComment } from '@/api/'
const count = ref(5) //最高可选星星数
const value = ref(0) //星星选中数
let photoList = reactive([]) //图片
let desc = ref('') //评论
const { proxy } = getCurrentInstance() //获取当前实例
// 提交评论
const submit = () => {
getComments()
}
// 上传图片
const addPhoto = () =>
proxy.$methods.upload('http://health.shs.broing.cn/api/common/upload', imgUrl => {
console.log('返回图片', imgUrl)
photoList.push(imgUrl.avatar)
})
// 删除图片
const delPhoto = index => {
photoList.splice(index, 1)
}
// 写评论
const getComments = async () => {
try {
let params = {
goods_id: 86, //integer 否 商品id
image: photoList.join(','), //string 是 图片
content: desc.value //integer 否 内容
}
const res = await getComment(params)
uni.showToast({ title: '感谢您的评论~', icon: 'none' })
setTimeout(() => {
uni.navigateBack()
}, 1000)
console.log('getComment', res)
// 保存数据
} catch (err) {
uni.showToast({ title: err, icon: 'none' })
console.log('getComment', err)
}
}
</script>
<style lang="scss">
page {
background: #f0f2f5ff;
}
.boxs {
width: 702rpx;
margin: 34rpx auto;
border-radius: 16rpx;
background: #ffffffff;
padding: 24rpx;
box-sizing: border-box;
.title {
color: #000000ff;
font-size: 26rpx;
margin-bottom: 24rpx;
}
.photoBox {
display: flex;
flex-wrap: wrap;
.itemPhoto {
position: relative;
width: 160rpx;
height: 160rpx;
border-radius: 12rpx;
margin-right: 24rpx;
.photo {
width: 160rpx;
height: 160rpx;
border-radius: 12rpx;
}
.delBox {
position: absolute;
right: 0;
top: 0;
width: 24rpx;
height: 24rpx;
background: #484B46;
border-radius: 0 8rpx 0 8rpx;
.del {
width: 24rpx;
height: 24rpx;
}
}
}
.addPhoto {
width: 160rpx;
height: 160rpx;
border-radius: 12rpx;
background: #f7f8faff;
color: #afafafff;
font-size: 22rpx;
image {
width: 34rpx;
height: 34rpx;
margin-bottom: 12rpx;
}
}
}
.desc {
margin-top: 24rpx;
padding: 24rpx 20rpx;
background: #f7f8faff;
.pls {
color: #afafafff;
font-size: 22rpx;
}
textarea {
color: #454545ff;
font-size: 24rpx;
}
}
.startBox {
margin-top: 24rpx;
text {
color: #000000ff;
font-size: 26rpx;
font-weight: 700;
margin-right: 20rpx;
}
}
}
.btnBox {
position: fixed;
left: 0;
bottom:0;
width: 100%;
.btn {
margin: 0 auto;
width: 686rpx;
height: 88rpx;
border-radius: 12rpx;
color: #ffffffff;
font-size: 32rpx;
font-weight: 700;
background: linear-gradient(139deg, #fb753cff 0%, #fb3e3cff 100%);
}
}
page {
background: #f0f2f5ff;
}
.boxs {
width: 702rpx;
margin: 34rpx auto;
border-radius: 16rpx;
background: #ffffffff;
padding: 24rpx;
box-sizing: border-box;
.title {
color: #000000ff;
font-size: 26rpx;
margin-bottom: 24rpx;
}
.photoBox {
display: flex;
flex-wrap: wrap;
.itemPhoto {
position: relative;
width: 160rpx;
height: 160rpx;
border-radius: 12rpx;
margin-right: 24rpx;
.photo {
width: 160rpx;
height: 160rpx;
border-radius: 12rpx;
}
.delBox {
position: absolute;
right: 0;
top: 0;
width: 24rpx;
height: 24rpx;
background: #484b46;
border-radius: 0 8rpx 0 8rpx;
.del {
width: 24rpx;
height: 24rpx;
}
}
}
.addPhoto {
width: 160rpx;
height: 160rpx;
border-radius: 12rpx;
background: #f7f8faff;
color: #afafafff;
font-size: 22rpx;
image {
width: 34rpx;
height: 34rpx;
margin-bottom: 12rpx;
}
}
}
.desc {
margin-top: 24rpx;
padding: 24rpx 20rpx;
background: #f7f8faff;
.pls {
color: #afafafff;
font-size: 22rpx;
}
textarea {
color: #454545ff;
font-size: 24rpx;
}
}
.startBox {
margin-top: 24rpx;
text {
color: #000000ff;
font-size: 26rpx;
font-weight: 700;
margin-right: 20rpx;
}
}
}
.btnBox {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
.btn {
margin: 0 auto;
width: 686rpx;
height: 88rpx;
border-radius: 12rpx;
color: #ffffffff;
font-size: 32rpx;
font-weight: 700;
background: linear-gradient(139deg, #fb753cff 0%, #fb3e3cff 100%);
}
}
</style>
... ...
... ... @@ -21,8 +21,8 @@
<u-count-down :time="item.time * 1000" format="mm:ss"></u-count-down>
</view>
<view class="orderNoBox flexJ" v-if="[3, 4, 21].includes(item.order_status)">
<view class="orderNo">快递单号 {{ item.order_no }}</view>
<view @click.stop="copy(item.order_no)" class="copy">复制</view>
<view class="orderNo">快递单号 {{ item.express_no }}</view>
<view @click.stop="copy(item.express_no)" class="copy">复制</view>
</view>
<!-- 订单商品 -->
<orderShop :shop="item"></orderShop>
... ... @@ -31,7 +31,9 @@
<!-- 待付款 -->
<view class="flexA" v-if="item.order_status == 1">
<view @click.stop="operateOrder(item, 0)" class="cancel flexC">{{ item.goodstatus_text == '' ? '取消付款' : '取消兑换' }}</view>
<view @click.stop="operateOrder(item, 1)" v-if="item.order_status == 1" class="orange flexC">{{ item.goodstatus_text == '' ? '立即支付' : '立即兑换' }}</view>
<view @click.stop="operateOrder(item, 1)" v-if="item.order_status == 1" class="orange flexC">
{{ item.goodstatus_text == '' ? '立即支付' : '立即兑换' }}
</view>
</view>
<!-- 代发货 -->
<view @click.stop="operateOrder(item, 2)" v-if="item.order_status == 2" class="orange flexC">申请退款</view>
... ... @@ -44,7 +46,7 @@
<view @click.stop="operateOrder(item, 3)" class="orange flexC">确认收货</view>
</view>
<!-- 待评价 -->
<view @click.stop="operateOrder(item, 4)" v-if="item.order_status == 4 && item.goodstatus_text != 3" class="orange flexC">评价</view>
<view @click.stop="operateOrder(item, 4)" v-if="item.order_status == 4" class="orange flexC">评价</view>
<!-- 售后 -->
<view @click.stop="operateOrder(item, 5)" v-if="item.order_status == 21" class="orange flexC">查看详情</view>
</view>
... ... @@ -79,26 +81,7 @@ onShow(() => {
})
let tabStatus = ref(0) //订单状态
let orderList = ref([]) //订单
const list1 = reactive([
{
name: '全部'
},
{
name: '待付款'
},
{
name: '待发货'
},
{
name: '待收货'
},
{
name: '待评价'
},
{
name: '售后'
}
])
const list1 = reactive([{ name: '全部' }, { name: '待付款' }, { name: '待发货' }, { name: '待收货' }, { name: '待评价' }, { name: '售后' }])
// type == 0取消订单 1立即支付 2申请退款 3确认收货 4评价 5查看详情
const operateOrder = (item, type) => {
orderId.value = item.id
... ...
<template>
<view>
<u-navbar bgColor="transparent" :placeholder="true" @leftClick="leftClickHandler"> </u-navbar>
<view class="mainBox">
<!-- 收货地址 -->
<shopAddres :isOrder="true" :adress="orderList"></shopAddres>
<view class="shopBox">
<orderShops :shop="orderList"></orderShops>
<view class="line"></view>
<view class="mode flexJ">
<view class="left">提货方式</view>
<view class="right">快递配送</view>
</view>
</view>
<view class="moneyBox flexJ" style="margin-bottom: 20rpx;">
<view>实付款</view>
<view class="money">￥{{orderList.total_price}}</view>
</view>
<view class="moneyBox flexJ" v-for="(item,index) in placeOrder" :key="item.id">
<view class="items" >
{{item.name}} <text>{{item.text}}</text>
</view>
<view v-if="index ==0 " @click="copy" class="copy">复制</view>
</view>
</view>
<!-- 按钮 // 0=全部,1=待付款,2=待发货,3=待收货,4=待评价,11=已取消,21=售后-->
<view class="btnBox iosAuto">
<view v-if="btnType==3" class="service flexC">
<button open-type="contact">联系客服</button>
</view>
<view v-if="btnType<=2" class="gay flexC" @click="btns(0)">{{btnType==1?'取消付款' : btnType==2?'申请退款': '联系客服'}}</view>
<view v-if="btnType==1 || btnType==3" class="red flexC" @click="btns(1)">{{btnType==1?'立即支付' : '确认收货'}}</view>
</view>
<!-- 选择支付方式 -->
<payMode @canclePop="modeShow = false" :orderId="orderId" :isOrderPay="true" :totalPrice="orderList.total_price" :modeShow="modeShow"></payMode>
<!-- 提示弹窗 -->
<tipPops @pointsBtns="pointsBtns" :integral="integral" :tipType="tipType" :tipShow="tipShow"></tipPops>
</view>
<view>
<u-navbar bgColor="transparent" :placeholder="true" @leftClick="leftClickHandler"></u-navbar>
<view class="mainBox">
<!-- 收货地址 -->
<shopAddres :isOrder="true" :adress="orderList"></shopAddres>
<view class="shopBox">
<orderShops :shop="orderList"></orderShops>
<view class="line"></view>
<view class="mode flexJ">
<view class="left">配送方式</view>
<view class="right">快递配送</view>
</view>
</view>
<view class="moneyBox flexJ" style="margin-bottom: 20rpx" v-if="orderList.goodstatus_text !== 3">
<view>实付款</view>
<view class="money">￥{{ orderList.total_price }}</view>
</view>
<template v-if="orderList.goodstatus_text === 3">
<view class="moneyBox flexJ" style="margin-bottom: 20rpx">
<view>运费</view>
<view class="money">￥{{ orderList.express_price }}</view>
</view>
<view class="moneyBox flexJ" style="margin-bottom: 20rpx">
<view>实付</view>
<view class="money">
<text style="color: #000">{{ orderList.score }}积分</text>
+￥{{ orderList.express_price }}
</view>
</view>
</template>
<view class="moneyBox flexJ" v-for="(item, index) in placeOrder" :key="item.id">
<view class="items">
{{ item.name }}
<text>{{ item.text }}</text>
</view>
<view v-if="index == 0" @click="copy" class="copy">复制</view>
</view>
</view>
<!-- 按钮 // 0=全部,1=待付款,2=待发货,3=待收货,4=待评价,11=已取消,21=售后-->
<view class="btnBox iosAuto">
<view v-if="btnType == 3" class="service flexC">
<button open-type="contact">联系客服</button>
</view>
<view v-if="btnType <= 2" class="gay flexC" @click="btns(0)">{{ btnType == 1 ? '取消付款' : btnType == 2 ? '申请退款' : '联系客服' }}</view>
<view v-if="btnType == 1 || btnType == 3" class="red flexC" @click="btns(1)">{{ btnType == 1 ? '立即支付' : '确认收货' }}</view>
</view>
<!-- 选择支付方式 -->
<payMode @canclePop="modeShow = false" :orderId="orderId" :isOrderPay="true" :totalPrice="orderList.total_price" :modeShow="modeShow"></payMode>
<!-- 提示弹窗 -->
<tipPops @pointsBtns="pointsBtns" :integral="integral" :tipType="tipType" :tipShow="tipShow"></tipPops>
</view>
</template>
<script setup>
import { ref,reactive, getCurrentInstance } from 'vue'
import {onShow,onLoad} from '@dcloudio/uni-app'
import shopAddres from '@/componets/address.vue'
import orderShops from '@/componets/orderShop.vue'
import tipPops from '@/componets/tipPop.vue'
import PayMode from '@/componets/checkPayMode.vue'
import { getOrderdetail,getCancleOrder,getRefund,getReceipt } from '@/api/'
onLoad((e)=>{
console.log(e.id)
orderId.value = e.id
getOrderdetails(e.id)
})
let tipShow = ref(false) //是否取消订单弹窗
let orderList = ref({}) //订单
let modeShow = ref(false) //选择支付方式
let orderId = ref('')//订单id
let btnType = ref(1) //按钮状态
let integral = ref(0) //积分
let tipType = ref(1) //1取消支付 2取消订单
let placeOrder = ref([{id:1,name:'订单编号',text:'1212'},
{id:2,name:'支付方式',text:'1212'},
{id:3,name:'下单时间',text:'1212'},
{id:4,name:'快递编号',text:'1212'}])
import { ref, reactive, getCurrentInstance } from 'vue'
import { onShow, onLoad } from '@dcloudio/uni-app'
import shopAddres from '@/componets/address.vue'
import orderShops from '@/componets/orderShop.vue'
import tipPops from '@/componets/tipPop.vue'
import PayMode from '@/componets/checkPayMode.vue'
import { getOrderdetail, getCancleOrder, getRefund, getReceipt } from '@/api/'
onLoad(e => {
console.log(e.id)
orderId.value = e.id
getOrderdetails(e.id)
})
let tipShow = ref(false) //是否取消订单弹窗
let orderList = ref({}) //订单
let modeShow = ref(false) //选择支付方式
let orderId = ref('') //订单id
let btnType = ref(1) //按钮状态
let integral = ref(0) //积分
let tipType = ref(1) //1取消支付 2取消订单
let placeOrder = ref([
{ id: 1, name: '订单编号', text: '1212' },
{ id: 2, name: '支付方式', text: '1212' },
{ id: 3, name: '下单时间', text: '1212' },
{ id: 4, name: '快递编号', text: '1212' }
])
const leftClickHandler = () => {
// const pages = getCurrentPages()
// const page = pages[pages.length - 2]
// page.onLoad({ status: 0 })
uni.navigateBack({ delta: 1 })
}
// 复制订单号
const copy = ()=> {
uni.setClipboardData({
data: orderList.value.order_no,
success: () => {
uni.showToast({ title: "复制成功",icon:'none' })
}
})
}
// 立即支付 type==0灰色按钮 否者橙色按钮
// 0=全部,1=待付款,2=待发货,3=待收货,4=待评价,11=已取消,21=售后 getCancleOrders()
const btns = (type)=> {
if(type==0) {
tipType.value = btnType.value == 1 ? 1 : 2
tipShow.value = true
// btnType.value == 1 ? tipShow.value = true : getRefunds()
} else {
btnType.value == 1 ? modeShow.value = true : getReceipts()
// btnType.value == 3 ? getReceipts() :''
}
}
//提示弹窗按钮点击
const pointsBtns = (type)=> {
console.log(type)
tipShow.value = false
if(type == 1) {
tipType.value == 1 ? getCancleOrders() : getRefunds()
}
}
const { proxy } = getCurrentInstance() //获取当前实例
// 订单详情
const getOrderdetails = async (id)=>{
try {
const res = await getOrderdetail(id)
orderList.value = res
btnType.value = res.order_status
placeOrder.value[0].text = res.order_no
placeOrder.value[1].text = res.zhifu == 1? '微信' : '余额'
placeOrder.value[2].text = res.createtime
placeOrder.value[3].text = res.pay_order_no
console.log('getOrderdetail', res)
// 保存数据
} catch (err) {
uni.showToast({ title:err,icon:'none' })
console.log('getOrderdetail', err)
}
}
// 取消订单
const getCancleOrders = async ()=> {
try {
const res = await getCancleOrder(orderId.value)
proxy.$methods.showTN('订单已取消~')
console.log('getCancleOrder', res)
// 保存数据
} catch (err) {
uni.showToast({ title:err,icon:'none' })
console.log('getCancleOrder', err)
}
}
// 退款
const getRefunds = async ()=>{
try {
const res = await getRefund(orderId.value)
proxy.$methods.showTN('已申请,等待客服审核')
console.log('getRefund', res)
// 保存数据
} catch (err) {
uni.showToast({ title:err,icon:'none' })
console.log('getRefund', err)
}
}
// 确认收货
const getReceipts = async ()=>{
try {
const res = await getReceipt(orderId.value)
proxy.$methods.showTN('已收货,期待下次下单~')
console.log('getReceipt', res)
// 保存数据
} catch (err) {
uni.showToast({ title:err,icon:'none' })
console.log('getReceipt', err)
}
}
const leftClickHandler = () => {
// const pages = getCurrentPages()
// const page = pages[pages.length - 2]
// page.onLoad({ status: 0 })
uni.navigateBack({ delta: 1 })
}
// 复制订单号
const copy = () => {
uni.setClipboardData({
data: orderList.value.express_no,
success: () => {
uni.showToast({ title: '复制成功', icon: 'none' })
}
})
}
// 立即支付 type==0灰色按钮 否者橙色按钮
// 0=全部,1=待付款,2=待发货,3=待收货,4=待评价,11=已取消,21=售后 getCancleOrders()
const btns = type => {
if (type == 0) {
tipType.value = btnType.value == 1 ? 1 : 2
tipShow.value = true
// btnType.value == 1 ? tipShow.value = true : getRefunds()
} else {
btnType.value == 1 ? (modeShow.value = true) : getReceipts()
// btnType.value == 3 ? getReceipts() :''
}
}
//提示弹窗按钮点击
const pointsBtns = type => {
console.log(type)
tipShow.value = false
if (type == 1) {
tipType.value == 1 ? getCancleOrders() : getRefunds()
}
}
const { proxy } = getCurrentInstance() //获取当前实例
// 订单详情
const getOrderdetails = async id => {
try {
const res = await getOrderdetail(id)
orderList.value = res
btnType.value = res.order_status
placeOrder.value[0].text = res.order_no
placeOrder.value[1].text = res.zhifu == 1 ? '微信' : '余额'
placeOrder.value[2].text = res.createtime
placeOrder.value[3].text = res.express_no
console.log('getOrderdetail', res)
// 保存数据
} catch (err) {
uni.showToast({ title: err, icon: 'none' })
console.log('getOrderdetail', err)
}
}
// 取消订单
const getCancleOrders = async () => {
try {
const res = await getCancleOrder(orderId.value)
proxy.$methods.showTN('订单已取消~')
console.log('getCancleOrder', res)
// 保存数据
} catch (err) {
uni.showToast({ title: err, icon: 'none' })
console.log('getCancleOrder', err)
}
}
// 退款
const getRefunds = async () => {
try {
const res = await getRefund(orderId.value)
proxy.$methods.showTN('已申请,等待客服审核')
console.log('getRefund', res)
// 保存数据
} catch (err) {
uni.showToast({ title: err, icon: 'none' })
console.log('getRefund', err)
}
}
// 确认收货
const getReceipts = async () => {
try {
const res = await getReceipt(orderId.value)
proxy.$methods.showTN('已收货,期待下次下单~')
console.log('getReceipt', res)
// 保存数据
} catch (err) {
uni.showToast({ title: err, icon: 'none' })
console.log('getReceipt', err)
}
}
</script>
<style lang="scss">
page {
background: #f7f8faff;
}
.mainBox {
width: 100%;
padding:20rpx 24rpx;
box-sizing: border-box;
.shopBox {
width: 100%;
padding: 24rpx 20rpx 32rpx;
box-sizing: border-box;
border-radius: 24rpx;
background: #ffffffff;
margin-bottom: 20rpx;
.line {
margin: 40rpx auto 32rpx;
width: 100%;
height: 1rpx;
background: #eeeff0ff;
}
.mode {
.left {
color: #000000e6;
font-size: 26rpx;
}
.right {
color: #000000e6;
font-size: 26rpx;
font-weight: 700;
}
}
}
.moneyBox {
width: 100%;
padding: 32rpx 20rpx;
box-sizing: border-box;
margin: 0 auto ;
border-radius: 24rpx;
background: #ffffffff;
:nth-child(1) {
color: #000000e6;
font-size: 26rpx;
}
.money {
color: #fc4338ff;
font-size: 28rpx;
font-weight: 700;
}
.items {
color: #323233ff;
font-size: 26rpx;
text {
margin-left: 40rpx;
color: #323233ff;
font-size: 26rpx;
font-weight: 700;
}
}
.copy {
color: #969799ff;
font-size: 26rpx;
}
}
}
.btnBox {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
height: 112rpx;
padding-top: 16rpx;
background: #fff;
display: flex;
justify-content: flex-end;
.service {
position: relative;
margin-right: 24rpx;
width: 248rpx;
height: 80rpx;
border-radius: 80rpx;
border: 1rpx solid #dcdee0ff;
button {
position: absolute;
width: 100%;
height: 100%;
background: transparent;
padding: 0;
color: #646566ff;
font-size: 30rpx;
&::after {
border: none;
}
}
}
.gay {
margin-right: 24rpx;
width: 248rpx;
height: 80rpx;
border-radius: 80rpx;
color: #646566ff;
font-size: 30rpx;
border: 1rpx solid #dcdee0ff;
}
.red {
margin-right: 24rpx;
width: 248rpx;
height: 80rpx;
border-radius: 80rpx;
color: #ffffffff;
font-size: 30rpx;
font-weight: 700;
background: linear-gradient(-88deg, #fe6434ff 0%, #ff2f2fff 100%);
}
}
page {
background: #f7f8faff;
}
.mainBox {
width: 100%;
padding: 20rpx 24rpx;
box-sizing: border-box;
.shopBox {
width: 100%;
padding: 24rpx 20rpx 32rpx;
box-sizing: border-box;
border-radius: 24rpx;
background: #ffffffff;
margin-bottom: 20rpx;
.line {
margin: 40rpx auto 32rpx;
width: 100%;
height: 1rpx;
background: #eeeff0ff;
}
.mode {
.left {
color: #000000e6;
font-size: 26rpx;
}
.right {
color: #000000e6;
font-size: 26rpx;
font-weight: 700;
}
}
}
.moneyBox {
width: 100%;
padding: 32rpx 20rpx;
box-sizing: border-box;
margin: 0 auto;
border-radius: 24rpx;
background: #ffffffff;
:nth-child(1) {
color: #000000e6;
font-size: 26rpx;
}
.money {
color: #fc4338ff;
font-size: 28rpx;
font-weight: 700;
}
.items {
color: #323233ff;
font-size: 26rpx;
text {
margin-left: 40rpx;
color: #323233ff;
font-size: 26rpx;
font-weight: 700;
}
}
.copy {
color: #969799ff;
font-size: 26rpx;
}
}
}
.btnBox {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
height: 112rpx;
padding-top: 16rpx;
background: #fff;
display: flex;
justify-content: flex-end;
.service {
position: relative;
margin-right: 24rpx;
width: 248rpx;
height: 80rpx;
border-radius: 80rpx;
border: 1rpx solid #dcdee0ff;
button {
position: absolute;
width: 100%;
height: 100%;
background: transparent;
padding: 0;
color: #646566ff;
font-size: 30rpx;
&::after {
border: none;
}
}
}
.gay {
margin-right: 24rpx;
width: 248rpx;
height: 80rpx;
border-radius: 80rpx;
color: #646566ff;
font-size: 30rpx;
border: 1rpx solid #dcdee0ff;
}
.red {
margin-right: 24rpx;
width: 248rpx;
height: 80rpx;
border-radius: 80rpx;
color: #ffffffff;
font-size: 30rpx;
font-weight: 700;
background: linear-gradient(-88deg, #fe6434ff 0%, #ff2f2fff 100%);
}
}
</style>
... ...
<template>
<!-- 充值 -->
<view>
<u-navbar leftIconColor="#fff" :placeholder="true" title="会员中心" bgColor="#1D1E24" :autoBack="true"></u-navbar>
<view class="blackBg">
<view class="topBox">
<image class="bg" src="/static/mineIc/vipBg.png" mode=""></image>
<view class="tipBox">
<view class="balanceBox">
<view class="tip">余额(元)</view>
<view class="balance flexA">
<text>￥</text>
<view class="balances">{{balance}}</view>
</view>
</view>
<view class="photo flexA">
<!-- <image src="/static/logo.png" mode=""></image>
<!-- 充值 -->
<view>
<u-navbar leftIconColor="#fff" :placeholder="true" title="会员中心" bgColor="#1D1E24" :autoBack="true"></u-navbar>
<view class="blackBg">
<view class="topBox">
<image class="bg" src="/static/mineIc/vipBg.png" mode=""></image>
<view class="tipBox">
<view class="balanceBox">
<view class="tip">余额(元)</view>
<view class="balance flexA">
<text>￥</text>
<view class="balances">{{ balance }}</view>
</view>
</view>
<view class="photo flexA">
<!-- <image src="/static/logo.png" mode=""></image>
<text>哈哈</text> -->
<open-data type="userAvatarUrl" class="avatar"></open-data>
<open-data type="userAvatarUrl" class="avatar"></open-data>
<open-data type="userNickName" class="nickname"></open-data>
</view>
</view>
</view>
</view>
<view class="packageBox">
<view class="title flexA">金额
<input type="number" v-model="money" placeholder-class="ples" placeholder="(自定义)">
</view>
<view class="package">
<view class="item flexV" @click="checkPackage(item,index)" :class="cur == index ? 'check' : '' "
v-for="(item,index) in packageList" :key="item.id">
<view class="recharge">冲{{item.money}}</view>
<view class="deliver">送{{item.discount}}</view>
</view>
</view>
</view>
<view class="line"> </view>
<view class="desc">
<view class="descTitle">使用说明</view>
</view>
<view class="btnBox iosAuto">
<view class="btn flexC" @click="rechargeBtn">立即支付</view>
</view>
</view>
<open-data type="userNickName" class="nickname"></open-data>
</view>
</view>
</view>
</view>
<view class="packageBox">
<view class="title flexA">
金额
<input type="number" v-model="money" placeholder-class="ples" placeholder="(自定义)" />
</view>
<view class="package">
<view class="item flexV" @click="checkPackage(item, index)" :class="cur == index ? 'check' : ''" v-for="(item, index) in packageList" :key="item.id">
<view class="recharge">冲{{ item.money }}</view>
<view class="deliver">送{{ item.discount }}</view>
</view>
</view>
</view>
<view class="line"></view>
<view class="desc">
<view class="descTitle">使用说明</view>
</view>
<view class="btnBox iosAuto">
<view class="btn flexC" @click="rechargeBtn">立即支付</view>
</view>
</view>
</template>
<script setup>
import { ref, reactive, getCurrentInstance } from 'vue'
import { onShow, onLoad } from '@dcloudio/uni-app'
import { getPackage,getRecharge,getyue } from '@/api/'
onShow(()=> {
getPackages() //充值套餐
getyues() //我的余额
})
let packageList = ref([]) //套餐数组
let money = ref('') //自定义金额
let cur = ref(0) //当前选择套餐
let balance = ref(0) //余额
const checkPackage = (item, index) => {
cur.value = index
}
// 立即支付按钮
const rechargeBtn = ()=> {
let packageMoney = packageList.value[cur.value].money
getRecharges( money.value== '' ? packageMoney : money.value)
}
const { proxy } = getCurrentInstance()
// 充值
const getRecharges = async (money)=>{
try {
const res = await getRecharge(money)
proxy.$methods.pay(res)
console.log('getRecharge', res)
// 保存数据
} catch (err) {
uni.showToast({ title:err,icon:'none' })
console.log('getRecharge', err)
}
}
// 充值套餐
const getPackages = async ()=>{
try {
const res = await getPackage()
packageList.value = res
console.log('getPackage', res)
// 保存数据
} catch (err) {
uni.showToast({ title:err,icon:'none' })
console.log('getPackage', err)
}
}
// 我的余额
const getyues = async ()=> {
try {
const res = await getyue()
balance.value = res.money
uni.setStorageSync('balance',res.money)
console.log('getyue', res)
// 保存数据
} catch (err) {
uni.showToast({ title:err,icon:'none' })
console.log('getyue', err)
}
}
import { ref, reactive, getCurrentInstance } from 'vue'
import { onShow, onLoad } from '@dcloudio/uni-app'
import { getPackage, getRecharge, getyue } from '@/api/'
onShow(() => {
getPackages() //充值套餐
getyues() //我的余额
})
let packageList = ref([]) //套餐数组
let money = ref('') //自定义金额
let cur = ref(0) //当前选择套餐
let balance = ref(0) //余额
const checkPackage = (item, index) => {
cur.value = index
}
// 立即支付按钮
const rechargeBtn = () => {
let packageMoney = packageList.value[cur.value].money
getRecharges(money.value == '' ? packageMoney : money.value)
}
const { proxy } = getCurrentInstance()
// 充值
const getRecharges = async money => {
try {
const res = await getRecharge(money)
proxy.$methods.pay(res)
console.log('getRecharge', res)
// 保存数据
} catch (err) {
uni.showToast({ title: err, icon: 'none' })
console.log('getRecharge', err)
}
}
// 充值套餐
const getPackages = async () => {
try {
const res = await getPackage()
packageList.value = res
console.log('getPackage', res)
// 保存数据
} catch (err) {
uni.showToast({ title: err, icon: 'none' })
console.log('getPackage', err)
}
}
// 我的余额
const getyues = async () => {
try {
const res = await getyue()
balance.value = res.money
uni.setStorageSync('balance', res.money)
console.log('getyue', res)
// 保存数据
} catch (err) {
uni.showToast({ title: err, icon: 'none' })
console.log('getyue', err)
}
}
</script>
<style lang="scss">
.u-navbar__content__title {
color: #fff !important;
font-size: 32rpx;
font-weight: 700;
}
.u-navbar__content__title {
color: #fff !important;
font-size: 32rpx;
font-weight: 700;
}
.blackBg {
width: 100%;
height: 278rpx;
background: #1d1e24;
padding: 32rpx 24rpx 0;
box-sizing: border-box;
.blackBg {
width: 100%;
height: 278rpx;
background: #1D1E24;
padding: 32rpx 24rpx 0;
box-sizing: border-box;
.topBox {
position: relative;
width: 100%;
.topBox {
position: relative;
width: 100%;
.bg {
width: 100%;
height: 325rpx;
}
}
.bg {
width: 100%;
height: 325rpx;
}
}
.tipBox {
position: absolute;
display: flex;
justify-content: space-between;
top: 0;
left: 32rpx;
width: 640rpx;
box-sizing: border-box;
.tipBox {
position: absolute;
display: flex;
justify-content: space-between;
top: 0;
left: 32rpx;
width: 640rpx;
box-sizing: border-box;
.balanceBox {
.tip {
margin-top: 96rpx;
color: #000000ff;
font-size: 24rpx;
}
.balanceBox {
.balance {
margin-top: 12rpx;
.tip {
margin-top: 96rpx;
color: #000000ff;
font-size: 24rpx;
}
text {
font-size: 32rpx;
font-weight: 700;
margin-top: 30rpx;
}
.balance {
margin-top: 12rpx;
.balances {
font-size: 80rpx;
font-weight: 700;
}
}
}
text {
font-size: 32rpx;
font-weight: 700;
margin-top: 30rpx;
}
.photo {
height: 40rpx;
color: #000000e6;
font-size: 24rpx;
margin-top: 28rpx;
.balances {
font-size: 80rpx;
font-weight: 700;
}
}
}
.avatar {
border-radius: 50%;
width: 40rpx;
height: 40rpx;
margin-right: 8rpx;
}
}
}
}
.photo {
height: 40rpx;
color: #000000e6;
font-size: 24rpx;
margin-top: 28rpx;
.packageBox {
position: relative;
width: 100%;
opacity: 1;
background: #ffffffff;
padding: 40rpx 20rpx 38rpx;
box-sizing: border-box;
.avatar {
border-radius: 50%;
width: 40rpx;
height: 40rpx;
margin-right: 8rpx;
}
}
}
}
.title {
color: #000000e6;
font-size: 30rpx;
font-weight: 700;
margin-bottom: 44rpx;
.packageBox {
position: relative;
width: 100%;
opacity: 1;
background: #ffffffff;
padding: 40rpx 20rpx 38rpx;
box-sizing: border-box;
input {
margin-left: 16rpx;
color: #000000e6;
font-size: 30rpx;
font-weight: 700;
}
}
.title {
color: #000000e6;
font-size: 30rpx;
font-weight: 700;
margin-bottom: 44rpx;
input {
margin-left: 16rpx;
color: #000000e6;
font-size: 30rpx;
font-weight: 700;
}
}
.package {
margin: 0 auto;
width: 638rpx;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
.package {
margin: 0 auto;
width: 638rpx;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
.item {
padding: 40rpx 0;
width: 262rpx;
margin-bottom: 24rpx;
background: #f9f9f9ff;
border-radius: 24rpx;
border: 2rpx solid #f9f9f9ff;
.item {
padding: 40rpx 0;
width: 262rpx;
margin-bottom: 24rpx;
background: #f9f9f9ff;
border-radius: 24rpx;
border: 2rpx solid #f9f9f9ff;
.recharge {
color: #361e0dff;
font-size: 40rpx;
font-weight: 700;
margin-bottom: 14rpx;
}
.deliver {
color: #000000ff;
font-size: 32rpx;
font-weight: 700;
}
}
.recharge {
color: #361e0dff;
font-size: 40rpx;
font-weight: 700;
margin-bottom: 14rpx;
}
.check {
width: 262rpx;
border-radius: 24rpx;
border: 2rpx solid #ddb674ff;
background: #fdf8eeff !important;
}
}
}
.deliver {
color: #000000ff;
font-size: 32rpx;
font-weight: 700;
}
}
.line {
width: 100%;
height: 24rpx;
background: #f5f7fb;
}
.check {
width: 262rpx;
border-radius: 24rpx;
border: 2rpx solid #ddb674ff;
background: #fdf8eeff !important;
}
}
}
.desc {
width: 100%;
padding: 24rpx 20rpx;
box-sizing: border-box;
background: #fff;
.line {
width: 100%;
height: 24rpx;
background: #F5F7FB;
}
.desc {
width: 100%;
padding: 24rpx 20rpx;
box-sizing: border-box;
background: #fff;
.descTitle {
color: #000000e6;
font-size: 30rpx;
font-weight: 700;
margin-bottom: 24rpx;
}
}
.descTitle {
color: #000000e6;
font-size: 30rpx;
font-weight: 700;
margin-bottom: 24rpx;
}
}
.btnBox {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
background: #fff;
.btnBox {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
background: #fff;
.btn {
margin: 15rpx auto 0;
width: 702rpx;
height: 88rpx;
border-radius: 16rpx;
color: #ffffffff;
font-size: 32rpx;
font-weight: 700;
background: linear-gradient(139deg, #fb753cff 0%, #fb3e3cff 100%);
}
}
.btn {
margin: 15rpx auto 0;
width: 702rpx;
height: 88rpx;
border-radius: 16rpx;
color: #ffffffff;
font-size: 32rpx;
font-weight: 700;
background: linear-gradient(139deg, #fb753cff 0%, #fb3e3cff 100%);
}
}
</style>
... ...
<template>
<!-- 购物车 -->
<view class="">
<u-navbar bgColor="#F6F8FA" :placeholder="true" title="购物车" :autoBack="true"></u-navbar>
<view class="minBox" v-if="data.shopList.length>0">
<!-- 商品管理 -->
<view class="topBox flexJ" >
<view class="amount flexA" @click="toMyAddress">
<image src="/static/shopCarIc/shopAddress.png" mode=""></image>
<view class="adress ellipsis">{{data.adress}}</view>
</view>
<view class="manage" @click="changingOver">{{data.btnStatus ? '管理' : '完成' }}</view>
</view>
<!-- 商品 -->
<view class="shopBox flexA" v-for="(item,index) in data.shopList" :key="item.id">
<!-- 选择 -->
<view class="checkIc" @click.stop="checkShop(index)">
<image v-if="!item.checkType" src="/static/shopCarIc/checks.png" mode=""></image>
<image v-else src="/static/shopCarIc/checked.png" mode=""></image>
</view>
<!-- 商品图片 -->
<view class="shopPhoto">
<image :src="item.image" mode=""></image>
<image v-if="item.status==0" class="shopStatus" src="/static/shopCarIc/shopType.png" mode=""></image>
</view>
<!-- 商品详细 -->
<view class="infoBox">
<!-- 商品名称 -->
<view class="title ellipsis">{{item.name}}</view>
<!-- 商品数量加减 -->
<view class="numBox flexJ">
<view class="rightTitle flexA">
<text>￥</text>{{item.goods_price}}
</view>
<view class="and flexA">
<image src="/static/shopCarIc/reduce.png" mode="" @click="numBtn(0,item)"></image>
<view class="num flexC">{{item.total_num}}</view>
<image src="/static/shopCarIc/add.png" mode="" @click="numBtn(1,item)"></image>
</view>
</view>
</view>
</view>
<view class="" style="height: 120rpx;"></view>
</view>
<!-- 购物车为空 -->
<view class="nullBox flexV" v-else>
<image src="/static/shopCarIc/shopCarNull.png" mode=""></image>
购物车为空哦
</view>
<!-- 底部按钮 -->
<view class="payBox flexJ" v-if="data.shopList.length > 0">
<!-- 全选按钮 -->
<view class="allIc flexA" @click="checkAll">
<image v-if="!allCheck" src="/static/shopCarIc/checks.png" mode=""></image>
<image v-else src="/static/shopCarIc/checked.png" mode=""></image>
<view class="">全选</view>
</view>
<!-- 合计金额 -->
<view class="amountBox flexA">
<view class="settleBox flexA" v-if="data.btnStatus">
<view class="settle">合计：</view>
<view class="money flexA">
￥{{allMoney}}
</view>
</view>
<!-- 结算和删除按钮 -->
<view class="btns flexC" @click="settleBtn">
{{data.btnStatus?'结算':'删除'}}
</view>
</view>
</view>
</view>
<!-- 购物车 -->
<view class="">
<u-navbar bgColor="#F6F8FA" :placeholder="true" title="购物车" :autoBack="true"></u-navbar>
<view class="minBox" v-if="data.shopList.length > 0">
<!-- 商品管理 -->
<view class="topBox flexJ">
<view class="amount flexA" @click="toMyAddress">
<image src="/static/shopCarIc/shopAddress.png" mode=""></image>
<view class="adress ellipsis">{{ data.adress }}</view>
</view>
<view class="manage" @click="changingOver">{{ data.btnStatus ? '管理' : '完成' }}</view>
</view>
<!-- 商品 -->
<view class="shopBox flexA" v-for="(item, index) in data.shopList" :key="item.id">
<!-- 选择 -->
<view class="checkIc" @click.stop="checkShop(index)">
<image v-if="!item.checkType" src="/static/shopCarIc/checks.png" mode=""></image>
<image v-else src="/static/shopCarIc/checked.png" mode=""></image>
</view>
<!-- 商品图片 -->
<view class="shopPhoto">
<image :src="item.image" mode=""></image>
<image v-if="item.status == 0" class="shopStatus" src="/static/shopCarIc/shopType.png" mode=""></image>
</view>
<!-- 商品详细 -->
<view class="infoBox">
<!-- 商品名称 -->
<view class="title ellipsis">{{ item.name }}</view>
<!-- 商品数量加减 -->
<view class="numBox flexJ">
<view class="rightTitle flexA">
<text>￥</text>
{{ item.goods_price }}
</view>
<view class="and flexA">
<image src="/static/shopCarIc/reduce.png" mode="" @click="numBtn(0, item)"></image>
<view class="num flexC">{{ item.total_num }}</view>
<image src="/static/shopCarIc/add.png" mode="" @click="numBtn(1, item)"></image>
</view>
</view>
</view>
</view>
<view class="" style="height: 120rpx"></view>
</view>
<!-- 购物车为空 -->
<view class="nullBox flexV" v-else>
<image src="/static/shopCarIc/shopCarNull.png" mode=""></image>
购物车为空哦
</view>
<!-- 底部按钮 -->
<view class="payBox flexJ" v-if="data.shopList.length > 0">
<!-- 全选按钮 -->
<view class="allIc flexA" @click="checkAll">
<image v-if="!allCheck" src="/static/shopCarIc/checks.png" mode=""></image>
<image v-else src="/static/shopCarIc/checked.png" mode=""></image>
<view class="">全选</view>
</view>
<!-- 合计金额 -->
<view class="amountBox flexA">
<view class="settleBox flexA" v-if="data.btnStatus">
<view class="settle">合计：</view>
<view class="money flexA">￥{{ +allMoney.toFixed(2) }}</view>
</view>
<!-- 结算和删除按钮 -->
<view class="btns flexC" @click="settleBtn">
{{ data.btnStatus ? '结算' : '删除' }}
</view>
</view>
</view>
</view>
</template>
<script setup>
import { ref,reactive,computed } from 'vue'
import {onShow,onLoad} from '@dcloudio/uni-app'
import { getCarList,getCarAdd,getCarReduce,getDelCar } from '@/api/'
onShow(()=>{
getCarLists() //购物车列表
// 默认地址
uni.getStorageSync('defaultAdres') ? data.adress = uni.getStorageSync('defaultAdres').diqu + uni.getStorageSync('defaultAdres').address : ''
console.log('默认',data.adress)
})
// 商品数组
let data = reactive({
shopList:[],
btnStatus:true ,// 右上角按钮状态
adress:'请新建默认地址',
})
// 修改右上角按钮状态
const changingOver = ()=> {
console.log(data.btnStatus)
data.btnStatus = !data.btnStatus
}
//新建收货地址
const toMyAddress = ()=> {
uni.navigateTo({
url:'/pages/mine/myAddress'
})
}
// 勾选商品
const checkShop = (index) => {
// let str = data.shopList.some(item=>item.goodstatus == 3)
// console.log(str)
data.shopList[index].checkType = !data.shopList[index].checkType
}
const settleBtn = ()=> {
if(data.btnStatus) {
// 结算的商品购物车id
let arrId = data.shopList.filter(item=>item.checkType).map(it=>it.cart_id)
uni.navigateTo({
url:`/pages/shopCar/confirmOrder?ids=${arrId.join(',')}`
})
} else {
let arr = data.shopList.filter(item=>item.checkType).map(it=>it.cart_id)
getDelCars(arr.join(',')) //删除
}
}
// 删除购物商品
const getDelCars = async (ids)=>{
try {
const res = await getDelCar(ids)
getCarLists()
uni.showToast({ title:'成功移出购物车~',icon:'none' })
console.log('getDelCar', res)
// 保存数据
} catch (err) {
uni.showToast({ title:err,icon:'none' })
console.log('getDelCar', err)
}
}
// 数量加减按钮
const numBtn = (type,item) => {
if(type == 0 ) {
if(item.total_num == 1) return uni.showToast({ title:'至少一件哦~',icon:'none' })
getCarReduces(item.cart_id,item.total_num - 1)
item.total_num = item.total_num - 1
} else {
getCarAdds(item.cart_id,item.total_num + 1)
item.total_num = item.total_num + 1
}
}
// 数量加
const getCarAdds = async (id,num)=>{
try {
const res = await getCarAdd(id,num)
console.log('getCarAdd', res)
// 保存数据
} catch (err) {
uni.showToast({ title:err,icon:'none' })
console.log('getCarAdd', err)
}
}
// 数量减
const getCarReduces = async (id,num)=>{
try {
const res = await getCarReduce(id,num)
console.log('getCarReduce', res)
// 保存数据
} catch (err) {
uni.showToast({ title:err,icon:'none' })
console.log('getCarReduce', err)
}
}
// 全选
const checkAll = ()=> {
if(allCheck.value) {
data.shopList.forEach(item=>{
item.checkType = false
})
} else {
data.shopList.forEach(item=>{
item.checkType = true
})
}
}
// 购物车列表
const getCarLists = async ()=>{
try {
const res = await getCarList()
res.goods_list.forEach(item=>item.checkType = false)
data.shopList = res.goods_list
console.log('是什么', data.shopList)
console.log('getCarList', res)
// 保存数据
} catch (err) {
console.log('getCarList', err)
}
}
// 是否全选
const allCheck = computed(() => {
return data.shopList.every(item=> item.checkType === true)
})
//总价
const allMoney = computed(() => {
return data.shopList.filter(it=>it.checkType).reduce((acc,item)=>{ return acc + item.total_price*1 },0)
})
import { ref, reactive, computed } from 'vue'
import { onShow, onLoad } from '@dcloudio/uni-app'
import { getCarList, getCarAdd, getCarReduce, getDelCar } from '@/api/'
onShow(() => {
getCarLists() //购物车列表
// 默认地址
uni.getStorageSync('defaultAdres') ? (data.adress = uni.getStorageSync('defaultAdres').diqu + uni.getStorageSync('defaultAdres').address) : ''
console.log('默认', data.adress)
})
// 商品数组
let data = reactive({
shopList: [],
btnStatus: true, // 右上角按钮状态
adress: '请新建默认地址'
})
// 修改右上角按钮状态
const changingOver = () => {
console.log(data.btnStatus)
data.btnStatus = !data.btnStatus
}
//新建收货地址
const toMyAddress = () => {
uni.navigateTo({
url: '/pages/mine/myAddress'
})
}
// 勾选商品
const checkShop = index => {
// let str = data.shopList.some(item=>item.goodstatus == 3)
// console.log(str)
data.shopList[index].checkType = !data.shopList[index].checkType
}
const settleBtn = () => {
if (data.btnStatus) {
// 结算的商品购物车id
let arrId = data.shopList.filter(item => item.checkType).map(it => it.cart_id)
uni.navigateTo({
url: `/pages/shopCar/confirmOrder?ids=${arrId.join(',')}`
})
} else {
let arr = data.shopList.filter(item => item.checkType).map(it => it.cart_id)
getDelCars(arr.join(',')) //删除
}
}
// 删除购物商品
const getDelCars = async ids => {
try {
const res = await getDelCar(ids)
getCarLists()
uni.showToast({ title: '成功移出购物车~', icon: 'none' })
console.log('getDelCar', res)
// 保存数据
} catch (err) {
uni.showToast({ title: err, icon: 'none' })
console.log('getDelCar', err)
}
}
// 数量加减按钮
const numBtn = (type, item) => {
if (type == 0) {
if (item.total_num == 1) return uni.showToast({ title: '至少一件哦~', icon: 'none' })
getCarReduces(item.cart_id, item.total_num - 1)
item.total_num = item.total_num - 1
} else {
getCarAdds(item.cart_id, item.total_num + 1)
item.total_num = item.total_num + 1
}
}
// 数量加
const getCarAdds = async (id, num) => {
try {
const res = await getCarAdd(id, num)
console.log('getCarAdd', res)
// 保存数据
} catch (err) {
uni.showToast({ title: err, icon: 'none' })
console.log('getCarAdd', err)
}
}
// 数量减
const getCarReduces = async (id, num) => {
try {
const res = await getCarReduce(id, num)
console.log('getCarReduce', res)
// 保存数据
} catch (err) {
uni.showToast({ title: err, icon: 'none' })
console.log('getCarReduce', err)
}
}
// 全选
const checkAll = () => {
if (allCheck.value) {
data.shopList.forEach(item => {
item.checkType = false
})
} else {
data.shopList.forEach(item => {
item.checkType = true
})
}
}
// 购物车列表
const getCarLists = async () => {
try {
const res = await getCarList()
res.goods_list.forEach(item => (item.checkType = false))
data.shopList = res.goods_list
console.log('是什么', data.shopList)
console.log('getCarList', res)
// 保存数据
} catch (err) {
console.log('getCarList', err)
}
}
// 是否全选
const allCheck = computed(() => {
return data.shopList.every(item => item.checkType === true)
})
//总价
const allMoney = computed(() => {
return data.shopList
.filter(it => it.checkType)
.reduce((acc, item) => {
return acc + item.total_price * 1
}, 0)
})
</script>
<style lang="scss">
.u-icon__icon {
display: none !important;
}
page {
background: #F6F8FA;
}
.minBox {
width: 100%;
padding: 24rpx;
box-sizing: border-box;
.topBox {
margin: 24rpx 0;
.amount {
image {
margin-right: 8rpx;
width: 24rpx;
height: 24rpx;
}
.adress {
width: 424rpx;
line-height: 32rpx;
color: #323233ff;
font-size: 24rpx;
}
}
.manage {
color: #323233ff;
font-size: 32rpx;
line-height: 40rpx;
}
}
.shopBox {
padding: 32rpx 24rpx 24rpx 24rpx;
border-radius: 24rpx;
background: #ffffffff;
margin-bottom: 24rpx;
.checkIc {
margin-right: 24rpx;
image {
width: 36rpx;
height: 36rpx;
}
}
.shopPhoto {
position: relative;
margin-right: 24rpx;
width: 180rpx;
height: 180rpx;
image {
width: 180rpx;
height: 180rpx;
border-radius: 16rpx;
background: #f5f5f5ff;
}
.shopStatus {
position: absolute;
left: 0;
top: 0;
width: 180rpx;
height: 180rpx;
border-radius: 16rpx;
opacity: 0.9;
}
}
.infoBox {
width: 100%;
height: 180rpx;
display: flex;
flex-direction: column;
justify-content: space-between;
.title {
color: #323233ff;
font-size: 28rpx;
}
// .modes {
// color: #00000072;
// text {
// font-size: 22rpx;
// padding: 0 16rpx;
// background: rgba(0, 0, 0, 0.1);
// border-radius: 16rpx;
// }
// }
.numBox {
.rightTitle {
color: #F33F2E;
font-size: 40rpx;
font-weight: 700;
text {
margin-top: 10rpx;
color: #f33f2eff;
font-size: 24rpx;
font-weight: 700;
}
}
.and {
image {
width: 56rpx;
height: 56rpx;
}
.num {
width: 64rpx;
height: 56rpx;
color: #333333ff;
font-size: 28rpx;
background: #f2f3f5ff;
margin: 0 4rpx;
}
}
}
}
}
}
.payBox {
position: fixed;
bottom: 0;
width: 100%;
height: 96rpx;
background-color: #fff;
.allIc {
margin-left: 34rpx;
color: #646566ff;
font-size: 26rpx;
image {
margin-right: 10rpx;
width: 32rpx;
height: 32rpx;
}
}
.amountBox {
margin-right: 32rpx;
.settleBox {
margin-right: 16rpx;
.settle {
color: #323233ff;
font-size: 26rpx;
}
.money {
color: #f33f2eff;
font-size: 32rpx;
font-weight: 700;
}
}
.btns {
width: 236rpx;
height: 72rpx;
border-radius: 80rpx;
opacity: 1;
background: linear-gradient(-88deg, #fe6434ff 0%, #ff2f2fff 100%);
color: #ffffffff;
font-size: 28rpx;
font-weight: 700;
}
}
}
.nullBox {
margin-top: 266rpx;
image {
width: 262rpx;
height: 240rpx;
margin-bottom: 24rpx;
}
color: #C6C5C8;
font-size: 28rpx;
}
.u-icon__icon {
display: none !important;
}
page {
background: #f6f8fa;
}
.minBox {
width: 100%;
padding: 24rpx;
box-sizing: border-box;
.topBox {
margin: 24rpx 0;
.amount {
image {
margin-right: 8rpx;
width: 24rpx;
height: 24rpx;
}
.adress {
width: 424rpx;
line-height: 32rpx;
color: #323233ff;
font-size: 24rpx;
}
}
.manage {
color: #323233ff;
font-size: 32rpx;
line-height: 40rpx;
}
}
.shopBox {
padding: 32rpx 24rpx 24rpx 24rpx;
border-radius: 24rpx;
background: #ffffffff;
margin-bottom: 24rpx;
.checkIc {
margin-right: 24rpx;
image {
width: 36rpx;
height: 36rpx;
}
}
.shopPhoto {
position: relative;
margin-right: 24rpx;
width: 180rpx;
height: 180rpx;
image {
width: 180rpx;
height: 180rpx;
border-radius: 16rpx;
background: #f5f5f5ff;
}
.shopStatus {
position: absolute;
left: 0;
top: 0;
width: 180rpx;
height: 180rpx;
border-radius: 16rpx;
opacity: 0.9;
}
}
.infoBox {
width: 100%;
height: 180rpx;
display: flex;
flex-direction: column;
justify-content: space-between;
.title {
color: #323233ff;
font-size: 28rpx;
}
// .modes {
// color: #00000072;
// text {
// font-size: 22rpx;
// padding: 0 16rpx;
// background: rgba(0, 0, 0, 0.1);
// border-radius: 16rpx;
// }
// }
.numBox {
.rightTitle {
color: #f33f2e;
font-size: 40rpx;
font-weight: 700;
text {
margin-top: 10rpx;
color: #f33f2eff;
font-size: 24rpx;
font-weight: 700;
}
}
.and {
image {
width: 56rpx;
height: 56rpx;
}
.num {
width: 64rpx;
height: 56rpx;
color: #333333ff;
font-size: 28rpx;
background: #f2f3f5ff;
margin: 0 4rpx;
}
}
}
}
}
}
.payBox {
position: fixed;
bottom: 0;
width: 100%;
height: 96rpx;
background-color: #fff;
.allIc {
margin-left: 34rpx;
color: #646566ff;
font-size: 26rpx;
image {
margin-right: 10rpx;
width: 32rpx;
height: 32rpx;
}
}
.amountBox {
margin-right: 32rpx;
.settleBox {
margin-right: 16rpx;
.settle {
color: #323233ff;
font-size: 26rpx;
}
.money {
color: #f33f2eff;
font-size: 32rpx;
font-weight: 700;
}
}
.btns {
width: 236rpx;
height: 72rpx;
border-radius: 80rpx;
opacity: 1;
background: linear-gradient(-88deg, #fe6434ff 0%, #ff2f2fff 100%);
color: #ffffffff;
font-size: 28rpx;
font-weight: 700;
}
}
}
.nullBox {
margin-top: 266rpx;
image {
width: 262rpx;
height: 240rpx;
margin-bottom: 24rpx;
}
color: #c6c5c8;
font-size: 28rpx;
}
</style>
... ...
... ... @@ -27,7 +27,7 @@ var methods = {
pay(res) {
if (res.appId) {
common_vendor.index.requestPayment({
"provider": "wxpay",
provider: "wxpay",
timeStamp: res.timeStamp,
nonceStr: res.nonceStr,
package: res.package,
... ...
... ... @@ -8,6 +8,7 @@ if (!Math) {
"./pages/index/search.js";
"./pages/index/shopDetaile.js";
"./pages/index/allComment.js";
"./pages/index/bargainPrice.js";
"./pages/class/class.js";
"./pages/class/classList.js";
"./pages/pointsMall/pointsMall.js";
... ...
... ... @@ -4,6 +4,7 @@
"pages/index/search",
"pages/index/shopDetaile",
"pages/index/allComment",
"pages/index/bargainPrice",
"pages/class/class",
"pages/class/classList",
"pages/pointsMall/pointsMall",
... ...
... ... @@ -8774,6 +8774,7 @@ exports.getCurrentInstance = getCurrentInstance;
exports.index = index$1;
exports.isRef = isRef;
exports.n = n;
exports.nextTick = nextTick;
exports.o = o;
exports.onHide = onHide;
exports.onLoad = onLoad;
... ...
... ... @@ -99,11 +99,6 @@ const _sfc_main = {
const res = await api_index.getPay(params);
proxy.$methods.pay(res);
canclePop();
console.log("getPay", res);
common_vendor.index.showToast({ title: "\u652F\u4ED8\u6210\u529F", icon: "none" });
setTimeout(() => {
common_vendor.index.navigateBack();
}, 1500);
} catch (err) {
common_vendor.index.showToast({ title: err, icon: "none" });
console.log("getPay", err);
... ...
... ... @@ -62,7 +62,7 @@
.popBox .popModeBox .insufficient .go {
margin-left: 8rpx;
font-size: 24rpx;
color: #FB3E3C;
color: #fb3e3c;
line-height: 32rpx;
}
.popBox .popModeBox .insufficient .go image {
... ...
... ... @@ -8,7 +8,12 @@ const _sfc_main = {
}
},
setup(__props) {
const props = __props;
const textHandler = (orderStatus) => [1, 11].includes(orderStatus) ? "\u9700\u4ED8\u6B3E\uFF1A" : [2, 3, 4, 21].includes(orderStatus) ? "\u5B9E\u4ED8\u6B3E\uFF1A" : "";
common_vendor.onMounted(() => {
common_vendor.nextTick(() => {
console.log(props.shop, "\u8BA2\u5355\u6570\u636E\u662F\u4EC0\u4E48");
});
});
return (_ctx, _cache) => {
return {
... ... @@ -21,12 +26,14 @@ const _sfc_main = {
e: it.goodstatus != 3
}, it.goodstatus != 3 ? {
f: common_vendor.t(it.total_price),
g: common_vendor.t(it.total_price)
g: common_vendor.t(textHandler(__props.shop.order_status)),
h: common_vendor.t(it.total_price)
} : {
h: common_vendor.t(it.coscore),
i: common_vendor.t(it.diff_price)
i: common_vendor.t(textHandler(__props.shop.order_status)),
j: common_vendor.t(it.coscore),
k: common_vendor.t(it.diff_price)
}, {
j: it.id
l: it.id
});
})
};
... ...
<view wx:for="{{a}}" wx:for-item="it" wx:key="j" class="shop"><view class="shopPhoto"><image src="{{it.a}}" mode=""></image></view><view class="info"><view class="shopTitle ellipsis">{{it.b}}</view><view class="desc ellipsis">{{it.c}}</view><view class="num ellipsis">x{{it.d}}</view><view wx:if="{{it.e}}" class="priceBox flexJ"><text>￥{{it.f}}</text><view class="reality flexA"><view class="shi">实付款:</view><text>￥</text><view class="price">{{it.g}}</view></view></view><view wx:else class="pointsShop"><text>需付款：</text><image src="/static/shopCarIc/pointsIc.png" mode=""></image><view class="points">{{it.h}}</view><view class="pointsPrice">￥{{it.i}}</view></view></view></view>
\ No newline at end of file
<view wx:for="{{a}}" wx:for-item="it" wx:key="l" class="shop"><view class="shopPhoto"><image src="{{it.a}}" mode=""></image></view><view class="info"><view class="shopTitle ellipsis">{{it.b}}</view><view class="desc ellipsis">{{it.c}}</view><view class="num ellipsis">x{{it.d}}</view><view wx:if="{{it.e}}" class="priceBox flexJ"><text>￥{{it.f}}</text><view class="reality flexA"><view class="shi">{{it.g}}</view><text>￥</text><view class="price">{{it.h}}</view></view></view><view wx:else class="pointsShop"><text>{{it.i}}</text><image src="/static/shopCarIc/pointsIc.png" mode=""></image><view class="points">{{it.j}}</view><view class="pointsPrice">￥{{it.k}}</view></view></view></view>
\ No newline at end of file
... ...
... ... @@ -18,6 +18,7 @@ const _sfc_main = {
type: Number,
default: 0
},
shopType: Number,
payPopShow: {
type: Boolean,
default: false
... ... @@ -111,11 +112,21 @@ const _sfc_main = {
};
return (_ctx, _cache) => {
return common_vendor.e({
a: common_vendor.t(__props.btnType == 0 ? "\u52A0\u5165\u8D2D\u7269\u8F66" : "\u7ACB\u5373\u8D2D\u4E70"),
b: __props.shopDetail.spec[0].spec_image,
c: common_vendor.t(__props.shopDetail.name),
d: common_vendor.t(__props.shopDetail.spec[0].goods_price),
e: common_vendor.f(common_vendor.unref(data).speList, (item, index, i0) => {
a: __props.shopType !== 3
}, __props.shopType !== 3 ? {
b: common_vendor.t(__props.btnType == 0 ? "\u52A0\u5165\u8D2D\u7269\u8F66" : "\u7ACB\u5373\u8D2D\u4E70")
} : {}, {
c: __props.shopType === 3
}, __props.shopType === 3 ? {} : {}, {
d: __props.shopDetail.spec[0].spec_image,
e: common_vendor.t(__props.shopDetail.name),
f: __props.shopDetail.goodstatus !== 3
}, __props.shopDetail.goodstatus !== 3 ? {
g: common_vendor.t(__props.shopDetail.spec[0].goods_price)
} : {
h: common_vendor.t(__props.shopDetail.spec[0].coscore)
}, {
i: common_vendor.f(common_vendor.unref(data).speList, (item, index, i0) => {
return {
a: common_vendor.t(item.group_name),
b: common_vendor.f(item.spec_items, (it, idx, i1) => {
... ... @@ -129,21 +140,21 @@ const _sfc_main = {
c: item.group_id
};
}),
f: common_vendor.o(valChange),
g: common_vendor.o(($event) => _ctx.value = $event),
h: common_vendor.p({
j: common_vendor.o(valChange),
k: common_vendor.o(($event) => _ctx.value = $event),
l: common_vendor.p({
modelValue: _ctx.value
}),
i: __props.btnType == 0
m: __props.btnType == 0
}, __props.btnType == 0 ? {
j: common_vendor.o(popBtn)
n: common_vendor.o(popBtn)
} : {
k: common_vendor.t(__props.shopDetail.goodstatus == 3 ? "\u7ACB\u5373\u5151\u6362" : "\u7ACB\u5373\u8D2D\u4E70"),
l: common_vendor.o(popBtn)
o: common_vendor.t(__props.shopDetail.goodstatus == 3 ? "\u7ACB\u5373\u5151\u6362" : "\u7ACB\u5373\u8D2D\u4E70"),
p: common_vendor.o(popBtn)
}, {
m: common_vendor.o(close),
n: common_vendor.o(_ctx.open),
o: common_vendor.p({
q: common_vendor.o(close),
r: common_vendor.o(_ctx.open),
s: common_vendor.p({
show: __props.payPopShow,
mode: "bottom",
closeable: true,
... ...
<u-popup wx:if="{{o}}" u-s="{{['d']}}" bindclose="{{m}}" bindopen="{{n}}" u-i="4f7ddfed-0" bind:__l="__l" u-p="{{o}}"><view class="popBox"><view class="title flexC">{{a}}</view><view class="topBox flexA"><view class="shopPhoto"><image src="{{b}}" mode=""></image></view><view class="price"><view class="shopName ellipsis">{{c}}</view><view class="money"> ￥{{d}}</view></view></view><view wx:for="{{e}}" wx:for-item="item" wx:key="c" style="margin-bottom:44rpx"><view class="specificationsTile">{{item.a}}</view><view class="colorBox"><view wx:for="{{item.b}}" wx:for-item="it" wx:key="b" class="{{['item', it.c]}}" bindtap="{{it.d}}">{{it.a}}</view></view></view><view class="numBox flexJ"><view class="rightTitle flexA"> 数量 </view><view class="and flexA"><u-number-box wx:if="{{h}}" bindchange="{{f}}" u-i="4f7ddfed-1,4f7ddfed-0" bind:__l="__l" bindupdateModelValue="{{g}}" u-p="{{h}}"></u-number-box></view></view><view wx:if="{{i}}" class="popBtn flexC" bindtap="{{j}}"> 加入购物车 </view><view wx:else class="popBtn1 flexC" bindtap="{{l}}">{{k}}</view></view></u-popup>
\ No newline at end of file
<u-popup wx:if="{{s}}" u-s="{{['d']}}" bindclose="{{q}}" bindopen="{{r}}" u-i="4f7ddfed-0" bind:__l="__l" u-p="{{s}}"><view class="popBox"><view wx:if="{{a}}" class="title flexC">{{b}}</view><view wx:if="{{c}}" class="title flexC">立即兑换</view><view class="topBox flexA"><view class="shopPhoto"><image src="{{d}}" mode=""></image></view><view class="price"><view class="shopName ellipsis">{{e}}</view><view wx:if="{{f}}" class="money">￥{{g}}</view><view wx:else class="money">{{h}}积分</view></view></view><view wx:for="{{i}}" wx:for-item="item" wx:key="c" style="margin-bottom:44rpx"><view class="specificationsTile">{{item.a}}</view><view class="colorBox"><view wx:for="{{item.b}}" wx:for-item="it" wx:key="b" class="{{['item', it.c]}}" bindtap="{{it.d}}">{{it.a}}</view></view></view><view class="numBox flexJ"><view class="rightTitle flexA">数量</view><view class="and flexA"><u-number-box wx:if="{{l}}" bindchange="{{j}}" u-i="4f7ddfed-1,4f7ddfed-0" bind:__l="__l" bindupdateModelValue="{{k}}" u-p="{{l}}"></u-number-box></view></view><view wx:if="{{m}}" class="popBtn flexC" bindtap="{{n}}">加入购物车</view><view wx:else class="popBtn1 flexC" bindtap="{{p}}">{{o}}</view></view></u-popup>
\ No newline at end of file
... ...
... ... @@ -113,13 +113,13 @@
height: 32rpx;
}
.popBox .payBox .yue {
color: #F33F2E;
color: #f33f2e;
font-size: 30rpx;
font-weight: 700;
}
.popBox .payBox .yue text {
margin-top: 5rpx;
color: #F33F2E;
color: #f33f2e;
font-size: 24rpx;
}
.popBox .popBtn {
... ...
... ... @@ -17,7 +17,8 @@ const _sfc_main = {
list: {
type: Array,
default: []
}
},
isClass: Boolean
},
setup(__props) {
const props = __props;
... ... @@ -46,16 +47,20 @@ const _sfc_main = {
e: __props.shopHeight == 322
}, __props.shopHeight == 322 ? {
f: common_vendor.t(item.line_price)
} : {}, {
g: __props.isClass
}, __props.isClass ? {
h: common_vendor.t(item.spyprice)
} : {}) : {
g: common_vendor.t(item.coscore)
i: common_vendor.t(item.coscore)
}, __props.shopWidth == 344 ? {
h: common_vendor.t(__props.pointShop ? "\u5DF2\u5151\u6362\uFF1A" : "\u5DF2\u552E\uFF1A"),
i: common_vendor.t(item.sales_actual)
j: common_vendor.t(__props.pointShop ? "\u5DF2\u5151\u6362\uFF1A" : "\u5DF2\u552E\uFF1A"),
k: common_vendor.t(item.sales_actual)
} : {}, __props.shopHeight == 322 ? {
j: common_vendor.t(item.stock_num)
l: common_vendor.t(item.stock_num)
} : {}, {
k: item.id,
l: common_vendor.o(($event) => toDetaile(item.id), item.id)
m: item.id,
n: common_vendor.o(($event) => toDetaile(item.id), item.id)
});
}),
b: !__props.pointShop,
... ...
<view class="flexW" style="{{e}}"><view wx:for="{{a}}" wx:for-item="item" wx:key="k" class="shopBox" bindtap="{{item.l}}"><view class="shopPhoto"><image src="{{item.a}}" mode=""></image></view><view class="btomBox"><view class="shopName ellipsis">{{item.b}}</view><view class="desc ellipsis">{{item.c}}</view><view wx:if="{{b}}" class="shopPrice flexA"><view class="new">￥{{item.d}}</view><view wx:if="{{item.e}}" class="original">￥{{item.f}}</view></view><view wx:else class="points"><image src="/static/shopCarIc/pointsIc.png" mode=""></image> {{item.g}}</view><view wx:if="{{c}}" class="sold">{{item.h}}{{item.i}}份</view><view wx:if="{{d}}" class="sold">库存：{{item.j}}件</view></view></view></view>
\ No newline at end of file
<view class="flexW" style="{{e}}"><view wx:for="{{a}}" wx:for-item="item" wx:key="m" class="shopBox" bindtap="{{item.n}}"><view class="shopPhoto"><image src="{{item.a}}" mode=""></image></view><view class="btomBox"><view class="shopName ellipsis">{{item.b}}</view><view class="desc ellipsis">{{item.c}}</view><view wx:if="{{b}}" class="shopPrice flexA"><view class="new">￥{{item.d}}</view><view wx:if="{{item.e}}" class="original">￥{{item.f}}</view><view wx:if="{{item.g}}" class="original">￥{{item.h}}</view></view><view wx:else class="points"><image src="/static/shopCarIc/pointsIc.png" mode=""></image> {{item.i}}</view><view wx:if="{{c}}" class="sold">{{item.j}}{{item.k}}份</view><view wx:if="{{d}}" class="sold">库存：{{item.l}}件</view></view></view></view>
\ No newline at end of file
... ...
... ... @@ -15,28 +15,15 @@ const _sfc_main = {
shopList.value = res;
console.log(res, "\u5206\u7C7B\u5546\u54C1\u5217\u8868");
});
const keyWord = common_vendor.ref("");
const doSearchs = () => {
};
const input = (e) => {
if (e.detail.value == "") {
emit("input", e.detail.value);
}
};
return (_ctx, _cache) => {
return common_vendor.e({
a: common_vendor.o(doSearchs),
b: common_vendor.o(input),
c: common_vendor.p({
keyWord: keyWord.value,
disabled: false
}),
d: common_vendor.p({
a: common_vendor.p({
list: shopList.value,
shopWidth: 344,
shopHeight: 344
shopHeight: 344,
isClass: true
}),
e: !shopList.value.length
b: !shopList.value.length
}, !shopList.value.length ? {} : {});
};
}
... ...
<search wx:if="{{c}}" binddoSearchs="{{a}}" bindinput="{{b}}" u-i="33f20787-0" bind:__l="__l" u-p="{{c}}"></search><view class="mainBox"><shops wx:if="{{d}}" u-i="33f20787-1" bind:__l="__l" u-p="{{d}}"/></view><view wx:if="{{e}}" class="null flexV"><image class="sss" src="/static/pointsMallic/pointsShopNull.png" mode=""></image><text>暂无商品信息</text></view>
\ No newline at end of file
<search u-i="33f20787-0" bind:__l="__l"></search><view class="mainBox"><shops wx:if="{{a}}" u-i="33f20787-1" bind:__l="__l" u-p="{{a}}"/></view><view wx:if="{{b}}" class="null flexV"><image class="sss" src="/static/pointsMallic/pointsShopNull.png" mode=""></image><text>暂无商品信息</text></view>
\ No newline at end of file
... ...
"use strict";
var common_vendor = require("../../common/vendor.js");
var api_index = require("../../api/index.js");
require("../../utils/request.js");
if (!Array) {
const _easycom_u_navbar2 = common_vendor.resolveComponent("u-navbar");
_easycom_u_navbar2();
}
const _easycom_u_navbar = () => "../../uni_modules/uview-plus/components/u-navbar/u-navbar.js";
if (!Math) {
(_easycom_u_navbar + search + shops)();
}
const search = () => "../../componets/searchBox.js";
const shops = () => "../../componets/shops.js";
const _sfc_main = {
setup(__props) {
common_vendor.onShow(() => {
getIndexs();
});
let shopList = common_vendor.ref([]);
const getIndexs = async () => {
try {
const res = await api_index.getIndex();
shopList.value = res.tjgoods;
} catch (err) {
common_vendor.index.showToast({ title: err, icon: "none" });
console.log("getIndex", err);
}
};
return (_ctx, _cache) => {
return common_vendor.e({
a: common_vendor.p({
bgColor: "#F6F8FA",
title: "\u7279\u4EF7\u4E13\u533A",
placeholder: true,
autoBack: true
}),
b: common_vendor.p({
list: common_vendor.unref(shopList),
shopWidth: 344,
shopHeight: 344,
pointShop: false
}),
c: !common_vendor.unref(shopList).length
}, !common_vendor.unref(shopList).length ? {} : {});
};
}
};
var MiniProgramPage = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["__file", "D:/vue/\u5927\u5065\u5EB7\u5546\u57CE/healthMall/pages/index/bargainPrice.vue"]]);
wx.createPage(MiniProgramPage);
... ...
{
"navigationStyle": "custom",
"usingComponents": {
"u-navbar": "../../uni_modules/uview-plus/components/u-navbar/u-navbar",
"search": "../../componets/searchBox",
"shops": "../../componets/shops"
}
}
\ No newline at end of file
... ...
<view><u-navbar wx:if="{{a}}" u-i="b00c9e08-0" bind:__l="__l" u-p="{{a}}"></u-navbar><view><search u-i="b00c9e08-1" bind:__l="__l"/><view class="mainBox"><shops wx:if="{{b}}" u-i="b00c9e08-2" bind:__l="__l" u-p="{{b}}"/></view></view><view wx:if="{{c}}" class="null flexV"><image class="sss" src="/static/pointsMallic/pointsShopNull.png" mode=""></image><text>暂无商品信息</text></view></view>
\ No newline at end of file
... ...
/**
* 这里是uni-app内置的常用样式变量
*
* uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
* 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
*
*/
/**
* 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
*
* 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
*/
/* uni.scss */
/* 颜色变量 */
/* 行为相关颜色 */
/* 文字基本颜色 */
/* 背景颜色 */
/* 边框颜色 */
/* 尺寸变量 */
/* 文字尺寸 */
/* 图片尺寸 */
/* Border Radius */
/* 水平间距 */
/* 垂直间距 */
/* 透明度 */
/* 文章场景相关 */
page {
background: #f6f8fa;
}
.mainBox {
width: 100%;
padding: 16rpx 24rpx;
box-sizing: border-box;
}
.null {
margin-top: 266rpx;
}
.null text {
position: relative;
margin-top: -80rpx;
color: #00000066;
font-size: 26rpx;
}
.null image {
width: 348rpx;
height: 348rpx;
}
\ No newline at end of file
... ...
... ... @@ -14,7 +14,11 @@ const search = () => "../../componets/searchBox.js";
const shops = () => "../../componets/shops.js";
const _sfc_main = {
setup(__props) {
const lastPage = common_vendor.ref(1);
const curPage = common_vendor.ref(1);
common_vendor.onShow(() => {
curPage.value = 1;
data.recommendList.splice(0);
getIndexs();
});
const toRecharg = () => {
... ... @@ -32,18 +36,27 @@ const _sfc_main = {
common_vendor.index.switchTab({ url: "/pages/class/class" });
};
const jumpClassHandler = () => common_vendor.index.switchTab({ url: "/pages/class/class" });
const toBargainPriceMoreHandler = () => common_vendor.index.navigateTo({ url: "/pages/index/bargainPrice" });
const getIndexs = async () => {
try {
const res = await api_index.getIndex();
const res = await api_index.getIndex({ page: curPage.value });
data.classList = res.fenlei;
data.specialList = res.tjgoods;
data.recommendList = res.goods;
data.recommendList = data.recommendList.concat(res.goods.data);
console.log(data.recommendList, "\u63A8\u8350\u5546\u54C1");
console.log("getIndex", res);
lastPage.value = res.goods.last_page;
} catch (err) {
common_vendor.index.showToast({ title: err, icon: "none" });
console.log("getIndex", err);
}
};
common_vendor.onReachBottom(() => {
curPage.value++;
if (curPage.value >= lastPage.value)
return;
api_index.getIndex();
});
return (_ctx, _cache) => {
return {
a: common_vendor.p({
... ... @@ -59,12 +72,13 @@ const _sfc_main = {
};
}),
d: common_vendor.o(jumpClassHandler),
e: common_vendor.p({
e: common_vendor.o(toBargainPriceMoreHandler),
f: common_vendor.p({
list: common_vendor.unref(data).specialList.slice(0, 2),
shopWidth: 322,
shopHeight: 322
}),
f: common_vendor.p({
g: common_vendor.p({
list: common_vendor.unref(data).recommendList,
shopWidth: 344,
shopHeight: 344
... ...
<view><u-navbar wx:if="{{a}}" u-s="{{['left']}}" u-i="0a7f8b7d-0" bind:__l="__l" u-p="{{a}}"><view class="u-nav-slot" slot="left">大健康商城</view></u-navbar><view class="topBgBox"><image src="/static/indexIc/topBg.png" mode=""></image><view class="searchBox"><search u-i="0a7f8b7d-1" bind:__l="__l"></search><view class="vip flexC" bindtap="{{b}}"><image src="/static/indexIc/vip.png" mode=""></image></view></view></view><view class="classBox"><view wx:for="{{c}}" wx:for-item="item" wx:key="c" class="itemClss flexV" bindtap="{{item.d}}"><image src="{{item.a}}" mode=""></image><text>{{item.b}}</text></view><view class="itemClss flexV" bindtap="{{d}}"><image src="/static/indexIc/classIc.png" mode=""></image><text>更多</text></view></view><view class="specialOffer"><image class="pinkBg" src="/static/indexIc/pinkBg.png" mode=""></image><view class="special"><view class="topBox flexJ"><view class="titles"><view class="title">特价专区</view><text>JiangChengYuanTi</text></view><view class="more flexA"> 更多 <image src="/static/indexIc/orangeRight.png" mode=""></image></view></view><view class="shop"><shops wx:if="{{e}}" u-i="0a7f8b7d-2" bind:__l="__l" u-p="{{e}}"></shops></view></view></view><view class="recom flexA"><image src="/static/indexIc/recommendIc.png" mode=""></image> 推荐商品 <text>限时限量好物推荐</text></view><view class="recomBox"><shops wx:if="{{f}}" u-i="0a7f8b7d-3" bind:__l="__l" u-p="{{f}}"></shops></view></view>
\ No newline at end of file
<view><u-navbar wx:if="{{a}}" u-s="{{['left']}}" u-i="0a7f8b7d-0" bind:__l="__l" u-p="{{a}}"><view class="u-nav-slot" slot="left">大健康商城</view></u-navbar><view class="topBgBox"><image src="/static/indexIc/topBg.png" mode=""></image><view class="searchBox"><search u-i="0a7f8b7d-1" bind:__l="__l"></search><view class="vip flexC" bindtap="{{b}}"><image src="/static/indexIc/vip.png" mode=""></image></view></view></view><view class="classBox"><view wx:for="{{c}}" wx:for-item="item" wx:key="c" class="itemClss flexV" bindtap="{{item.d}}"><image src="{{item.a}}" mode=""></image><text>{{item.b}}</text></view><view class="itemClss flexV" bindtap="{{d}}"><image src="/static/indexIc/classIc.png" mode=""></image><text>更多</text></view></view><view class="specialOffer"><image class="pinkBg" src="/static/indexIc/pinkBg.png" mode=""></image><view class="special"><view class="topBox flexJ"><view class="titles"><view class="title">特价专区</view><text>Special price zone</text></view><view class="more flexA" bindtap="{{e}}"> 更多 <image src="/static/indexIc/orangeRight.png" mode=""></image></view></view><view class="shop"><shops wx:if="{{f}}" u-i="0a7f8b7d-2" bind:__l="__l" u-p="{{f}}"></shops></view></view></view><view class="recom flexA"><image src="/static/indexIc/recommendIc.png" mode=""></image> 推荐商品 <text>限时限量好物推荐</text></view><view class="recomBox"><shops wx:if="{{g}}" u-i="0a7f8b7d-3" bind:__l="__l" u-p="{{g}}"></shops></view></view>
\ No newline at end of file
... ...
... ... @@ -27,11 +27,7 @@ const _sfc_main = {
payPopShow.value = false;
});
const currentNum = common_vendor.ref(0);
common_vendor.reactive([
"https://cdn.uviewui.com/uview/swiper/swiper2.png",
"https://cdn.uviewui.com/uview/swiper/swiper3.png",
"https://cdn.uviewui.com/uview/swiper/swiper1.png"
]);
common_vendor.reactive(["https://cdn.uviewui.com/uview/swiper/swiper2.png", "https://cdn.uviewui.com/uview/swiper/swiper3.png", "https://cdn.uviewui.com/uview/swiper/swiper1.png"]);
const icList = common_vendor.reactive([
{ id: 1, name: "\u5E97\u94FA", icon: "/static/indexIc/shopIc.png" },
{ id: 2, name: "\u5BA2\u670D", icon: "/static/indexIc/service.png" },
... ... @@ -161,6 +157,7 @@ const _sfc_main = {
x: common_vendor.p({
moreSpec: common_vendor.unref(moreSpec),
shopDetail: common_vendor.unref(detaileList),
shopType: common_vendor.unref(shopType),
btnType: common_vendor.unref(btnType),
payPopShow: common_vendor.unref(payPopShow)
})
... ...
... ... @@ -38,7 +38,7 @@
justify-content: center;
}
.indicator-num__text {
color: #FFFFFF;
color: #ffffff;
font-size: 12px;
}
.swiperBox {
... ...
... ... @@ -22,7 +22,7 @@ const _sfc_main = {
const submit = () => {
getComments();
};
const addPhoto = () => proxy.$methods.upload("http://healthmall.shs.broing.cn/api/common/upload", (imgUrl) => {
const addPhoto = () => proxy.$methods.upload("http://health.shs.broing.cn/api/common/upload", (imgUrl) => {
console.log("\u8FD4\u56DE\u56FE\u7247", imgUrl);
photoList.push(imgUrl.avatar);
});
... ...
<view><u-navbar wx:if="{{a}}" u-i="6013ecfd-0" bind:__l="__l" u-p="{{a}}"></u-navbar><view class="boxs"><view class="title">上传图片</view><view class="photoBox"><view wx:for="{{b}}" wx:for-item="item" wx:key="c" class="itemPhoto"><image class="photo" src="{{item.a}}" mode=""></image><view class="delBox flexC" bindtap="{{item.b}}"><image class="del" src="/static/mineIc/close.png" mode=""></image></view></view><view class="addPhoto flexV" bindtap="{{d}}"><image src="/static/mineIc/addIC.png" mode=""></image> 还可添加{{c}}张 </view></view><view class="desc"><block wx:if="{{r0}}"><textarea placeholder-class="pls" placeholder="请输入" name="" id="" cols="30" rows="10" value="{{e}}" bindinput="{{f}}"></textarea></block></view><view class="startBox flexA"><text>综合评分</text><u-rate wx:if="{{h}}" u-i="6013ecfd-1" bind:__l="__l" bindupdateModelValue="{{g}}" u-p="{{h}}"></u-rate></view></view><view class="btnBox iosAuto"><view class="btn flexC" bindtap="{{i}}"> 提交评论 </view></view></view>
\ No newline at end of file
<view><u-navbar wx:if="{{a}}" u-i="6013ecfd-0" bind:__l="__l" u-p="{{a}}"></u-navbar><view class="boxs"><view class="title">上传图片</view><view class="photoBox"><view wx:for="{{b}}" wx:for-item="item" wx:key="c" class="itemPhoto"><image class="photo" src="{{item.a}}" mode=""></image><view class="delBox flexC" bindtap="{{item.b}}"><image class="del" src="/static/mineIc/close.png" mode=""></image></view></view><view class="addPhoto flexV" bindtap="{{d}}"><image src="/static/mineIc/addIC.png" mode=""></image> 还可添加{{c}}张 </view></view><view class="desc"><block wx:if="{{r0}}"><textarea placeholder-class="pls" placeholder="请输入" name="" id="" cols="30" rows="10" value="{{e}}" bindinput="{{f}}"></textarea></block></view><view class="startBox flexA"><text>综合评分</text><u-rate wx:if="{{h}}" u-i="6013ecfd-1" bind:__l="__l" bindupdateModelValue="{{g}}" u-p="{{h}}"></u-rate></view></view><view class="btnBox iosAuto"><view class="btn flexC" bindtap="{{i}}">提交评论</view></view></view>
\ No newline at end of file
... ...
... ... @@ -62,7 +62,7 @@ page {
top: 0;
width: 24rpx;
height: 24rpx;
background: #484B46;
background: #484b46;
border-radius: 0 8rpx 0 8rpx;
}
.boxs .photoBox .itemPhoto .delBox .del {
... ...