qniao
/
paper-shopkeeper-H5
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

购物车、地址管理

devlop
buffeyu 4 years ago
parent
9bb11ca936
commit
60867a6fe0
11 changed files with 605 additions and 279 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 30
      apis/addressManageApi.js
  2. 9
      apis/cartApi.js
  3. 7
      apis/forComparisonApi.js
  4. 114
      components/qn-input-number/qn-input-number.vue
  5. 90
      pages/add-address-manage/index.vue
  6. 48
      pages/address-manage/index.vue
  7. 258
      pages/cart/index.vue
  8. 314
      pages/for-comparison/index.vue
  9. 14
      pages/paper-details/index.vue
  10. BIN
      static/imgs/cart/shopping-cart-not-select.png
  11. BIN
      static/imgs/cart/shopping-cart-select.png

30
apis/addressManageApi.js
View File

@ -0,0 +1,30 @@
import http from '../utils/http/index.js'
/**
* 查询收货地址
* swagger: http://api-ops-uec-test.qniao.cn/uec/swagger-ui/index.html?urls.primaryName=CustomerApi#/%E4%BC%81%E4%B8%9A%E6%9F%A5%E8%AF%A2%E6%8E%A5%E5%8F%A3/getEnterpriseShippingAddressListByEnterpriseIdUsingGET
*/
export const getAddress = (data = {}) => {
return http.get({
url: '/uec/get/enterprise-shipping-address-list/by-enterpriseId',
data
})
}
/**
* 保存收货地址
* swagger: http://api-ops-uec-test.qniao.cn/uec/swagger-ui/index.html?urls.primaryName=CustomerApi#/%E4%BC%81%E4%B8%9A/saveEnterpriseShippingAddressByEnterpriseIdUsingPOST
*/
export const createAddress = (data = {}) => {
return http.post({
url: '/uec/save/enterprise-shipping-address/by/enterprise-id',
data
})
}
// 删除收货地址
export const delAddress = (data = {}) => {
return http.post({
url: '/uec​/delete​/enterprise-shipping-address',
data
})
}

9
apis/cartApi.js
View File

@ -20,4 +20,13 @@ export function removeShoppingCar(data) {
data data
} }
) )
}
// 购物车结算
export function closePaperReserve(data) {
return http.post(
{
url: '/base-paper-trading/shopping/trolley/buyer/paper/reserve',
data
}
)
} }

7
apis/forComparisonApi.js
View File

@ -6,4 +6,11 @@ export function createEnquiryOrder(data) {
url: '/base-paper-trading/add/enquiry-order', url: '/base-paper-trading/add/enquiry-order',
data data
}) })
}
// 查询纸种列表
export function getCategoryList(data) {
return http.get({
url: '/base-paper-trading/get/enquiry/category-and-brand-list/by-supplierId',
data
})
} }

114
components/qn-input-number/qn-input-number.vue
View File

@ -1,75 +1,79 @@
<template> <template>
<view class="warpper"> <view class="warpper">
<view class="minus-box" @tap="minusTap"> <view class="minus-box" @tap="minusTap">
－
<!-- <uni-icons size="16" custom-prefix="iconfont" type="Less" color="#007AFF"></uni-icons> -->
<uni-icons size="16" type="minus" color="#007AFF"></uni-icons>
</view> </view>
<view class="" style="padding: 0rpx 4rpx;"> <view class="" style="padding: 0rpx 4rpx;">
<uni-easyinput
:inputBorder="false"
class="quantity-input"
type="number"
:value="value"
placeholder="请输入"
@blur="blur"
@confirm="confirm"
></uni-easyinput>
</view>
<view class="minus-box" @tap="addTap">
<uni-icons size="16" type="plusempty" color="#007AFF"></uni-icons>
<uni-easyinput :inputBorder="false" class="quantity-input" type="number" :value="value" placeholder="请输入" @blur="blur" @confirm="confirm"></uni-easyinput>
</view> </view>
<view class="minus-box" @tap="addTap"><uni-icons size="16" type="plusempty" color="#007AFF"></uni-icons></view>
</view> </view>
</template> </template>
<script> <script>
export default {
data() {
return {
value: 0,
export default {
props: {
quantity: {
type: Number,
default: 0
}
},
data() {
return {
value: 0
}
},
watch: {
quantity: {
handler(nv, ov) {
this.value = nv
},
immediate: true,
}
},
methods: {
blur(e) {
this.$emit('change', e.detail.value)
},
confirm(value) {
if (value.trim()) {
this.$emit('change', value)
} }
}, },
methods: {
blur(e) {
this.$emit('change', e.detail.value)
},
confirm(value) {
if (value.trim()) {
this.$emit('change', value)
}
},
minusTap() {
if(this.value == 0){
return
}
this.value--
this.$emit('change', this.value)
},
addTap() {
this.value++
this.$emit('change', this.value)
minusTap() {
if (this.value == 0) {
return
} }
this.value--
this.$emit('change', this.value)
},
addTap() {
this.value++
this.$emit('change', this.value)
} }
} }
}
</script> </script>
<style lang="scss"> <style lang="scss">
.warpper{
display: flex;
flex-direction: row;
align-items: center;
.minus-box {
width: 64rpx;
height: 64rpx;
line-height: 64rpx;
text-align: center;
background: #F2F3F5;
border-radius: 8rpx;
color: #007AFF;
}
.quantity-input {
width: 120rpx;
height: 64rpx;
background: #F2F3F5;
}
.warpper {
display: flex;
flex-direction: row;
align-items: center;
.minus-box {
width: 64rpx;
height: 64rpx;
line-height: 64rpx;
text-align: center;
background: #f2f3f5;
border-radius: 8rpx;
color: #007aff;
}
.quantity-input {
width: 120rpx;
height: 64rpx;
background: #f2f3f5;
} }
}
</style> </style>

90
pages/add-address-manage/index.vue
View File

