yunxi
/
app-nx-personal
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix

Browse Source
master
jevononlie 7 months ago
parent 8bf1d31dc6
commit 188e8f74b6
5 changed files with 99 additions and 546 deletions
Show Stats Download Patch File Download Diff File

6
src/pages.json
Unescape View File

@ -56,12 +56,6 @@
"navigationBarTitleText": "服务站详情"
}
},
{
"path": "pages/houseDetail/houseDetail",
"style": {
"navigationBarTitleText": "小区详情"
}
},
{
"path": "pages/login/protocal",
"style": {

136
src/pages/houseDetail/components/PageSkeleton.vue
Unescape View File

@ -1,136 +0,0 @@
<!--
此文件为开发者工具生成，生成时间: 2024/3/16下午5:17:10
使用方法：
在 /Users/wangwenjie/chanko/app-nx-personal/dist/dev/mp-weixin/pages/siteDetail/siteDetail.wxml 引入模板
```
<import src="siteDetail.skeleton.wxml"/>
<template is="skeleton" wx:if="{{loading}}" />
```
在 /Users/wangwenjie/chanko/app-nx-personal/dist/dev/mp-weixin/pages/siteDetail/siteDetail.wxss 中引入样式
```
@import "./siteDetail.skeleton.wxss";
```
更多详细信息可以参考文档：https://developers.weixin.qq.com/miniprogram/dev/devtools/skeleton.html
-->
<template name="skeleton">
<view class="sk-container">
<view class="site-detail site-detail data-v-c07d57ff data-v-c07d57ff">
<view is="components/XtxSwiper" class="data-v-c07d57ff data-v-c07d57ff">
<view class="carousel XtxSwiper--carousel">
<swiper circular="true" interval="3000" current="0" autoplay="false">
<swiper-item style="position: absolute; width: 100%; height: 100%; transform: translate(0%, 0px) translateZ(0px);">
<navigator class="navigator XtxSwiper--navigator" hover-class="none">
<image class="image XtxSwiper--image sk-image" mode="aspectFill"></image>
</navigator>
</swiper-item>
</swiper>
<view class="indicator XtxSwiper--indicator">
<text class="dot XtxSwiper--dot active XtxSwiper--active"></text>
<text class="dot XtxSwiper--dot"></text>
</view>
</view>
</view>
<view class="cont cont data-v-c07d57ff data-v-c07d57ff">
<view class="info info data-v-c07d57ff data-v-c07d57ff">
<view class="hd hd data-v-c07d57ff data-v-c07d57ff">
<view class="name data-v-c07d57ff sk-transparent sk-text-14-2857-463 sk-text">测试JY</view>
<view class="num data-v-c07d57ff sk-transparent sk-text-14-2857-544 sk-text">0米</view>
</view>
<view class="md md data-v-c07d57ff data-v-c07d57ff">
<view class="label data-v-c07d57ff sk-transparent sk-text-14-2857-85 sk-text">营业时间：</view>
<view class="time data-v-c07d57ff sk-transparent sk-text-14-2857-560 sk-text">10:20 - 13:20</view>
</view>
<view class="fd fd data-v-c07d57ff data-v-c07d57ff">
<view class="label data-v-c07d57ff sk-transparent sk-text-14-2857-893 sk-text">地址：上海市松江区园中路1号</view>
</view>
</view>
<view class="module-menu module-menu data-v-c07d57ff data-v-c07d57ff">
<view class="item data-v-c07d57ff sk-transparent sk-text-14-2857-881 sk-text" style="background-position-x: 50%;">旧衣服</view>
<view class="item data-v-c07d57ff sk-transparent sk-text-14-2857-330 sk-text" style="background-position-x: 50%;">家用电器</view>
<view class="item data-v-c07d57ff sk-transparent sk-text-14-2857-341 sk-text" style="background-position-x: 50%;">废纸废书</view>
<view class="item data-v-c07d57ff sk-transparent sk-text-14-2857-650 sk-text" style="background-position-x: 50%;">废金属</view>
<view class="item data-v-c07d57ff sk-transparent sk-text-14-2857-961 sk-text" style="background-position-x: 50%;">废塑料</view>
</view>
<view class="detail-list detail-list data-v-c07d57ff data-v-c07d57ff">
<view class="item arrow flex-row data-v-c07d57ff sk-pseudo sk-pseudo-circle">
<view class="service-title data-v-c07d57ff sk-transparent sk-text-33-3333-159 sk-text">服务</view>
<view class="tag-list tag-list data-v-c07d57ff data-v-c07d57ff">
<view class="tag data-v-c07d57ff sk-transparent sk-text-36-6667-477 sk-text">上门服务</view>
<view class="tag data-v-c07d57ff sk-transparent sk-text-36-6667-758 sk-text">家电维修</view>
<view class="tag data-v-c07d57ff sk-transparent sk-text-36-6667-789 sk-text">品控质检</view>
</view>
</view>
<view class="item item flex-column flex-column rate rate data-v-c07d57ff data-v-c07d57ff">
<view class="service-title data-v-c07d57ff sk-transparent sk-text-33-3333-384 sk-text">评分</view>
<view is="node-modules/@dcloudio/uni-ui/lib/uni-rate/uni-rate" class="data-v-c07d57ff data-v-c07d57ff">
<view>
<view class="uni-rate rate--uni-rate">
<view class="uni-rate__icon rate--uni-rate__icon" style="margin-right:0px">
<view is="node-modules/@dcloudio/uni-ui/lib/uni-icons/uni-icons">
<text class="uni-icons icons--uni-icons uniui-star-filled icons--uniui-star-filled sk-pseudo sk-pseudo-circle" style="color: #ececec; font-size: 24px;"></text>
</view>
<view class="uni-rate__icon-on rate--uni-rate__icon-on" style="width:100%">
<view is="node-modules/@dcloudio/uni-ui/lib/uni-icons/uni-icons">
<text class="uni-icons icons--uni-icons uniui-star-filled icons--uniui-star-filled sk-pseudo sk-pseudo-circle" style="color: #FF7D00; font-size: 24px;"></text>
</view>
</view>
</view>
<view class="uni-rate__icon rate--uni-rate__icon" style="margin-right:0px">
<view is="node-modules/@dcloudio/uni-ui/lib/uni-icons/uni-icons">
<text class="uni-icons icons--uni-icons uniui-star-filled icons--uniui-star-filled sk-pseudo sk-pseudo-circle" style="color: #ececec; font-size: 24px;"></text>
</view>
<view class="uni-rate__icon-on rate--uni-rate__icon-on" style="width:100%">
<view is="node-modules/@dcloudio/uni-ui/lib/uni-icons/uni-icons">
<text class="uni-icons icons--uni-icons uniui-star-filled icons--uniui-star-filled sk-pseudo sk-pseudo-circle" style="color: #FF7D00; font-size: 24px;"></text>
</view>
</view>
</view>
<view class="uni-rate__icon rate--uni-rate__icon" style="margin-right:0px">
<view is="node-modules/@dcloudio/uni-ui/lib/uni-icons/uni-icons">
<text class="uni-icons icons--uni-icons uniui-star-filled icons--uniui-star-filled sk-pseudo sk-pseudo-circle" style="color: #ececec; font-size: 24px;"></text>
</view>
<view class="uni-rate__icon-on rate--uni-rate__icon-on" style="width:100%">
<view is="node-modules/@dcloudio/uni-ui/lib/uni-icons/uni-icons">
<text class="uni-icons icons--uni-icons uniui-star-filled icons--uniui-star-filled sk-pseudo sk-pseudo-circle" style="color: #FF7D00; font-size: 24px;"></text>
</view>
</view>
</view>
<view class="uni-rate__icon rate--uni-rate__icon" style="margin-right:0px">
<view is="node-modules/@dcloudio/uni-ui/lib/uni-icons/uni-icons">
<text class="uni-icons icons--uni-icons uniui-star-filled icons--uniui-star-filled sk-pseudo sk-pseudo-circle" style="color: #ececec; font-size: 24px;"></text>
</view>
<view class="uni-rate__icon-on rate--uni-rate__icon-on" style="width:100%">
<view is="node-modules/@dcloudio/uni-ui/lib/uni-icons/uni-icons">
<text class="uni-icons icons--uni-icons uniui-star-filled icons--uniui-star-filled sk-pseudo sk-pseudo-circle" style="color: #FF7D00; font-size: 24px;"></text>
</view>
</view>
</view>
<view class="uni-rate__icon rate--uni-rate__icon" style="margin-right:0px">
<view is="node-modules/@dcloudio/uni-ui/lib/uni-icons/uni-icons">
<text class="uni-icons icons--uni-icons uniui-star-filled icons--uniui-star-filled sk-pseudo sk-pseudo-circle" style="color: #ececec; font-size: 24px;"></text>
</view>
<view class="uni-rate__icon-on rate--uni-rate__icon-on" style="width:100%">
<view is="node-modules/@dcloudio/uni-ui/lib/uni-icons/uni-icons">
<text class="uni-icons icons--uni-icons uniui-star-filled icons--uniui-star-filled sk-pseudo sk-pseudo-circle" style="color: #FF7D00; font-size: 24px;"></text>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
<view class="item item flex-column flex-column activity activity data-v-c07d57ff data-v-c07d57ff">
<view class="activity-title data-v-c07d57ff sk-transparent sk-text-14-2857-597 sk-text">活动</view>
<view class="activity-list activity-list data-v-c07d57ff data-v-c07d57ff">
<view class="activity-item data-v-c07d57ff sk-transparent sk-text-14-2857-423 sk-text">会员价</view>
<view class="activity-item data-v-c07d57ff sk-transparent sk-text-14-2857-853 sk-text">赠送积分</view>
</view>
</view>
</view>
</view>
</view>
</view>
</template>

323
src/pages/houseDetail/houseDetail.vue
Unescape View File

@ -1,323 +0,0 @@
<script setup lang="ts">
import { ref, reactive } from 'vue'
import { onLoad, onReady } from '@dcloudio/uni-app'
import { getHouseInfoAPI } from '@/services/home'
import { postBookingHouseAPI } from '@/services/booking'
import { serviceDomain, bannerList } from '@/services/constants'
import PageSkeleton from './components/PageSkeleton.vue'
import { useMemberStore } from '@/stores'
// 地图经纬度
const memberStore = useMemberStore()
const location = memberStore.location
const Info = ref({})
const isLoading = ref(false)
const housingEstateId = ref('')
const getDataList = async (id) => {
// 如果数据出于加载中，退出函数
// 发送请求前，标记为加载中
isLoading.value = true
// 发送请求
housingEstateId.value = id
const queryParams = {
housingEstateId: id,
...location,
}
const res = await getHouseInfoAPI(queryParams)
const obj = res.data
const arr = obj.images && JSON.parse(obj.images) || []
const imgUrl = serviceDomain + arr[0]?.url
obj.imgUrl = imgUrl
Info.value = obj
// 发送请求后，重置标记
isLoading.value = false
}
// 页面加载
onLoad((options) => {
getDataList(options.id)
})
const isLoadingBook = ref(false)
const handleBook = async () => {
if (isLoadingBook.value) {
return
}
isLoadingBook.value = true
const params = {
housingEstateId: housingEstateId.value,
remark: '请尽快上门',
}
const res = await postBookingHouseAPI(params)
uni.showToast({ icon: 'none', title: '下单成功~', duration: 3000 })
isLoadingBook.value = false
}
</script>
<template>
<view class="site-detail">
<template v-if="!isLoading">
<XtxSwiper :list="bannerList" />
<view class="cont">
<view class="info">
<view class="hd">
<view class="name">{{ Info?.name }}</view>
<view class="num">{{ Info.distance || 0.0 }}千米</view>
</view>
<view class="md">
<view class="label">回收时间：</view>
<view class="time">{{ Info.appointmentTimeStart }} - {{ Info.appointmentTimeEnd }}</view>
</view>
<view class="fd">
<view class="label">地址：{{ Info.address }}</view>
<image class="img" :src="Info.imgUrl" />
</view>
</view>
<!-- <view class="module-menu">
<view class="module-title">附近回收站：</view>
<view class="order-details" v-if="Info.stationProducts">
<view class="detail-item" v-for="item2 in Info.stationProducts" :key="item2.id">
<view class="product-name">
<image class="img-url" :src="item2.imgUrl"></image>
<view class="name">{{ item2.name }}</view>
</view>
<view class="product-price">回收价格：{{ item2.recoveryPrice }} 元</view>
</view>
</view>
</view> -->
<view class="action">
<view :class="[isLoadingBook ? 'disabled' : '', 'button']" @click="handleBook">定时回收下单</view>
</view>
</view>
</template>
<template v-else>
<PageSkeleton />
</template>
</view>
</template>
<style lang="scss" scoped>
.site-detail {
background: #f2f2fa;
.cont {
background-color: #fff;
margin: 20rpx;
padding: 16rpx;
min-height: 80vh;
overflow: auto;
positon: relative;
.info {
padding: 10rpx 20rpx;
box-shadow: 0px 0px 8px 0px rgba(161, 161, 177, 0.12);
.hd {
display: flex;
justify-content: space-between;
.name {
font-size: 30rpx;
font-weight: 500;
color: #0d0d26;
}
.num {
font-size: 28rpx;
color: #95969d;
}
}
.md {
margin: 10rpx 0;
font-size: 24rpx;
color: #95969d;
display: flex;
}
.fd {
display: flex;
justify-content: space-between;
align-items: center;
.label {
font-size: 24rpx;
}
.img {
width: 72rpx;
height: 72rpx;
border-radius: 50%;
background-color: #3a82fb;
}
}
}
.module-menu {
// display: flex;
padding: 36rpx 20rpx;
box-shadow: 0px 0px 8px 0px rgba(161, 161, 177, 0.12);
.item {
flex: 1;
color: #95969d;
padding: 10rpx 0;
border-radius: 10rpx;
text-align: center;
&.active {
background: #fff7e8;
}
}
.order-details {
.detail-item {
margin: 20rpx;
display: flex;
flex-direction: column;
justify-content: space-around;
.product-name {
display: flex;
align-items: center;
font-size: 28rpx;
.img-url {
width: 40rpx;
height: 40rpx;
margin-right: 20rpx;
}
.name {
font-size: 28rpx;
color: #95969d;
}
}
.product-price {
font-size: 28rpx;
margin: 20rpx;
color: #95969d;
}
}
}
}
.detail-list {
padding: 0 20rpx;
background-color: #fff;
margin-bottom: 20rpx;
border-radius: 10rpx;
.item {
// line-height: 90rpx;
padding-left: 10rpx;
font-size: 30rpx;
color: #333;
border-bottom: 1rpx solid #ddd;
position: relative;
text-align: left;
border-radius: 0;
background-color: #fff;
display: flex;
&::after {
width: auto;
height: auto;
left: auto;
border: none;
}
// &:first-child {
// border: none;
// }
&::after {
right: 5rpx;
}
&.flex-column {
flex-direction: column;
&:first-child {}
}
&.rate {
line-height: 90rpx;
padding-bottom: 20rpx;
}
&.flex-row {
line-height: 90rpx;
flex-direction: row;
}
.tag-list {
display: flex;
margin-left: 20rpx;
.tag {
color: #95969d;
font-size: 24rpx;
}
}
&.activity {
margin: 20rpx 0;
.activity-list {
display: flex;
.activity-item {
margin: 20rpx 10rpx;
&:first-child {
background: #484540;
padding: 4rpx 6rpx;
border-radius: 10rpx;
color: #ffe6b5;
font-size: 24rpx;
}
&:last-child {
padding: 4rpx 6rpx;
border-radius: 10rpx;
color: #ffb739;
border: 2rpx solid #ffb739;
font-size: 24rpx;
}
}
}
}
}
.arrow::after {
content: '\e6c2';
position: absolute;
top: 50%;
color: #ccc;
font-family: 'erabbit' !important;
font-size: 32rpx;
transform: translateY(-50%);
}
}
.action {
position: absolute;
bottom: 100rpx;
width: 400rpx;
transform: translateX(50%);
text-align: center;
.button {
padding: 30rpx 40rpx;
font-size: 32rpx;
color: #fff;
font-weight: 500;
border-radius: 32rpx;
background: linear-gradient(158deg, #51B6FF 10%, #3775F6 97%);
&.disabled {
background: #95969d;
}
}
}
}
}
</style>

119
src/pages/index/components/NeighborhoodHouse.vue
Unescape View File

@ -1,33 +1,48 @@
<!--
* @Author: 王文杰
* @Date: 2024-03-15 21:26:32
* @LastEditors: 王文杰
* @LastEditTime: 2024-03-26 15:50:11
* @LastEditors: jevononlie 728254585@qq.com
* @LastEditTime: 2024-04-03 10:17:59
* @FilePath: /app-nx-personal/src/pages/index/components/NeighborhoodSite.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<script setup lang="ts">
import { postBookingHouseAPI } from '@/services/booking'
defineProps<{
list: []
}>()
const handleToto = (id) => {
const url = `/pages/houseDetail/houseDetail?id=${id}`
uni.navigateTo({ url })
const handleBook = (item: Object) => {
// 弹窗二次确认
const str = `回收时间：${item?.appointmentTimeStart} - ${item?.appointmentTimeEnd}\r\n回收小区：${item?.name}`
// const content = str.replace(/<br>/g, '\n')
uni.showModal({
title: '请确认是否提交？',
content: str,
confirmColor: '#3775F6',
success: async (res) => {
if (res.confirm) {
const params = {
housingEstateId: item.id,
}
const res = await postBookingHouseAPI(params)
uni.showToast({ icon: 'none', title: '下单成功~', duration: 3000 })
}
},
})
}
</script>
<template>
<view class="neighborhood">
<view class="module-title">定时回收</view>
<view class="module-desc"> 定时上门，快捷高效</view>
<view class="item" v-for="item in list" :key="item.id" @tap="handleToto(item.id)">
<view class="item" v-for="item in list" :key="item.id" @tap="handleBook(item)">
<view class="module-cont">
<image class="left" :src="item.imgUrl" />
<view class="md">
<view class="name">{{ item.name }}</view>
<view class="time"
>回收时间：{{ item.appointmentTimeStart }} - {{ item.appointmentTimeEnd }}</view
>
<view class="time">回收时间：{{ item.appointmentTimeStart }} - {{ item.appointmentTimeEnd }}</view>
<view class="loction">{{ item.address }}</view>
</view>
<view class="right">
@ -45,68 +60,80 @@ const handleToto = (id) => {
padding-bottom: 120rpx;
background-color: #fff;
border-radius: 4rpx;
.module-title {
font-size: 30rpx;
color: #0D0D26;
margin: 10rpx 0;
}
.module-desc {
font-size: 24rpx;
color: #95969D;
padding-bottom: 20rpx;
}
.module-cont {
border-top: 2rpx solid #F2F2F2;
padding: 20rpx 0;
display: flex;
flex-direction: row;
.left {
width: 140rpx;
height: 140rpx;
border-radius: 12rpx;
width: 140rpx;
height: 140rpx;
border-radius: 12rpx;
}
.md {
flex: 1;
margin: 0 10rpx;
font-size: 24rpx;
color: #0D0D26;
.name {
font-size: 30rpx;
.zuijin {
font-size: 24rpx;
color: #FF7D00;
background: #FFF7E8;
padding: 4rpx 4rpx;
margin-right: 6rpx;
border-radius: 4rpx;
}
}
.time {
color: #95969D;
margin: 8rpx 0;
}
.loction {
color: #0D0D26;
flex: 1;
margin: 0 10rpx;
font-size: 24rpx;
color: #0D0D26;
.name {
font-size: 30rpx;
.zuijin {
font-size: 24rpx;
color: #FF7D00;
background: #FFF7E8;
padding: 4rpx 4rpx;
margin-right: 6rpx;
border-radius: 4rpx;
}
}
.time {
color: #95969D;
margin: 8rpx 0;
}
.loction {
color: #0D0D26;
}
}
.right {
.num {
font-size: 28rpx;
color: #95969D
}
.img {
width: 72rpx;
height: 72rpx;
margin-top: 20rpx;
border-radius: 10rpx;
}
.num {
font-size: 28rpx;
color: #95969D
}
.img {
width: 72rpx;
height: 72rpx;
margin-top: 20rpx;
border-radius: 10rpx;
}
}
}
.foot-desc {
.item {
font-size: 24rpx;
color: #95969D;
margin: 10rpx 0;
font-size: 24rpx;
color: #95969D;
margin: 10rpx 0;
}
}
}

61
src/pages/orderDetail/orderDetail.vue
Unescape View File

@ -49,17 +49,17 @@ const getMemberOrderByIdData = async (orderId) => {
// 到站下单
isOderTypeDZ.value = data.orderType?.code == '520193532170867013' || false
data.orderDetails?.forEach((q) => {
const arr = JSON.parse(q.product.photo)
const imgUrl = serviceDomain + arr[0].url
q.imgUrl = imgUrl
})
// 预约回收
if (isOrderTypeSH.value) {
const str = data.appointmentTimeStart?.slice(0, 10)
const start = data.appointmentTimeStart?.slice(11, 16)
const end = data.appointmentTimeEnd?.slice(11, 16)
data.appointmentTime = str + ' ' + start + '-' + end
data.orderDetails?.forEach((q) => {
const arr = JSON.parse(q.product.photo)
const imgUrl = serviceDomain + arr[0].url
q.imgUrl = imgUrl
})
}
// 定时回收
if (isOderTypeTime.value) {
@ -108,31 +108,30 @@ const handleCancleOrder = () => {
</view>
</template>
</view>
<template v-if="isOrderTypeSH">
<view class="module">
<view class="title">订单编号：{{ order.orderNumber }}</view>
<view class="detail-title">回收品类：</view>
<view class="order-details">
<view class="detail-item" v-for="item in order.orderDetails" :key="item.id">
<view class="product-info">
<image class="img-url" :src="item.imgUrl"></image>
<view class="name">{{ item.product.name }}</view>
</view>
<template v-if="order.orderStatus.code == '520193049964319045'">
<view class="recovery-price">实际价格：{{ item.actualRecoveryPrice }}元</view>
<view class="recovery-weight">实际重量：{{ item.productActualWeight }}千克</view>
</template>
<view class="module">
<view class="title">订单编号：{{ order.orderNumber }}</view>
<view class="detail-title">回收品类：</view>
<view class="order-details">
<view class="detail-item" v-for="item in order.orderDetails" :key="item.id">
<view class="product-info">
<image class="img-url" :src="item.imgUrl"></image>
<view class="name">{{ item.product.name }}</view>
</view>
<template v-if="isOrderTypeSH">
<view class="recovery-price">实际价格：{{ item.actualRecoveryPrice }}元</view>
<view class="recovery-weight">实际重量：{{ item.productActualWeight }}千克</view>
</template>
</view>
<view class="predict-weight">预估重量：{{ order.predictWeight?.desc }}</view>
<template v-if="order.recyclerInfo">
<view class="staffs-name">
回收员：{{ order.recyclerInfo?.staffsName }}</view>
<view class="staffs-phone">回收员手机号：{{ order.recyclerInfo?.mobilePhone }}</view>
</template>
</view>
<view class="predict-weight">预估重量：{{ order.predictWeight?.desc || '-' }}</view>
<template v-if="order.recyclerInfo">
<view class="staffs-name">
回收员：{{ order.recyclerInfo?.staffsName }}</view>
<view class="staffs-phone">回收员手机号：{{ order.recyclerInfo?.mobilePhone }}</view>
</template>
</view>
<template v-if="isOrderTypeSH">
<view class="module info">
<view class="title">取件信息</view>
<view class="item">
@ -179,14 +178,6 @@ const handleCancleOrder = () => {
<view class="val">{{ order.housingEstateInfo.appointmentTimeStart }} -
{{ order.housingEstateInfo.appointmentTimeEnd }}</view>
</view>
<view class="item">
<view class="label">下单时间：</view>
<view class="val">{{ order.housingEstateInfo.creatorTime }}</view>
</view>
<view class="item" v-if="order.housingEstateInfo.completeTime">
<view class="label">完成时间：</view>
<view class="val">{{ order.housingEstateInfo.completeTime }}</view>
</view>
<view class="item">
<view class="label">备注：</view>
<view class="val">{{ order.remark }}</view>

Write Preview
Loading…
Cancel
Save