|
|
@@ -0,0 +1,315 @@
|
|
|
+<template>
|
|
|
+ <view>
|
|
|
+ <u-checkbox-group v-model="companyValue" placement="column" @change="companyChange">
|
|
|
+ <view class="collection" v-for="(item,index) in dataList" :key="index">
|
|
|
+ <view>
|
|
|
+ <u-checkbox activeColor="#FD4B09" shape="circle" :customStyle="{marginBottom: '8px'}"
|
|
|
+ :label="item.name" :name="item.name" labelSize="28rpx"></u-checkbox>
|
|
|
+ </view>
|
|
|
+ <view style="margin-left: 20rpx;display: flex;align-items: center;" v-for="(ite,ind) in item.list"
|
|
|
+ :key="ind">
|
|
|
+ <view>
|
|
|
+ <image v-for="(li,inde) in ite.orderItemsList" :key="inde" :src="li.url"
|
|
|
+ style="width: 200rpx;height: 200rpx;border-radius: 20rpx;">
|
|
|
+ </image>
|
|
|
+ </view>
|
|
|
+ <view class="goods" >
|
|
|
+ <u--text v-for="(ites,inds) in ite.orderItemsList" :text="ites.goodsName" size="24rpx" lines="2"></u--text>
|
|
|
+ <view class="price" v-for="(ites,inds) in ite.orderItemsList">
|
|
|
+ <view>￥{{ites.price}}</view>
|
|
|
+ <view v-if="!editDel">
|
|
|
+ <u-number-box v-model="ites.goodsNum" :min="1" :max="ites.inventory" buttonSize="40rpx"
|
|
|
+ @change="(val)=>{statistics(val,index,ind)}"></u-number-box>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view v-if="editDel">
|
|
|
+ <u-icon name="minus-circle-fill" color="#ff0000" size="52rpx"
|
|
|
+ @click="deleteGoods(ites.id)"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-checkbox-group>
|
|
|
+ <view style="height: 100rpx;"></view>
|
|
|
+ <view class="submitBar">
|
|
|
+ <view class="bar_view">
|
|
|
+ <view>
|
|
|
+ <u-checkbox-group v-model="radiovalue" placement="column" @change="radioGroupChange">
|
|
|
+ <u-checkbox label="全选" name="全选" activeColor="#FD4B09" shape="circle"></u-checkbox>
|
|
|
+ </u-checkbox-group>
|
|
|
+ </view>
|
|
|
+ <view v-if="!editDel">
|
|
|
+ <view>总计:￥<text>{{totalPrice}}</text></view>
|
|
|
+ <view style="font-size: 22rpx;color: #FD4B09;">运费:￥{{totalFreight}}</view>
|
|
|
+ </view>
|
|
|
+ <view style="width: 200rpx;">
|
|
|
+ <u-button shape="circle" size="small" text="提交订单" v-if="!editDel"
|
|
|
+ :disabled="this.selectedProduct.length == 0"
|
|
|
+ color="linear-gradient(0deg, #FD5003 0%, #FBA680 100%)" @click="submit"></u-button>
|
|
|
+ <u-button shape="circle" size="small" text="删除" v-else :disabled="this.selectedProduct.length == 0"
|
|
|
+ color="linear-gradient(0deg, #FD5003 0%, #FBA680 100%)" @click="deleteShopping"></u-button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <u-empty style="position: absolute;top: 45%;left: 50%;transform:translate(-50%,-50%)"
|
|
|
+ v-if="dataList.length == 0 && !isLoading" mode="car" text="待付款为空" icon="http://cdn.uviewui.com/uview/empty/car.png" />
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+ import {
|
|
|
+ obligationList,
|
|
|
+ generateOrder,
|
|
|
+ shoppingCartUpdate,
|
|
|
+ getCorpsAddr
|
|
|
+ } from '@/api/tabBar/shoppingCart.js'
|
|
|
+import { registerRuntimeCompiler } from "vue"
|
|
|
+import { logo } from '../../../common/setting'
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ editDel: false,
|
|
|
+ radiovalue: [],
|
|
|
+ companyValue: [],
|
|
|
+ dataList: [],
|
|
|
+ companyValueLength: 0,
|
|
|
+ selectedProduct: [],
|
|
|
+ totalPrice: 0.00,
|
|
|
+ totalFreight: 0.00,
|
|
|
+ addres: {},
|
|
|
+ isLoading: true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ companyValue() {
|
|
|
+ if (this.companyValue.length != 0 || this.companyValueLength != 0) {
|
|
|
+ if (this.companyValue.length == this.companyValueLength) {
|
|
|
+ this.radiovalue = ["全选"]
|
|
|
+ } else {
|
|
|
+ this.radiovalue = []
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.statistics()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ this.editDel = false
|
|
|
+ this.companyValue = []
|
|
|
+ this.isLoading = true
|
|
|
+ obligationList().then(res => {
|
|
|
+ console.log(res);
|
|
|
+ this.dataList = res.data
|
|
|
+ this.companyValueLength = this.dataList.length
|
|
|
+ this.isLoading = false // 添加这一行
|
|
|
+ })
|
|
|
+ getCorpsAddr().then(res => {
|
|
|
+ this.addres = res.data
|
|
|
+ })
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ deleteGoods(val) {
|
|
|
+ uni.showLoading({
|
|
|
+ title: '加载中',
|
|
|
+ mask: true
|
|
|
+ });
|
|
|
+ shoppingCartUpdate({
|
|
|
+ ids: val
|
|
|
+ }).then(res => {
|
|
|
+ uni.showToast({
|
|
|
+ title: "删除成功",
|
|
|
+ icon: 'none'
|
|
|
+ });
|
|
|
+ uni.showLoading({
|
|
|
+ title: '加载中',
|
|
|
+ mask: true
|
|
|
+ });
|
|
|
+ this.editDel = false
|
|
|
+ this.companyValue = []
|
|
|
+ obligationList().then(res => {
|
|
|
+ this.dataList = res.data
|
|
|
+ this.companyValueLength = this.dataList.length
|
|
|
+ uni.hideLoading();
|
|
|
+ }).catch(err => {
|
|
|
+ uni.hideLoading();
|
|
|
+ })
|
|
|
+ uni.hideLoading();
|
|
|
+ }).catch(err => {
|
|
|
+ uni.hideLoading();
|
|
|
+ })
|
|
|
+ },
|
|
|
+ deleteShopping() {
|
|
|
+ let data = []
|
|
|
+ for (let item of this.companyValue) {
|
|
|
+ for (let ite of this.dataList) {
|
|
|
+ if (item == ite.name) {
|
|
|
+ for (let it of ite.list) {
|
|
|
+ data.push(it.id)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ uni.showLoading({
|
|
|
+ title: '加载中',
|
|
|
+ mask: true
|
|
|
+ });
|
|
|
+ shoppingCartUpdate({
|
|
|
+ ids: data.join(',')
|
|
|
+ }).then(res => {
|
|
|
+ uni.showToast({
|
|
|
+ title: "删除成功",
|
|
|
+ icon: 'none'
|
|
|
+ });
|
|
|
+ uni.hideLoading();
|
|
|
+ uni.showLoading({
|
|
|
+ title: '加载中',
|
|
|
+ mask: true
|
|
|
+ });
|
|
|
+ this.editDel = false
|
|
|
+ this.companyValue = []
|
|
|
+ obligationList().then(res => {
|
|
|
+ this.dataList = res.data
|
|
|
+ this.companyValueLength = this.dataList.length
|
|
|
+ uni.hideLoading();
|
|
|
+ }).catch(err => {
|
|
|
+ uni.hideLoading();
|
|
|
+ })
|
|
|
+ }).catch(err => {
|
|
|
+ uni.hideLoading();
|
|
|
+ })
|
|
|
+ },
|
|
|
+ submit() {
|
|
|
+ if (this.companyValue.length > 0) {
|
|
|
+ let data = []
|
|
|
+ for (let item of this.companyValue) {
|
|
|
+ for (let ite of this.dataList) {
|
|
|
+ if (item == ite.name) {
|
|
|
+ data.push({
|
|
|
+ name: item,
|
|
|
+ list: ite.list
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ uni.showLoading({
|
|
|
+ title: '加载中',
|
|
|
+ mask: true
|
|
|
+ });
|
|
|
+ generateOrder({
|
|
|
+ address: this.addres.belongtoarea + this.addres.detailedAddress,
|
|
|
+ list: data,
|
|
|
+ }).then(res => {
|
|
|
+ console.log(res);
|
|
|
+ return
|
|
|
+ uni.showToast({
|
|
|
+ title: "提交成功",
|
|
|
+ icon: 'none'
|
|
|
+ });
|
|
|
+ uni.hideLoading();
|
|
|
+ uni.showLoading({
|
|
|
+ title: '加载中',
|
|
|
+ mask: true
|
|
|
+ });
|
|
|
+ this.editDel = false
|
|
|
+ this.companyValue = []
|
|
|
+ obligationList().then(res => {
|
|
|
+ this.dataList = res.data
|
|
|
+ this.companyValueLength = this.dataList.length
|
|
|
+ uni.hideLoading();
|
|
|
+ }).catch(err => {
|
|
|
+ uni.hideLoading();
|
|
|
+ })
|
|
|
+ }).catch(err => {
|
|
|
+ uni.hideLoading();
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ radioGroupChange(e) {
|
|
|
+ this.radiovalue = e
|
|
|
+ if (e.length == 0) {
|
|
|
+ this.companyValue = []
|
|
|
+ } else {
|
|
|
+ for (let li of this.dataList) {
|
|
|
+ if (!this.companyValue.includes(li.name)) {
|
|
|
+ this.companyValue.push(li.name)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.statistics()
|
|
|
+ },
|
|
|
+ statistics(val, index, ind) {
|
|
|
+ if (val) {
|
|
|
+ this.dataList[index].list[ind].goodsNum = val.value
|
|
|
+ }
|
|
|
+ let data = []
|
|
|
+ for (let item of this.companyValue) {
|
|
|
+ for (let ite of this.dataList) {
|
|
|
+ if (item == ite.name) {
|
|
|
+ for (let it of ite.list) {
|
|
|
+ data.push(it)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.totalPrice = 0
|
|
|
+ this.totalFreight = 0
|
|
|
+ for (let item of data) {
|
|
|
+ for(let orderItem of item.orderItemsList){
|
|
|
+ this.totalPrice += Number(orderItem.price) * Number(item.goodsNum)
|
|
|
+ console.log(this.totalPrice);
|
|
|
+ }
|
|
|
+ if (Number(item.goodsNum) == 1) {
|
|
|
+ this.totalFreight += 5
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.totalFreight = this.totalFreight.toFixed(2)
|
|
|
+ this.totalPrice = this.totalPrice.toFixed(2)
|
|
|
+ this.selectedProduct = data
|
|
|
+ },
|
|
|
+ companyChange(n) {
|
|
|
+ this.companyValue = n
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .collection {
|
|
|
+ background-color: #fff;
|
|
|
+ padding: 20rpx;
|
|
|
+ border-radius: 20rpx;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .goods {
|
|
|
+ width: 100%;
|
|
|
+ margin-left: 20rpx;
|
|
|
+ height: 200rpx;
|
|
|
+ display: grid;
|
|
|
+ align-content: space-between;
|
|
|
+
|
|
|
+ .price {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between !important;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ view:nth-child(1) {
|
|
|
+ color: #FD4B09;
|
|
|
+ font-size: 40rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .submitBar {
|
|
|
+ position: fixed;
|
|
|
+ bottom: 0;
|
|
|
+ background-color: #fff;
|
|
|
+ width: 100%;
|
|
|
+ z-index: 10;
|
|
|
+
|
|
|
+ .bar_view {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ padding: 10rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
web100