From 0b33a3dcc3a7592c476d992e1b79a3bc837afb25 Mon Sep 17 00:00:00 2001
From: MrShi <1878285526@qq.com>
Date: 星期四, 21 八月 2025 13:42:56 +0800
Subject: [PATCH] 优化
---
small-program/pages/index/index.vue | 325 ++++++++++++++++++++++++++++++++++++++++-------------
1 files changed, 245 insertions(+), 80 deletions(-)
diff --git a/small-program/pages/index/index.vue b/small-program/pages/index/index.vue
index fec1ae9..4fce84e 100644
--- a/small-program/pages/index/index.vue
+++ b/small-program/pages/index/index.vue
@@ -11,14 +11,12 @@
<view class="search" :style="{ top: statusbarHeight + navHeight + 'px' }">
<view class="index-j-cate">
<view class="index-j-cate-item" v-for="(item, index) in searchType" :key="index" @click="clickCate(item.id)">
- <text :style="{ color: typeVal === item.id ? '##222222' : '' }">{{item.name}}</text>
+ <text :style="{ color: typeVal === item.id ? '#222222' : '', fontSize: typeVal === item.id ? '36rpx' : '', fontWeight: typeVal === item.id ? '600' : '' }">{{item.name}}</text>
<view class="index-j-cate-item-x" v-if="typeVal === item.id"></view>
</view>
</view>
<view class="index-j-search">
- <view class="index-j-search-item active">鏈�鏂板彂甯�</view>
- <view class="index-j-search-item">璺濈浼樺厛</view>
- <view class="index-j-search-item">浠锋牸浠庨珮鍒颁綆</view>
+ <view :class="sortType === item.id ? 'index-j-search-item active' : 'index-j-search-item'" v-for="(item, index) in sortList" :key="index" @click="clickSort(item.id)">{{item.name}}</view>
</view>
</view>
<view class="index-j-list">
@@ -40,31 +38,43 @@
{{item.categoryName}}锝渰{item.priceNum1}}鏂�
</view>
<view class="index-list-item-info" v-if="item.type === 0 && item.workType === 1">
- {{item.categoryName}}锝渰{item.priceNum1}}鏂�
+ {{item.categoryName}}锝渰{item.priceNum1}}浜�
</view>
<view class="index-list-item-info" v-if="item.type === 0 && item.workType === 2">
- {{item.categoryName}}锝渰{item.priceNum1}}鏂�
+ {{item.categoryName}}锝渰{item.priceNum1}}浜�
</view>
<view class="index-list-item-info" v-if="item.type === 1">
- {{item.categoryName}}锝渰{item.priceNum1}}鏂�
+ {{item.transportTypeName}} | {{item.transportNum}}{{item.transportUnit}}锝滅敤杞{item.priceNum1}}澶�
</view>
<view class="index-list-item-info" v-if="item.type === 2">
{{item.wayInfoCopy}}
</view>
- <view class="index-list-item-dz">
- <image src="/static/icon/order_ic_location@2x.png" mode="widthFix"></image>
- <text>{{item.location}}</text>
+
+ <view class="address" v-if="item.type === 1">
+ <view class="address-xian"></view>
+ <view class="address-row" v-for="(address, i) in item.wayInfo" :key="i">
+ <image src="/static/icon/ic_qidian@2x.png" mode="widthFix" v-if="i === 0"></image>
+ <image src="/static/icon/ic_jingguo@2x.png" mode="widthFix" v-else-if="i !== 0 && i !== item.wayInfo.length - 1"></image>
+ <image src="/static/icon/ic_zhongdian@2x.png" mode="widthFix" v-else-if="i === item.wayInfo.length - 1"></image>
+ <text>{{item.location}}</text>
+ </view>
</view>
- <view class="index-list-item-dz">
- <image src="/static/icon/order_ic_time@2x.png" mode="widthFix"></image>
- <text>{{item.startDate}} 鑷� {{item.endDate}}锛坽{item.priceNum1}}澶╋級</text>
- </view>
+ <template v-if="[0, 2].includes(item.type)">
+ <view class="index-list-item-dz">
+ <image src="/static/icon/order_ic_location@2x.png" mode="widthFix"></image>
+ <text>{{item.location}}</text>
+ </view>
+ <view class="index-list-item-dz">
+ <image src="/static/icon/order_ic_time@2x.png" mode="widthFix"></image>
+ <text>{{item.startDate}} 鑷� {{item.endDate}}锛坽{item.totalDays}}澶╋級</text>
+ </view>
+ </template>
<view class="index-list-item-price">
<text>棰勪及锛�</text>
<text>楼{{item.estimatedAccount / 100}}</text>
</view>
<view class="eidt">
- <sunui-mverify @change="mverify($event, item.id)"></sunui-mverify>
+ <sunui-mverify @change="getaccept($event, item.id, index)"></sunui-mverify>
</view>
</view>
</view>
@@ -183,7 +193,7 @@
</view>
</view>
<view class="box-hz-btn" :style="{ backgroundImage: 'url(' + btn + ')' }">
- <view class="box-hz-btn-kf">瀹㈡湇</view>
+ <view class="box-hz-btn-kf" @click="contactPhone()">瀹㈡湇</view>
<view class="box-hz-btn-next" @click="submit">涓嬩竴姝�</view>
</view>
</view>
@@ -213,10 +223,10 @@
</view>
<view class="box-hz-list-item" @click="selectAddress(1)">
<view class="box-hz-list-item-label"><text>鐢ㄥ伐鍦扮偣锛�</text></view>
- <view :class="form.location ? 'box-hz-list-item-val active' :'box-hz-list-item-val'">
+ <view :class="form.address ? 'box-hz-list-item-val active' :'box-hz-list-item-val'">
<view class="box-hz-list-item-val-left">
<image class="icon" src="/static/icon/ic_location@2x.png" mode="widthFix"></image>
- <text>{{form.location ? form.location : '璇烽�夋嫨鐢ㄥ伐鍦扮偣'}}</text>
+ <text>{{form.address ? form.address : '璇烽�夋嫨鐢ㄥ伐鍦扮偣'}}</text>
</view>
<u-icon name="arrow-right" color="#111111" size="16"></u-icon>
</view>
@@ -293,7 +303,7 @@
</template>
<view class="box-hz-btn" :style="{ backgroundImage: 'url(' + btn + ')' }">
- <view class="box-hz-btn-kf">瀹㈡湇</view>
+ <view class="box-hz-btn-kf" @click="contactPhone()" >瀹㈡湇</view>
<view class="box-hz-btn-next" @click="jump()">涓嬩竴姝�</view>
</view>
</view>
@@ -302,34 +312,46 @@
<!-- 閫夋嫨鏃ユ湡鑼冨洿 -->
<u-calendar :show="show" color="#00BC12" mode="range" @close="show = false" @confirm="confirmDate"></u-calendar>
+ <u-popup :show="showPhone" round="15" mode="bottom" @close="contactPhone()" :closeable="true" :closeOnClickOverlay="true">
+ <view class="phone">
+ <view class="phone-head">
+ <view></view>
+ <text>瀹㈡湇鐢佃瘽</text>
+ </view>
+ <view class="phone-item" v-for="(item,index) in serverPhone" :key="item" @click="contactPhoneDo(item)">
+ <view></view>
+ <text>{{item}}</text>
+ </view>
+ <view class="phone-item" v-for="(item,index) in serverPhone" :key="item" @click="contactPhoneDo(item)">
+ <view></view>
+ <text>{{item}}</text>
+ </view>
+ <!-- <view class="phone-botton" @click="contactPhone()" >鍏抽棴</view> -->
+ </view>
+ </u-popup>
</view>
</template>
<script>
import { mapState } from 'vuex'
import sunuiMverify from '@/components/sunui-mverify/sunui-mverify.vue';
+ var QQMapWX = require('@/utils/qqmap-wx-jssdk.js');
export default {
components: { sunuiMverify },
computed: {
- ...mapState(['navHeight', 'statusbarHeight','userInfo','token','openid']),
+ ...mapState(['navHeight', 'statusbarHeight','userInfo','token','openid', 'latitude', 'longitude']),
totalPrice() {
return this.form.estimatedAccount / 100
}
},
- onShow(options) {
- this.typeViewId = 0
- if(this.token && this.token != '' && this.userInfo && JSON.stringify(this.userInfo) != '{}'){
- this.isLogin = true
- }
- if (this.userInfo && this.userInfo.useIdentity == 1) {
- this.typeViewId = 1
- }
- },
data() {
return {
+ showPhone:false,
+ serverPhone:[],
show: false,
isLogin: false,
typeId: 0,
+ qqmapsdk: null,
type: [
{ name: '鐢ㄥ伐', id: 0 },
{ name: '杩愯揣', id: 1 },
@@ -345,6 +367,11 @@
{ name: '閲囨憳宸�', id: 0 },
{ name: '鍒嗘嫞宸�', id: 1 },
{ name: '鍖呰宸�', id: 2 }
+ ],
+ sortList: [
+ { name: '鏈�鏂板彂甯�', id: 0 },
+ { name: '璺濈浼樺厛', id: 1 },
+ { name: '浠锋牸浠庨珮鍒颁綆', id: 2 }
],
car: [],
btn: require('@/static/image/btn.png'),
@@ -375,43 +402,73 @@
estimatedAccount: '',
price: ''
},
-
+ sortType: 0,
orderList: [],
typeVal: '',
- page: 1
+ page: 1,
+ next: true,
+
+ isOnce: true
}
},
- onLoad() {
- this.getCategoryLists()
- this.getOrderList()
+ async onLoad() {
+ await this.$onLaunched;
+
+ if (this.token && this.token != '' && this.userInfo && JSON.stringify(this.userInfo) != '{}') {
+ this.getOrderList()
+ this.getCategoryLists()
+ }
+
+ this.qqmapsdk = new QQMapWX({
+ key: '4PXBZ-JLBC7-LCLXG-P2SZX-C4HYE-LDBLQ'
+ });
+
this.form.linkPhone = this.userInfo.telephone
+
+ this.getDictInfo()
+ },
+ onShow(options) {
+ this.typeViewId = 0
+ if(this.token && this.token != '' && this.userInfo && JSON.stringify(this.userInfo) != '{}') {
+ console.log('宸茬櫥闄�')
+ this.isLogin = true
+
+ if (!this.isOnce && this.userInfo.useIdentity == 1) {
+ this.page = 1
+ this.next = true
+ this.orderList = []
+ this.getOrderList()
+ }
+
+ } else {
+ this.isLogin = false
+ console.log('鏈櫥闄�')
+ }
+
+ if (this.userInfo && this.userInfo.useIdentity == 1) {
+ this.typeViewId = 1
+ }
},
watch: {
typeId: {
handler(news, old) {
- this.form = {
- startDate: '',
- endDate: '',
- latitude: '',
- longitude: '',
- location: '',
- locationEnd: '',
- wayInfoDTOList: [],
- workType: 0,
- categoryId: '',
- categoryName: '',
- days: '',
- locationRemark: '',
- supplement: '',
- multifileList: [],
- linkName: '',
- linkPhone: '',
- estimatedAccount: '',
- price: ''
- }
+ this.form.startDate = ''
+
+ this.form.endDate = ''
+ this.form.latitude = ''
+ this.form.longitude = ''
+ this.form.location = ''
+ this.form.locationEnd = ''
+ this.form.wayInfoDTOList = []
+ this.form.workType = ''
+ this.form.days = ''
+ this.form.locationRemark = ''
+ this.form.supplement = ''
+ this.form.multifileList = []
+ this.form.linkName = ''
+ this.form.estimatedAccount = ''
+ this.form.price = ''
this.viewStatus = false
- this.carImage = ''
- this.carRemark = ''
}
},
orderFood: {
@@ -440,33 +497,91 @@
}
}
},
+ onReachBottom() {
+ this.getOrderList()
+ },
methods: {
+ getDictInfo(){
+ var that = this;
+ this.$u.api.getPlatformAboutUs({}).then(res =>{
+ that.serverPhone = (res.data.serverPhone||'').split(",")
+ })
+ },
+ contactPhone(){
+ this.showPhone = !this.showPhone
+ console.log("==================================",this.showPhone)
+ },
+ contactPhoneDo(phone){
+ if(phone !=null && phone!=''){
+ uni.makePhoneCall({
+ phoneNumber: phone
+ })
+ }
+ },
+ // 鎵嬪姩鎺ュ崟
+ getaccept(e, orderId, index) {
+ if (!e.msg) return;
+ this.$u.api.accept({ orderId })
+ .then(res => {
+ if (res.code === 200) {
+ uni.showToast({ title: '鎶㈠崟鎴愬姛锛�', icon: 'success', duration: 2000 })
+ setTimeout(() => {
+ this.page = 1
+ this.next = true
+ this.orderList = []
+ this.getOrderList()
+ }, 2000)
+ }
+ })
+ },
+ clickSort(id) {
+ this.sortType = id
+ this.page = 1
+ this.next = true
+ this.orderList = []
+ this.getOrderList()
+ },
clickCate(id) {
this.typeVal = id
this.page = 1
- this.list = []
+ this.next = true
+ this.orderList = []
this.getOrderList()
},
// 璁㈠崟鍒嗛〉
getOrderList() {
+ if (!this.next) return;
this.$u.api.orderPage({
capacity: 10,
page: this.page,
model: {
queryMyOrderType: 2,
- type: this.typeVal
+ type: this.typeVal,
+ sortType: this.sortType,
+ queryLat: this.latitude,
+ queryLgt: this.longitude
}
}).then(res => {
+ if (res.code !== 200) return;
+ this.isOnce = false
res.data.records.forEach(item => {
// 璁㈤鍗�
if (item.type === 2) {
item.wayInfoCopy = JSON.parse(item.wayInfo).map(item => {
return `${item.name}${item.price / 100}鍏�(${item.num}浠�)`
}).join(' | ')
+ // 杩愯揣
+ } else if (item.type === 1) {
+ item.wayInfo = JSON.parse(item.wayInfo)
}
})
- console.log(res.data.records)
this.orderList = [...this.orderList, ...res.data.records]
+
+ if (this.orderList.length === res.data.total) {
+ this.next = false
+ } else {
+ this.page += 1
+ }
})
},
// 鎻愪氦璁㈠崟
@@ -563,7 +678,9 @@
priceNum1: that.form.days,
type: 2
}).then(res => {
- that.form.estimatedAccount = res.data
+ if (res.code === 200) {
+ that.form.estimatedAccount = res.data
+ }
})
}
},
@@ -604,6 +721,12 @@
},
clickType(e) {
this.typeId = e
+ if (e === 2) {
+ this.form.categoryId = this.car[0].id
+ this.form.categoryName = this.car[0].name
+ this.carRemark = this.car[0].remark
+ this.carImage = this.car[0].iconFull
+ }
},
clickTypeWork(e) {
this.form.workType = e
@@ -636,17 +759,17 @@
// 閲囨憳宸�
if (this.form.workType === 0) {
uni.navigateTo({
- url: `/pages/using-workers/using-workers?days=${form.days}&startDate=${form.startDate}&endDate=${form.endDate}&latitude=${form.latitude}&longitude=${form.longitude}&address=${form.location}&workType=${form.workType}`
+ url: `/pages/using-workers/using-workers?days=${form.days}&startDate=${form.startDate}&endDate=${form.endDate}&latitude=${form.latitude}&longitude=${form.longitude}&address=${form.address}&workType=${form.workType}`
})
// 鍒嗘嫞宸�
} else if (this.form.workType === 1) {
uni.navigateTo({
- url: `/pages/sorting/sorting?days=${form.days}&startDate=${form.startDate}&endDate=${form.endDate}&latitude=${form.latitude}&longitude=${form.longitude}&address=${form.location}&workType=${form.workType}`
+ url: `/pages/sorting/sorting?days=${form.days}&startDate=${form.startDate}&endDate=${form.endDate}&latitude=${form.latitude}&longitude=${form.longitude}&address=${form.address}&workType=${form.workType}`
})
// 鍖呰宸�
} else if (this.form.workType === 2) {
uni.navigateTo({
- url: `/pages/packaging-worker/packaging-worker?days=${form.days}&startDate=${form.startDate}&endDate=${form.endDate}&latitude=${form.latitude}&longitude=${form.longitude}&address=${form.location}&workType=${form.workType}`
+ url: `/pages/packaging-worker/packaging-worker?days=${form.days}&startDate=${form.startDate}&endDate=${form.endDate}&latitude=${form.latitude}&longitude=${form.longitude}&address=${form.address}&workType=${form.workType}`
})
}
// 杩愯揣
@@ -682,9 +805,6 @@
})
}
},
- mverify(e, id){
- console.log('楠岃瘉缁撴灉:', e, id);
- },
// 閫夋嫨濂楅
selectMenu(a, b) {
this.orderFood.forEach((item, index) => {
@@ -698,24 +818,28 @@
getCategoryLists() {
this.$u.api.getCategoryList({ type: 1 })
.then(res => {
- this.car = res.data
- this.form.categoryId = res.data[0].id
- this.form.categoryName = res.data[0].name
- this.carRemark = res.data[0].remark
- this.carImage = res.data[0].iconFull
+ if (res.code === 200) {
+ this.car = res.data
+ this.form.categoryId = res.data[0].id
+ this.form.categoryName = res.data[0].name
+ this.carRemark = res.data[0].remark
+ this.carImage = res.data[0].iconFull
+ }
})
this.$u.api.getCategoryList({ type: 2 })
.then(res => {
- res.data.forEach(item => {
- item.num = ''
- item.list = item.detailList.map(child => {
- return {
- active: false,
- price: child
- }
+ if (res.code === 200) {
+ res.data.forEach(item => {
+ item.num = ''
+ item.list = item.detailList.map(child => {
+ return {
+ active: false,
+ price: child
+ }
+ })
})
- })
- this.orderFood = res.data
+ this.orderFood = res.data
+ }
})
}
}
@@ -1618,5 +1742,46 @@
}
}
}
+ .phone {
+ width: 100%;
+ padding-top: 40rpx;
+ box-sizing: border-box;
+ .phone-botton {
+ width: 100%;
+ height: 88rpx;
+ line-height: 88rpx;
+ text-align: center;
+ font-weight: 500;
+ font-size: 32rpx;
+ color: #FFFFFF;
+ background: #00BC12;
+ border-radius: 44rpx;
+ margin-top: 60rpx;
+ }
+ .phone-head {
+ width: 100%;
+ text-align: center;
+ justify-content: space-between;
+ margin-bottom: 40rpx;
+ text {
+ font-weight: 800;
+ font-size: 32rpx;
+ color: #222222;
+ }
+ }
+ .phone-item {
+ width: 100%;
+ text-align: center;
+ justify-content: space-between;
+ border-bottom: 1rpx solid #eeeeee;
+ line-height: 78rpx;
+ text {
+ font-weight: 500;
+ font-size: 28rpx;
+ line-height: 28rpx;
+ color: #222222;
+ }
+ }
+ }
}
</style>
--
Gitblit v1.9.3