@ -3,17 +3,17 @@
<view class="qn-form-item"> <view class="qn-form-item">
<view class="label"><text class="label__text">收货人</text></view> <view class="label"><text class="label__text">收货人</text></view>
<view class="value"> <view class="value">
<qn-easyinput :maxlength="20" @blur="showCompany" v-model="form.name" :inputBorder="false" text="left" placeholder="请填写收货人姓名"></qn-easyinput>
<qn-easyinput :maxlength="20" @blur="showCompany" v-model="form.receiver" :inputBorder="false" text="left" placeholder="请填写收货人姓名"></qn-easyinput>
</view> </view>
</view> </view>
<view class="qn-form-item"> <view class="qn-form-item">
<view class="label"><text class="label__text">手机号</text></view> <view class="label"><text class="label__text">手机号</text></view>
<view class="value"> <view class="value">
<qn-easyinput :maxlength="11" type="number" v-model="form.contactMobile" :inputBorder="false" text="left" placeholder="请填写收货人手机号"></qn-easyinput>
<qn-easyinput :maxlength="11" type="number" v-model="form.receiverMobile" :inputBorder="false" text="left" placeholder="请填写收货人手机号"></qn-easyinput>
</view> </view>
</view> </view>
<view class="qn-form-item"> <view class="qn-form-item">
<view class="label"><text class="label__text">所在地区</text></view>
<view class="label"><text class="label__text">所在地区</text></view>
<view class="value"> <view class="value">
<!-- <qn-easyinput v-model="form.shortName" :inputBorder="false" text="right" placeholder="选择所在区域"></qn-easyinput> --> <!-- <qn-easyinput v-model="form.shortName" :inputBorder="false" text="right" placeholder="选择所在区域"></qn-easyinput> -->
<qn-data-picker <qn-data-picker
@ -28,14 +28,14 @@
:clear-icon="true" :clear-icon="true"
:localdata="items" :localdata="items"
> >
<text v-if="form.locDistrictId">{{ `${form.locProvinceName || ''}/${form.locCityName || ''}/${form.locDistrictName || ''}/${form.locStreetName || ''}` }}</text>
<text v-if="form.districtId">{{ `${form.provinceName || ''}/${form.cityName || ''}/${form.districtName || ''}/${form.streetName || ''}` }}</text>
</qn-data-picker> </qn-data-picker>
</view> </view>
</view> </view>
<view class="qn-form-item"> <view class="qn-form-item">
<view class="label"><text class="label__text">详细地址</text></view> <view class="label"><text class="label__text">详细地址</text></view>
<view class="value"> <view class="value">
<qn-easyinput :maxlength="120" @blur="showCompany" v-model="form.name" :inputBorder="false" text="left" placeholder="街道/门牌号/小区/乡镇/村等"></qn-easyinput>
<qn-easyinput :maxlength="120" @blur="showCompany" v-model="form.detail" :inputBorder="false" text="left" placeholder="街道/门牌号/小区/乡镇/村等"></qn-easyinput>
</view> </view>
</view> </view>
<uGap></uGap> <uGap></uGap>
@ -44,9 +44,7 @@
<view class="title">设置为默认地址</view> <view class="title">设置为默认地址</view>
<view class="tip">提醒：每次下单会默认使用该地址</view> <view class="tip">提醒：每次下单会默认使用该地址</view>
</view> </view>
<view class="">
<switch checked style="transform:scale(0.8)"/>
</view>
<view class=""><switch :checked="form.isDefault == 1" @change="switchChange" style="transform:scale(0.8)" /></view>
</view> </view>
<qn-footer fixed height="120rpx"> <qn-footer fixed height="120rpx">
<view class="button-area"> <view class="button-area">
@ -62,21 +60,29 @@
<script> <script>
import uGap from '@/components/u-gap/u-gap.vue' import uGap from '@/components/u-gap/u-gap.vue'
import { getArea } from '@/apis/commonApi.js' import { getArea } from '@/apis/commonApi.js'
import { back } from '@/utils/hook.js'
import qnFooter from '@/components/qn-footer/qn-footer.vue' import qnFooter from '@/components/qn-footer/qn-footer.vue'
import qnDataPicker from '@/components/qn-data-picker/qn-data-picker.vue' import qnDataPicker from '@/components/qn-data-picker/qn-data-picker.vue'
import { createAddress } from '@/apis/addressManageApi.js'
export default { export default {
components: { uGap, qnFooter, qnDataPicker }, components: { uGap, qnFooter, qnDataPicker },
data() { data() {
return { return {
form: { form: {
name: null,
contactMobile: null,
locProvinceId: null,
locCityId: null,
locDistrictId: null,
locProvinceName: null,
locCityName: null,
locDistrictName: null
cityId: '',
cityName: '',
detail: '',
districtId:'',
districtName: '',
enterpriseId: this.$store.state.companyInfo.id,
id: '',
isDefault: '0',
provinceId: '',
provinceName: '',
receiver: '',
receiverMobile: '',
streetId: '',
streetName: '',
}, },
hasSelected: false, hasSelected: false,
items: [] items: []
@ -94,28 +100,44 @@ export default {
onAreaChange(e) { onAreaChange(e) {
if (e.detail.value && e.detail.value.length > 0) { if (e.detail.value && e.detail.value.length > 0) {
const [province, city, district, street] = e.detail.value const [province, city, district, street] = e.detail.value
this.form.locProvinceId = province.value
this.form.locProvinceName = province.text
this.form.locCityId = city.value
this.form.locCityName = city.text
this.form.locDistrictId = district.value
this.form.locDistrictName = district.text
this.form.locStreetId = street.value
this.form.locStreetName = street.text
this.form.provinceId = province.value
this.form.provinceName = province.text
this.form.cityId = city.value
this.form.cityName = city.text
this.form.districtId = district.value
this.form.districtName = district.text
this.form.streetId = street.value
this.form.streetName = street.text
} else { } else {
this.form.locProvinceId = null
this.form.locProvinceName = null
this.form.locCityId = null
this.form.locCityName = null
this.form.locDistrictId = null
this.form.locDistrictName = null
this.form.locStreetId = null
this.form.locStreetName = null
this.form.provinceId = null
this.form.provinceName = null
this.form.cityId = null
this.form.cityName = null
this.form.districtId = null
this.form.districtName = null
this.form.streetId = null
this.form.streetName = null
} }
}, },
// 设置默认地址
switchChange(e) {
this.form.isDefault = e.target.value ? '1' : '0'
},
showCompany() {}, showCompany() {},
// 保存 // 保存
addTap() {}
addTap() {
createAddress(this.form).then(res => {
if (res) {
uni.showToast({
title: '添加成功',
icon: 'success'
})
setTimeout(() => {
back()
}, 1000)
}
})
}
} }
} }
</script> </script>
@ -133,7 +155,7 @@ export default {
border-bottom: 2rpx solid #d8d8d8; border-bottom: 2rpx solid #d8d8d8;
min-height: 88rpx; min-height: 88rpx;
.label { .label {
flex-grow: 0;
flex-grow: 0;
flex-shrink: 0; flex-shrink: 0;
display: flex; display: flex;
flex-direction: row; flex-direction: row;

48
pages/address-manage/index.vue
View File

@ -1,21 +1,21 @@
<template> <template>
<view class="warpper"> <view class="warpper">
<uni-nav-bar left-icon="back" @clickLeft="back" statusBar fixed title="收货地址"></uni-nav-bar> <uni-nav-bar left-icon="back" @clickLeft="back" statusBar fixed title="收货地址"></uni-nav-bar>
<view class="content" v-for="(item, index) in 3" :key="index">
<view class="content" v-for="(item, index) in list" :key="index">
<view class="info-box"> <view class="info-box">
<view class="name">徐晓朋 18826104989</view>
<view class="address">广东省广州市天河区车陂大岗路联合社区西区8栋8408广氮新村55栋701</view>
<view class="name">{{item.receiver}} {{item.receiverMobile}}</view>
<view class="address">{{item.provinceName}}{{item.cityName}}{{item.districtName}}{{item.streetName}}{{item.detail}}</view>
</view> </view>
<view class="other"> <view class="other">
<view class="left"> <view class="left">
<label> <label>
<radio value="r1" :checked="false" style="transform:scale(0.8)" />
<radio :value="item.isDefault == 0" :checked="item.isDefault == 0" style="transform:scale(0.8)" />
设置为默认 设置为默认
</label> </label>
</view> </view>
<view class="right"> <view class="right">
<view class="" @tap="delTap(item, index)">删除</view> <view class="" @tap="delTap(item, index)">删除</view>
<view class="edit">编辑</view>
<view class="edit" @tap="editTap(item, index)">编辑</view>
</view> </view>
</view> </view>
</view> </view>
@ -51,6 +51,7 @@
<script> <script>
import { go2, back, setCache } from '@/utils/hook.js' import { go2, back, setCache } from '@/utils/hook.js'
import qnFooter from '@/components/qn-footer/qn-footer.vue' import qnFooter from '@/components/qn-footer/qn-footer.vue'
import { getAddress, delAddress } from '@/apis/addressManageApi.js'
export default { export default {
components:{ qnFooter }, components:{ qnFooter },
data() { data() {
@ -58,12 +59,30 @@ export default {
/** /**
* 页面操作类型 none: 无操作, select: 选择 * 页面操作类型 none: 无操作, select: 选择
*/ */
operation: 'none'
operation: 'none',
list: [],
id: null
} }
}, },
onShow() {
this.queryData()
},
onLoad() {},
methods: { methods: {
go2, go2,
back, back,
// 查询收货地址
queryData() {
const params = {
enterpriseId: this.$store.state.companyInfo.id
}
getAddress(params).then(res => {
if(res) {
console.log('收货地址', res)
this.list = res
}
})
},
// 选择地址 // 选择地址
selectAddress(item) { selectAddress(item) {
if (this.operation === 'select') { if (this.operation === 'select') {
@ -77,11 +96,26 @@ export default {
}, },
// 删除 // 删除
delTap(item, index) { delTap(item, index) {
this.id = item.id
this.$refs.popup.open('center') this.$refs.popup.open('center')
// this.$refs.popup.close() // this.$refs.popup.close()
}, },
// 编辑
editTap(item, index) {
go2('add-address-manage')
},
confirmTap() { confirmTap() {
this.$refs.popup.close()
delAddress({id: this.id}).then(res => {
this.$refs.popup.close()
if(res) {
uni.showToast({
title: '删除成功',
icon: 'success'
})
this.queryData()
}
})
}, },
cancelTap() { cancelTap() {
this.$refs.popup.close() this.$refs.popup.close()

258
pages/cart/index.vue
View File

@ -1,75 +1,81 @@
<template> <template>
<view class="warpper"> <view class="warpper">
<uni-nav-bar :fixed="true" color="#ffffff" background-color="#ffffff" :status-bar="true">
<uni-nav-bar :fixed="true" color="#ffffff" background-color="#ffffff" :status-bar="true">
<view slot="left" class="left-title">购物车</view> <view slot="left" class="left-title">购物车</view>
<view slot="right" v-if="pageShow" class="right-title" @tap="delTap">删除</view>
<view slot="right" v-if="pageShow" class="right-title" @tap="delTap">删除</view>
</uni-nav-bar> </uni-nav-bar>
<view class="" v-if="pageShow"> <view class="" v-if="pageShow">
<scroll-list ref="list" :option="option" @load="upCallback" @refresh="downCallback" style="background-color: #FFFFFF;">
<view class="group-box" v-for="(item, index) in list" :key="index">
<uGap></uGap>
<view class="group-checkbox">
<view class="checkbox">
<checkbox-group @change="onCheck"><checkbox value="cb" :checked="checked" color="#000000" style="transform: scale(0.7)" /></checkbox-group>
</view>
<view class="">{{item.supplierName}}</view>
</view>
<view class="list-box" v-for="(subItem, subIndex) in item.carItemList" :key="subIndex">
<view class="checkbox">
<checkbox-group @change="onCheck"><checkbox value="cb" :checked="checked" color="#000000" style="transform: scale(0.7)" /></checkbox-group>
<scroll-list ref="list" :option="option" @load="upCallback" @refresh="downCallback" style="background-color: #FFFFFF;">
<view class="group-box" v-for="(item, index) in list" :key="index">
<uGap></uGap>
<view class="group-checkbox">
<view class="checkbox" @tap="checkboxGroupTap(item, index)">
<image
class="select-img"
:src="item.checkedGroup ? '/static/imgs/cart/shopping-cart-select.png' : '/static/imgs/cart/shopping-cart-not-select.png'"
mode=""
></image>
<!-- <checkbox-group @change="onCheck"><checkbox value="cb" :checked="checked" color="#000000" style="transform: scale(0.7)" /></checkbox-group> -->
</view>
<view class="">{{ item.supplierName }}</view>
</view> </view>
<view class="list-row">
<image class="image" src="https://qncloud.oss-cn-shenzhen.aliyuncs.com/ztb_pic/testPic.jfif" mode=""></image>
<view class="right">
<view class="name">{{subItem.productName}}</view>
<view class="measure">{{subItem.gramWeight}}g｜{{subItem.width}}*{{subItem.length}}</view>
<view class="weight">预估重量：{{subItem.weight}}吨</view>
<view class="price-row">
<view class="value">¥{{subItem.price}}</view>
<view class=""><qnInputNumber @change="change" /></view>
<view class="list-box" v-for="(subItem, subIndex) in item.carItemList" :key="subIndex">
<view class="checkbox" @tap="checkboxTap(item, subItem)">
<image
class="select-img"
:src="subItem.checked ? '/static/imgs/cart/shopping-cart-select.png' : '/static/imgs/cart/shopping-cart-not-select.png'"
mode=""
></image>
<!-- <checkbox-group @change="onCheck"><checkbox value="cb" :checked="checked" color="#000000" style="transform: scale(0.7)" /></checkbox-group> -->
</view>
<view class="list-row">
<image class="image" src="https://qncloud.oss-cn-shenzhen.aliyuncs.com/ztb_pic/testPic.jfif" mode=""></image>
<view class="right">
<view class="name">{{ subItem.productName }}</view>
<view class="measure">{{ subItem.gramWeight }}g｜{{ subItem.width }}*{{ subItem.length }}</view>
<view class="weight">预估重量：{{ subItem.weight }}吨</view>
<view class="price-row">
<view class="value">¥{{ subItem.price }}</view>
<view class=""><qnInputNumber :quantity="subItem.quantity" @change="change($event,item, subItem)" /></view>
</view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</view>
</scroll-list>
<view class="footer-box">
<view class="row">
<view class="left">
<view class="">
<checkbox-group @change="onCheck"><checkbox value="cb" :checked="checked" color="#000000" style="transform: scale(0.7)"></checkbox></checkbox-group>
</scroll-list>
<view class="footer-box">
<view class="row">
<view class="left" @tap="selectAll">
<view class="">
<image
class="select-img"
:src="allSelected ? '/static/imgs/cart/shopping-cart-select.png' : '/static/imgs/cart/shopping-cart-not-select.png'"
mode=""
></image>
</view>
<view class=""><text class="check-text">全选</text></view>
</view> </view>
<view class=""><text class="check-text">全选</text></view>
</view>
<view class="right">
<view class="">
<text class="name">应付：</text>
<text class="value">¥7200.00</text>
<view class="right">
<view class="">
<text class="name">应付：</text>
<text class="value">¥{{totalPrice}}</text>
</view>
<view class="right-balance-btn" >结算</view>
</view> </view>
<view class="right-balance-btn">结算</view>
</view> </view>
</view> </view>
</view>
</view> </view>
<uni-popup ref="popup" type="center" :mask-click="false"> <uni-popup ref="popup" type="center" :mask-click="false">
<view class="popup-box"> <view class="popup-box">
<view class="tip-title">
确定将当前纸品删除吗？
</view>
<view class="tip-title">{{ allSelected ? '确定将购物车纸品删除吗？' : '确定将当前纸品删除吗？' }}</view>
<view class="operation-row"> <view class="operation-row">
<view class="cancel-text" @tap="cancelTap">
取消
</view>
<view class="line">
</view>
<view class="confirm-text" @tap="confirmTap">
确定
</view>
<view class="cancel-text" @tap="cancelTap">取消</view>
<view class="line"></view>
<view class="confirm-text" @tap="confirmTap">确定</view>
</view> </view>
</view> </view>
</uni-popup>
<no-data v-if="!pageShow"></no-data>
</uni-popup>
<no-data v-if="!pageShow"></no-data>
</view> </view>
</template> </template>
@ -78,7 +84,7 @@ import uGap from '@/components/u-gap/u-gap.vue'
import qnFooter from '@/components/qn-footer/qn-footer.vue' import qnFooter from '@/components/qn-footer/qn-footer.vue'
import { back, go2 } from '@/utils/hook.js' import { back, go2 } from '@/utils/hook.js'
import qnInputNumber from '@/components/qn-input-number/qn-input-number.vue' import qnInputNumber from '@/components/qn-input-number/qn-input-number.vue'
import { getShoppingCarList, removeShoppingCar } from '@/apis/cartApi.js'
import { getShoppingCarList, removeShoppingCar, closePaperReserve } from '@/apis/cartApi.js'
import noData from './no-data.vue' import noData from './no-data.vue'
export default { export default {
components: { uGap, qnInputNumber, qnFooter, noData }, components: { uGap, qnInputNumber, qnFooter, noData },
@ -94,8 +100,7 @@ export default {
disabled: false disabled: false
}, },
params: { params: {
userId : this.$store.state.userInfo.userId || null,
userId: this.$store.state.userInfo.userId || null
}, },
pagination: { pagination: {
pageNum: 0, // 初始会执行一次下拉加载 pageNum: 0, // 初始会执行一次下拉加载
@ -103,6 +108,7 @@ export default {
}, },
checked: false, checked: false,
list: [], list: [],
idList: []
} }
}, },
created() { created() {
@ -114,7 +120,45 @@ export default {
} }
}) })
}, },
onShow() {
this.getList()
},
onLoad() {}, onLoad() {},
computed: {
allSelected: {
get() {
if (this.list && this.list.length) {
return this.list.every(shop => {
return shop.checkedGroup
})
}
return false
},
set(val) {
if (this.list && this.list.length) {
this.list.forEach(shop => {
shop.checkedGroup = val
shop.carItemList.forEach(good => {
good.checked = val
})
})
}
}
},
totalPrice() {
let num = 0
if (this.list && this.list.length) {
this.list.forEach(shop => {
shop.carItemList.forEach(good => {
if(good.checked) {
num += Number(good.price) * Number(good.quantity)
}
})
})
}
return num
}
},
methods: { methods: {
getList() { getList() {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
@ -122,10 +166,16 @@ export default {
.then(res => { .then(res => {
// console.log('购物车', res) // console.log('购物车', res)
if (res) { if (res) {
if(res.records.length == 0) {
if (res.records.length == 0) {
this.pageShow = false this.pageShow = false
return return
} }
res.records.forEach(el => {
el.checkedGroup = false
el.carItemList.forEach(item => {
item.checked = false
})
})
if (this.pagination.pageNum == 1) { if (this.pagination.pageNum == 1) {
this.list = res.records this.list = res.records
} else { } else {
@ -161,11 +211,74 @@ export default {
this.$refs.list.loadFail() this.$refs.list.loadFail()
}) })
}, },
// 分组全选
checkboxGroupTap(item, index) {
item.checkedGroup = !item.checkedGroup
item.carItemList.forEach(el => {
el.checked = item.checkedGroup
})
},
/**
* @param {Object} shop
* @param {Object} good 子项
*/
checkboxTap(shop, good) {
good.checked = !good.checked
// 所在店铺根据商品是否全部选中
shop.checkedGroup = this.isShopSelectedAll(shop.carItemList)
},
// 店铺中的商品是否全选
isShopSelectedAll(products) {
let tempArr = true
for (var j = 0; j < products.length; j++) {
if (!products[j].checked) {
tempArr = false
break
}
}
return tempArr
},
// 全选
selectAll() {
this.allSelected = !this.allSelected
},
delTap() { delTap() {
// idList
this.idList = []
this.list.forEach(el => {
el.carItemList.forEach(good => {
if (good.checked) {
this.idList.push(good.id)
}
})
})
console.log('this.idList', this.idList)
if (this.idList.length === 0) {
uni.showToast({
title: '暂未选择商品',
icon: 'none'
})
return
}
this.$refs.popup.open('center') this.$refs.popup.open('center')
}, },
confirmTap() { confirmTap() {
this.$refs.popup.close()
const params = {
idList: this.idList,
userId: this.$store.state.userInfo.userId
}
removeShoppingCar(params).then(res => {
this.$refs.popup.close()
if(res) {
uni.showToast({
title: '删除成功！',
icon: 'success'
})
this.pagination.pageNum = 1
this.getList()
}
})
}, },
cancelTap() { cancelTap() {
this.$refs.popup.close() this.$refs.popup.close()
@ -174,7 +287,9 @@ export default {
* @param {Number} num * @param {Number} num
* 计数器返回值 * 计数器返回值
*/ */
change(num) {}
change(num, shop, good) {
good.quantity = num
}
} }
} }
</script> </script>
@ -205,6 +320,10 @@ export default {
padding: 0rpx 32rpx; padding: 0rpx 32rpx;
} }
} }
.select-img {
width: 32rpx;
height: 32rpx;
}
.checkbox { .checkbox {
flex: 0 0 35rpx; flex: 0 0 35rpx;
margin-right: 20rpx; margin-right: 20rpx;
@ -272,14 +391,14 @@ export default {
} }
} }
.footer-box { .footer-box {
left: 0;
right: 0;
.check-text { .check-text {
font-size: 24rpx; font-size: 24rpx;
color: #333333; color: #333333;
letter-spacing: 0; letter-spacing: 0;
text-align: center; text-align: center;
font-weight: 400; font-weight: 400;
padding-left: 12rpx;
vertical-align: middle;
} }
.row { .row {
display: flex; display: flex;
@ -292,10 +411,12 @@ export default {
flex: 0 0 200rpx; flex: 0 0 200rpx;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center;
// align-items: center;
} }
.right { .right {
flex: 1;
// flex: 1;
flex-shrink: 1;
flex-grow: 1;
// width: 100%; // width: 100%;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@ -308,6 +429,7 @@ export default {
font-weight: 400; font-weight: 400;
} }
.value { .value {
vertical-align: middle;
font-size: 36rpx; font-size: 36rpx;
color: #f5222d; color: #f5222d;
letter-spacing: 0; letter-spacing: 0;
@ -332,7 +454,7 @@ export default {
.popup-box { .popup-box {
width: 540rpx; width: 540rpx;
height: 226rpx; height: 226rpx;
background: #FFFFFF;
background: #ffffff;
border-radius: 14rpx; border-radius: 14rpx;
.tip-title { .tip-title {
display: flex; display: flex;
@ -352,8 +474,8 @@ export default {
justify-content: space-around; justify-content: space-around;
align-items: center; align-items: center;
height: 100rpx; height: 100rpx;
background: #FFFFFF;
border-top: 2rpx solid #DDDDDD;
background: #ffffff;
border-top: 2rpx solid #dddddd;
.cancel-text { .cancel-text {
flex-grow: 1; flex-grow: 1;
flex-shrink: 1; flex-shrink: 1;
@ -368,13 +490,13 @@ export default {
flex-shrink: 0; flex-shrink: 0;
width: 2rpx; width: 2rpx;
height: 100rpx; height: 100rpx;
border-left: 2rpx solid #DCDEE3;
border-left: 2rpx solid #dcdee3;
} }
.confirm-text{
.confirm-text {
flex-grow: 1; flex-grow: 1;
flex-shrink: 1; flex-shrink: 1;
font-size: 36rpx; font-size: 36rpx;
color: #108EE9;
color: #108ee9;
letter-spacing: 0; letter-spacing: 0;
text-align: center; text-align: center;
font-weight: 400; font-weight: 400;

314
pages/for-comparison/index.vue
View File

@ -8,9 +8,9 @@
<text class="label__text">纸种</text> <text class="label__text">纸种</text>
</view> </view>
<view class="value"> <view class="value">
<picker :value="paperIndex" :range="paperGradesList">
<picker :value="form.categoryIndex" @change="categoryChange" :range="categoryNameList">
<view> <view>
<text class="uni-input">{{ paperGradesList[paperIndex] }}</text>
<text class="uni-input">{{ form.categoryName }}</text>
<uni-icons type="right" color="#000000" size="16"></uni-icons> <uni-icons type="right" color="#000000" size="16"></uni-icons>
</view> </view>
</picker> </picker>
@ -18,13 +18,13 @@
</view> </view>
<view class="qn-form-item qn-form-item"> <view class="qn-form-item qn-form-item">
<view class="label"> <view class="label">
<uni-icons custom-prefix="iconfont" type="icon-required" size="14" color="#F5222D"></uni-icons>
<uni-icons custom-prefix="iconfont" type="icon-required" size="14" color="#F5222D"></uni-icons>
<text class="label__text">品牌</text> <text class="label__text">品牌</text>
</view> </view>
<view class="value"> <view class="value">
<picker :value="paperIndex" :range="brandList">
<picker :value="form.brandIndex" @change="brandChange" :range="brandNameList" >
<view> <view>
<text class="uni-input">{{ brandList[paperIndex] }}</text>
<text class="uni-input">{{ form.brandName }}</text>
<uni-icons type="right" color="#000000" size="16"></uni-icons> <uni-icons type="right" color="#000000" size="16"></uni-icons>
</view> </view>
</picker> </picker>
@ -35,7 +35,7 @@
<uni-icons custom-prefix="iconfont" type="icon-required" size="14" color="#F5222D"></uni-icons> <uni-icons custom-prefix="iconfont" type="icon-required" size="14" color="#F5222D"></uni-icons>
<text class="label__text">纸品名称</text> <text class="label__text">纸品名称</text>
</view> </view>
<view class="value"><qn-easyinput :maxlength="20" v-model="form.shortName" :inputBorder="false" text="right" placeholder="请输入纸品名称"></qn-easyinput></view>
<view class="value"><qn-easyinput :maxlength="20" v-model="form.paperName" :inputBorder="false" text="right" placeholder="请输入纸品名称"></qn-easyinput></view>
</view> </view>
<view class="qn-form-item qn-form-item"> <view class="qn-form-item qn-form-item">
<view class="label"> <view class="label">
@ -43,9 +43,9 @@
<text class="label__text">克重(g)</text> <text class="label__text">克重(g)</text>
</view> </view>
<view class="value"> <view class="value">
<picker :value="paperIndex" :range="gramWeightList">
<picker :value="form.gramWeightIndex" @change="gramWeightChange" :range="weightList">
<view> <view>
<text class="uni-input">{{ gramWeightList[paperIndex] }}</text>
<text class="uni-input">{{ form.gramWeight }}</text>
<uni-icons type="right" color="#000000" size="16"></uni-icons> <uni-icons type="right" color="#000000" size="16"></uni-icons>
</view> </view>
</picker> </picker>
@ -60,16 +60,16 @@
<view class="value"> <view class="value">
<!-- <qn-easyinput :maxlength="20" v-model="form.shortName" :inputBorder="false" text="right" placeholder="请输入数量"></qn-easyinput> --> <!-- <qn-easyinput :maxlength="20" v-model="form.shortName" :inputBorder="false" text="right" placeholder="请输入数量"></qn-easyinput> -->
<radio-group> <radio-group>
<label v-for="(item, index) in radioGroupList" :key="index">
<radio :value="item" :checked="index === 0" style="transform:scale(0.7)" />
<text class="uni-input">{{ item }}</text>
<label v-for="(ritem, rindex) in radioGroupList" :key="rindex" @tap="specificationTap(ritem, rindex)">
<radio :checked="rindex === 0" style="transform:scale(0.7)" />
<text class="uni-input">{{ ritem.name }}</text>
</label> </label>
</radio-group> </radio-group>
</view> </view>
<view class="input-row"> <view class="input-row">
<view class=""><uni-easyinput :inputBorder="false" class="easyinput" type="number" v-model="form.shortName" placeholder="请输入"></uni-easyinput></view>
<view class=""><uni-easyinput :inputBorder="false" class="easyinput" type="number" v-model="form.width" placeholder="请输入"></uni-easyinput></view>
<view class="symbol">x</view> <view class="symbol">x</view>
<view class=""><uni-easyinput :inputBorder="false" class="easyinput" type="number" v-model="form.shortName" placeholder="请输入"></uni-easyinput></view>
<view class=""><uni-easyinput :inputBorder="false" class="easyinput" type="number" v-model="form.length" placeholder="请输入"></uni-easyinput></view>
</view> </view>
</view> </view>
</view> </view>
@ -79,15 +79,15 @@
<text class="label__text">数量(张)</text> <text class="label__text">数量(张)</text>
</view> </view>
<view class="value"> <view class="value">
<view class="value"><qn-easyinput :maxlength="20" v-model="form.shortName" :inputBorder="false" text="right" placeholder="请输入数量"></qn-easyinput></view>
<view class="value"><qn-easyinput :maxlength="20" v-model="form.quantity" :inputBorder="false" text="right" placeholder="请输入数量"></qn-easyinput></view>
</view> </view>
</view> </view>
<view class="qn-form-item qn-form-item"> <view class="qn-form-item qn-form-item">
<view class="label"><text class="label__text">交货时间</text></view> <view class="label"><text class="label__text">交货时间</text></view>
<view class="value"> <view class="value">
<picker :value="paperIndex" :range="deliveryTimeList">
<picker :value="paperIndex" :range="deliveryTimeList" @change="deliveryTimeChange">
<view> <view>
<text class="uni-input">{{ deliveryTimeList[paperIndex] }}</text>
<text class="uni-input">{{ form.deliveryDay }}</text>
<uni-icons type="right" color="#000000" size="16"></uni-icons> <uni-icons type="right" color="#000000" size="16"></uni-icons>
</view> </view>
</picker> </picker>
@ -113,7 +113,7 @@
:localdata="items" :localdata="items"
> >
<text v-if="form.locDistrictId"> <text v-if="form.locDistrictId">
{{ `${form.locProvinceName || ''}/${form.locCityName || ''}/${form.locDistrictName || ''}/${form.locStreetName || ''}` }}
{{ `${form.deliveryProvinceName || ''}/${form.deliveryCityName || ''}/${form.deliveryDistrictName || ''}/${form.deliveryStreetName || ''}` }}
</text> </text>
</qn-data-picker> </qn-data-picker>
</view> </view>
@ -126,7 +126,7 @@
class="paper-price-textArea" class="paper-price-textArea"
:maxlength="200" :maxlength="200"
:styles="{ disableColor: '#F7F8FA' }" :styles="{ disableColor: '#F7F8FA' }"
v-model="form.shortName"
v-model="form.remark"
:inputBorder="false" :inputBorder="false"
type="textarea" type="textarea"
placeholder="请输入拜访对象" placeholder="请输入拜访对象"
@ -152,62 +152,66 @@ import qnDataPicker from '@/components/qn-data-picker/qn-data-picker.vue'
import qnDatetimePicker from '@/components/qn-datetime-picker/qn-datetime-picker.vue' import qnDatetimePicker from '@/components/qn-datetime-picker/qn-datetime-picker.vue'
import qnFooter from '@/components/qn-footer/qn-footer.vue' import qnFooter from '@/components/qn-footer/qn-footer.vue'
import uGap from '@/components/u-gap/u-gap.vue' import uGap from '@/components/u-gap/u-gap.vue'
import { createEnquiryOrder } from '@/apis/forComparisonApi.js'
const validateFields = [
'name',
'uniformSocialCreditCode',
'legalPersonName',
'locProvinceId',
'locCityId',
'locDistrictId',
'locStreetId',
'locProvinceName',
'locCityName',
'locDistrictName',
'locStreetName',
'locDetail',
'legalPersonIdCardNo',
'legalPersonIdCardFrontImg',
'legalPersonIdCardBackImg',
'businessLicenseImg',
'registeredCapital',
'foundDate'
]
import { createEnquiryOrder, getCategoryList } from '@/apis/forComparisonApi.js'
const validateFields = ['categoryName', 'brandName', 'paperName', 'gramWeight', 'width', 'length', 'quantity']
export default { export default {
components: { qnEasyinput, qnDataPicker, qnDatetimePicker, qnFooter, uGap }, components: { qnEasyinput, qnDataPicker, qnDatetimePicker, qnFooter, uGap },
data() { data() {
return { return {
paperIndex: 0, paperIndex: 0,
paperGradesList: ['白卡板', '黑板纸', '灰板纸'],
brandList: ['朱雀', '金蝶兰', '骄阳', '太阳', '丽品'],
gramWeightList: ['300', '345', '350'],
categoryNameList: [],
brandNameList: [],
weightList: [],
deliveryTimeList: ['当天到', '明天到'], deliveryTimeList: ['当天到', '明天到'],
radioGroupList: ['正度', '大度', '特规'],
radioGroupList: [
{
name: '正度',
width: '787',
length: '1092',
disabled: true
},
{
name: '特规分切',
width: '889',
length: '1194',
disabled: true
},
{
name: '特规分切',
width: '',
length: '',
disabled: false
}
],
form: { form: {
id: null,
name: null,
shortName: null,
contactName: null,
contactMobile: null,
contactTitle: null,
uniformSocialCreditCode: null,
locProvinceId: null,
locCityId: null,
locDistrictId: null,
locStreetId: null,
locProvinceName: null,
locCityName: null,
locDistrictName: null,
locStreetName: null,
locDetail: null,
legalPersonName: null,
legalPersonMobile: null,
legalPersonIdCardNo: null,
legalPersonIdCardFrontImg: null,
legalPersonIdCardBackImg: null,
businessLicenseImg: null,
registeredCapital: null,
foundDate: null
deliveryArea: '',
deliveryCityId: '',
deliveryCityName: '',
deliveryDay: '',
deliveryDayIndex: 0,
deliveryDistrictId: '',
deliveryDistrictName: '',
deliveryId: '',
deliveryProvinceId: '',
deliveryProvinceName: '',
deliveryStreetId: '',
deliveryStreetName: '',
detailList: [],
offerEnterprise: '',
remark: '',
brandId: '',
brandName: '',
brandIndex: 0,
categoryId: '',
categoryName: '',
categoryIndex: 0,
gramWeight: '',
gramWeightIndex: 0,
length: '1092',
paperName: '',
quantity: '',
remark: '',
width: '787'
}, },
searchList: [], searchList: [],
hasSelected: false, hasSelected: false,
@ -221,29 +225,85 @@ export default {
} }
}) })
}, },
onLoad(option) {
this.form.offerEnterprise = option.id
this.getCategoryList()
},
methods: { methods: {
back, back,
// 查询纸种列表
getCategoryList() {
const params = {
paperSupplierId: this.$store.state.supplierId
}
getCategoryList(params).then(res => {
console.log('纸种列表', res)
if (res) {
this.categoryNameList = res.categoryNameList
this.brandNameList = res.brandNameList
this.weightList = res.weightList
this.form.categoryName = this.categoryNameList[0]
this.form.brandName = this.brandNameList[0]
this.form.gramWeight = this.weightList[0]
}
})
},
// 选择纸种
categoryChange(e) {
// console.log('e.target.value', e.target.value)
let index = e.target.value
this.form.categoryIndex = e.target.value
this.form.categoryName = this.categoryNameList[index]
},
// 选择品牌
brandChange(e) {
let index = e.target.value
this.form.brandIndex = e.target.value
this.form.brandName = this.brandNameList[index]
},
// 克重
gramWeightChange(e) {
let index = e.target.value
this.form.gramWeightIndex = e.target.value
this.form.gramWeight = this.weightList[index]
},
// 规格切换
specificationTap(item, index) {
this.form.width = item.width
this.form.length = item.length
},
// 交货时间
deliveryTimeChange(e) {
this.form.deliveryDayIndex = e.target.value
// 0 当天 1明天
if (this.form.deliveryDayIndex == 0) {
this.form.deliveryDay = this.getDay(0, 3600000)
} else {
this.form.deliveryDay = this.getDay(1, 3600000)
}
},
onAreaChange(e) { onAreaChange(e) {
console.log('e', e)
if (e.detail.value && e.detail.value.length > 0) { if (e.detail.value && e.detail.value.length > 0) {
const [province, city, district, street] = e.detail.value const [province, city, district, street] = e.detail.value
this.form.locProvinceId = province.value
this.form.locProvinceName = province.text
this.form.locCityId = city.value
this.form.locCityName = city.text
this.form.locDistrictId = district.value
this.form.locDistrictName = district.text
this.form.locStreetId = street.value
this.form.locStreetName = street.text
this.form.deliveryProvinceId = province.value
this.form.deliveryProvinceName = province.text
this.form.deliveryCityId = city.value
this.form.deliveryCityName = city.text
this.form.deliveryDistrictId = district.value
this.form.deliveryDistrictName = district.text
this.form.deliveryStreetId = street.value
this.form.deliveryStreetName = street.text
this.form.deliveryArea = province.text + city.text + district.text + street.text
} else { } else {
this.form.locProvinceId = null
this.form.locProvinceName = null
this.form.locCityId = null
this.form.locCityName = null
this.form.locDistrictId = null
this.form.locDistrictName = null
this.form.locStreetId = null
this.form.locStreetName = null
this.form.deliveryProvinceId = null
this.form.deliveryProvinceName = null
this.form.deliveryCityId = null
this.form.deliveryCityName = null
this.form.deliveryDistrictId = null
this.form.deliveryDistrictName = null
this.form.deliveryStreetId = null
this.form.deliveryStreetName = null
this.form.deliveryArea = null
} }
}, },
selectedImage(type) { selectedImage(type) {
@ -266,39 +326,47 @@ export default {
}) })
}, },
addUser() { addUser() {
if (!this.form.id) {
for (let i = 0; i < validateFields.length; i++) {
if (this.form[validateFields[i]] === null || this.form[validateFields[i]] === '') {
uni.showToast({
title: '请完善信息',
icon: 'none'
})
return
}
}
if (!/^1[3456789]\d{9}$/.test(this.form['legalPersonMobile'])) {
for (let i = 0; i < validateFields.length; i++) {
if (this.form[validateFields[i]] === null || this.form[validateFields[i]] === '') {
uni.showToast({ uni.showToast({
title: '请输入正确法人手机号',
title: '请完善信息',
icon: 'none' icon: 'none'
}) })
return return
} }
// if (!/^(\d{15}$|^\d{18}$|^\d{17}(\d|X|x))$/.test(this.form['legalPersonIdCardNo'])) {
// uni.showToast({
// title: '请输入正确法人身份证号',
// icon: 'none'
// })
// return
// }
} }
if (this.form.contactMobile && !/^1[3456789]\d{9}$/.test(this.form['contactMobile'])) {
uni.showToast({
title: '请输入正确联系人手机号',
icon: 'none'
})
return
const params = {
deliveryArea: this.form.deliveryArea,
deliveryCityId: this.form.deliveryCityId,
deliveryCityName: this.form.deliveryCityName,
deliveryDay: this.form.deliveryDay,
deliveryDistrictId: this.form.deliveryDistrictId,
deliveryDistrictName: this.form.deliveryDistrictName,
deliveryId: this.form.deliveryId,
deliveryProvinceId: this.form.deliveryProvinceId,
deliveryProvinceName: this.form.deliveryProvinceName,
deliveryStreetId: this.form.deliveryStreetId,
deliveryStreetName: this.form.deliveryStreetName,
detailList: [
{
brandId: this.form.brandId,
brandName: this.form.brandName,
categoryId: this.form.categoryId,
categoryName: this.form.categoryName,
gramWeight: this.form.gramWeight,
length: this.form.length,
paperName: this.form.paperName,
quantity: this.form.quantity,
remark: this.form.remark,
width: this.form.width
}
],
offerEnterprise: this.form.offerEnterprise,
remark: this.form.remark,
enterpriseId: this.$store.state.companyInfo.id,
userId: this.$store.state.userInfo.userId
} }
createEnquiryOrder(this.form).then(res => {
createEnquiryOrder(params).then(res => {
if (res) { if (res) {
uni.showToast({ uni.showToast({
title: '添加成功', title: '添加成功',
@ -309,9 +377,33 @@ export default {
}, 1000) }, 1000)
} }
}) })
},
/**
* @param {Object} day '昨天：', this.getDay(-1, 7200000) '今天：', this.getDay(0, 3600000) '明天：', this.getDay(1, 3600000)
* @param {Object} hours
* 获取当前时间的前一天 后一天 一周 或者是当前时间的几个小时
*/
getDay(day, hours) {
var today = new Date()
var targetday = today.getTime() + 1000 * 60 * 60 * 24 * day + hours
today.setTime(targetday)
var tYear = today.getFullYear()
var tMonth = today.getMonth()
var tDate = today.getDate()
var getHours = today.getHours()
tMonth = this.doHandleMonth(tMonth + 1)
tDate = this.doHandleMonth(tDate)
return tYear + '-' + tMonth + '-' + tDate + ' ' + '23:59:59'
},
doHandleMonth(month) {
var m = month
if (month.toString().length === 1) {
m = '0' + month
}
return m
} }
} }
} }
</script> </script>

14
pages/paper-details/index.vue
View File

@ -16,11 +16,11 @@
<view class="info"> <view class="info">
<view class="price-row"> <view class="price-row">
<text class="price">¥{{ info.skuList[0].listPrice }}</text> <text class="price">¥{{ info.skuList[0].listPrice }}</text>
<text class="unit">/{{ info.skuList[0].stockUnit }}</text>
<text class="unit">/{{ info.skuList[0].stockUnit | stockUnit}}</text>
</view> </view>
<view class="row"> <view class="row">
<view class="name">{{ info.name }}</view> <view class="name">{{ info.name }}</view>
<view class="value">库存：{{ info.skuList[0].stock || XX }}{{ info.skuList[0].stockUnit }}</view>
<view class="value">库存：{{ info.skuList[0].stock || XX }}{{ info.skuList[0].stockUnit | stockUnit}}</view>
</view> </view>
</view> </view>
<view class="list-box"> <view class="list-box">
@ -187,6 +187,12 @@ export default {
info: {}, info: {},
} }
}, },
filters: {
stockUnit(value) {
let name = value == 1 ? '张' : '吨'
return name
}
},
onLoad(option) { onLoad(option) {
this.params.productId = option.id this.params.productId = option.id
this.queryData() this.queryData()
@ -197,7 +203,7 @@ export default {
num = Number(this.buyPaperDto.gramWeight) * Number(this.buyPaperDto.pieceQuantity) num = Number(this.buyPaperDto.gramWeight) * Number(this.buyPaperDto.pieceQuantity)
this.buyPaperDto.buyTon = num / (1000 * 1000) this.buyPaperDto.buyTon = num / (1000 * 1000)
return this.buyPaperDto.buyTon
return this.buyPaperDto.buyTon.toFixed(4)
} }
}, },
methods: { methods: {
@ -237,7 +243,7 @@ export default {
// 路由到实单询比价 // 路由到实单询比价
inquiryTap() { inquiryTap() {
go2('for-comparison', { id: null })
go2('for-comparison', { id: this.info.supplierId })
}, },
closeTap() { closeTap() {
this.$refs.popup.close() this.$refs.popup.close()

BIN
static/imgs/cart/shopping-cart-not-select.png
View File

Before After
Width: 32  |  Height: 32  |  Size: 994 B

BIN
static/imgs/cart/shopping-cart-select.png
View File

Before After
Width: 32  |  Height: 32  |  Size: 1.1 KiB
Write Preview
Loading…
Cancel
Save