Compare commits
84 Commits
2866332d27
...
cb4e23669d
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
cb4e23669d | ||
|
|
26c886f426 | ||
|
|
2ffa141844 | ||
|
|
439e689671 | ||
|
|
93026479d3 | ||
|
|
39a0160f95 | ||
|
|
847c1701f8 | ||
|
|
f44adc7721 | ||
|
|
59c5178af9 | ||
|
|
17018a4e07 | ||
|
|
0cab3dd853 | ||
|
|
9d5b9a86bc | ||
|
|
bc782b6227 | ||
|
|
bdc1079f5a | ||
|
|
bfc285ff57 | ||
|
|
f34ffdd1c4 | ||
|
|
b2ad1d6abc | ||
|
|
3580ba2185 | ||
|
|
d49514d426 | ||
|
|
53342c7173 | ||
|
|
c87ee26b07 | ||
|
|
dbe6137a4e | ||
|
|
87a645078b | ||
|
|
3f35b67705 | ||
|
|
29b21d9e53 | ||
|
|
fc9e6b2ff7 | ||
|
|
808661174e | ||
|
|
25bb15d144 | ||
|
|
1c332efdc0 | ||
|
|
8f3af9a2aa | ||
|
|
353b01fa4f | ||
|
|
70d90876ee | ||
|
|
81b65f9eb9 | ||
|
|
3e884f1b1a | ||
|
|
7fdf8f342f | ||
|
|
1de223346d | ||
|
|
f52d8cbcc6 | ||
|
|
d64fa80c13 | ||
|
|
c83e7c5a9b | ||
|
|
806e2f36f6 | ||
|
|
477a43e2ba | ||
|
|
609e551a90 | ||
|
|
84ac2a6da5 | ||
|
|
7dc5ee160f | ||
|
|
b1f9dc134d | ||
|
|
68b309bb6b | ||
|
|
0fa63c8166 | ||
|
|
336361d383 | ||
|
|
d7118589fa | ||
|
|
660b77a732 | ||
|
|
1b55237844 | ||
|
|
5dca603b29 | ||
|
|
1f3e2824ef | ||
|
|
83b7536692 | ||
|
|
75f55007b2 | ||
|
|
3db2ddb1ff | ||
|
|
631276afa3 | ||
|
|
4529b3f25c | ||
|
|
4183457dfd | ||
|
|
e816da4cf2 | ||
|
|
7ffa374c55 | ||
|
|
33916336ab | ||
|
|
a89e4290b6 | ||
|
|
485145d706 | ||
|
|
a9e42e8791 | ||
|
|
498f18d7da | ||
|
|
38f73a19c4 | ||
|
|
690c2d1833 | ||
|
|
18cf687324 | ||
|
|
38b6b44de9 | ||
|
|
744073e7ec | ||
|
|
0a6d26eb49 | ||
|
|
60d6fe9e9e | ||
|
|
44013eb054 | ||
|
|
1307aa9a7f | ||
|
|
01aa983ec7 | ||
|
|
ad7818ce2d | ||
|
|
ddd0408080 | ||
|
|
d50dd6167e | ||
|
|
48b26483c0 | ||
|
|
ad75a5142d | ||
|
|
0770dd40fb | ||
|
|
82b4ba8b07 | ||
|
|
38896f2a26 |
@ -1,4 +1,6 @@
|
||||
export const apiArr = {
|
||||
isShowSearch: '/api/v1/wechat/home-page/search-enable/info', // 获取搜索框是否显示
|
||||
hotWord: '/api/v1/wechat/home-page/search-hot-word/info', // 获取搜索框热词
|
||||
list: '/api/v1/wechat/community/list', // 获取社区列表
|
||||
info: '/api/v1/wechat/community/info', // 获取单个社区信息
|
||||
isJoin: '/api/v1/wechat/community/is-join', // 用户是否加入社区、楼宇、房间
|
||||
@ -36,6 +38,7 @@ export const apiArr = {
|
||||
commInfo: "/api/v2/wechat/mpuser-crud/community-owner/info",//我的房产信息小区列表
|
||||
create: "/api/v2/wechat/community-owners/create",//创建新的业主信息
|
||||
|
||||
communityInfo: "/api/v2/community/get-one",//获取小区信息
|
||||
|
||||
getOrderList:"/api/v2/wechat/community-orders/get-all-list",//获取账单
|
||||
getCommunityRoomList:"/api/v2/wechat/community-room/list", //获取房源列表
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
export const apiArr = {
|
||||
getCateList: "/api/v2/wechat/merchant-cate-crud/list", //小区房源列表
|
||||
getCateList: "/api/v2/wechat/merchant-cate-crud/list", //商家分类列表
|
||||
getMerchantList: "/api/v2/wechat/merchant-info-crud/page", //商家列表
|
||||
getHomeBanner: "/api/v2/wechat/home-banner-region-crud/page", //获取首页banner及其广告
|
||||
getButtonNum:"/api/v2/wechat/nav-display-crud/info",//获取首页button的行数 数量
|
||||
getHomeButton:"/api/v2/wechat/home-button-region-crud/page", //获取首页button
|
||||
|
||||
@ -2,6 +2,7 @@ export const apiArr = {
|
||||
getMerChantCateList:"/api/v2/wechat/merchant-cate-crud/list", //商家分类
|
||||
getMerchantList:"/api/v2/wechat/merchant-info-crud/page",//商家列表
|
||||
createComment:"/api/v2/wechat/merchant-evaluation-crud/creat",//创建用户评价
|
||||
getMerchantInfo:"/api/v2/wechat/merchant-info-crud/info",//获取商家信息详情
|
||||
getMerchantComment:"/api/v2/wechat/merchant-evaluation-crud/page",//获取商家评价
|
||||
merChantCommentLike:"/api/v2/wechat/merchant-evaluation-like-crud/creat",//点赞
|
||||
merChantCommentUnlike:"/api/v2/wechat/merchant-evaluation-like-crud/del",//取消点赞
|
||||
|
||||
@ -1,4 +1,3 @@
|
||||
|
||||
.foot-fixed {
|
||||
position: fixed;
|
||||
bottom: -1px;
|
||||
@ -8,14 +7,17 @@
|
||||
width: 100%;
|
||||
background: #ffffff;
|
||||
border-top: 1px solid #E8E8E8;
|
||||
box-shadow: 0 0 3px rgba(0,0,0,0.1);
|
||||
box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.foot-fixed .foot-item {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.foot-fixed .foot-item {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.foot-fixed .foot-item {
|
||||
width: 20%;
|
||||
float: left;
|
||||
@ -27,48 +29,88 @@
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #666;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
|
||||
.foot-fixed .foot-item .foot-icon-box{
|
||||
.foot-fixed .foot-item .foot-icon-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 66rpx;
|
||||
height: 66rpx;
|
||||
}
|
||||
|
||||
.foot-fixed .foot-item .foot-icon {
|
||||
width: 47rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.foot-fixed .foot-item .foot-icon2 {
|
||||
width: 66rpx;
|
||||
height: 66rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.foot-icon3{
|
||||
width: 130rpx;
|
||||
height: 130rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
|
||||
.foot-fixed .foot-item .foot-label {
|
||||
margin: 5px 0;
|
||||
}
|
||||
|
||||
.foot-fixed .foot-item .foot-label {
|
||||
height: 15px;
|
||||
line-height: 15px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.foot-fixed .foot-item span {
|
||||
display: block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.foot-fixed .scan-item {
|
||||
position: relative;
|
||||
margin-top: -30rpx;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.foot-fixed .scan-item .foot-icon-box {
|
||||
width: 130rpx;
|
||||
height: 130rpx;
|
||||
background: #fff;
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 0 20rpx rgba(255, 77, 79, 0.5);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-bottom: -20rpx;
|
||||
}
|
||||
|
||||
.foot-fixed .scan-item .foot-icon {
|
||||
width: 130rpx;
|
||||
height: 130rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.foot-fixed .scan-item .foot-label {
|
||||
margin-top: 10rpx;
|
||||
color: #FF4D4F;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* 自定义导航栏 */
|
||||
.nav-box {
|
||||
|
||||
@ -1,141 +1,202 @@
|
||||
<template>
|
||||
<view class="foot-fixed">
|
||||
<view v-for="(item, index) in navList" :key='index'>
|
||||
<view id="navIndex" :style="{width:foot_width}" @click="jump" :data-idx="index" :data-url="item.url"
|
||||
class="foot-item">
|
||||
<view class="foot-fixed">
|
||||
<view v-for="(item, index) in navList" :key="index">
|
||||
<view
|
||||
id="navIndex"
|
||||
:style="{ width: foot_width }"
|
||||
@click="jump"
|
||||
:data-idx="index"
|
||||
:data-url="item.url"
|
||||
:class="{ 'foot-item': true, 'scan-item': item.isScan }"
|
||||
>
|
||||
<view class="foot-icon-box">
|
||||
<image
|
||||
class="foot-icon"
|
||||
:src="item.photo"
|
||||
mode="widthFix"
|
||||
v-if="current != index"
|
||||
:style="{
|
||||
width: item.photo.includes('footer_localLife.png')
|
||||
? '70rpx'
|
||||
: '',
|
||||
}"
|
||||
></image>
|
||||
<image
|
||||
:class="{ 'foot-icon3': item.photo.includes('footer_richScan.png'), 'foot-icon2': !item.photo.includes('footer_richScan.png') }"
|
||||
:src="item.photoAc"
|
||||
mode="widthFix"
|
||||
v-if="current == index"
|
||||
></image>
|
||||
</view>
|
||||
|
||||
<view class="foot-icon-box">
|
||||
<image class="foot-icon" :src="item.photo" mode="widthFix" v-if="current != index"></image>
|
||||
<image class="foot-icon2" :src="item.photoAc" mode="widthFix" v-if="current == index"></image>
|
||||
</view>
|
||||
|
||||
|
||||
<text class="foot-label" id="navIndexLabel">{{item.nav_name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<text class="foot-label" id="navIndexLabel">{{ item.nav_name }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "nav",
|
||||
props:{
|
||||
current:{
|
||||
type:Number,
|
||||
default: 0,
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
navList: [
|
||||
{
|
||||
photo:"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_home.png",
|
||||
photoAc:"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_homeAc.png",
|
||||
nav_name:"首页",
|
||||
url:"/pages/index/index"
|
||||
},
|
||||
{
|
||||
photo:"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_community.png",
|
||||
photoAc:"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_communityAc.png",
|
||||
nav_name:"我的小区",
|
||||
url:"/packages/community/index/index"
|
||||
},
|
||||
{
|
||||
photo:"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_shop.png",
|
||||
photoAc:"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_shopAc.png",
|
||||
nav_name:"优选商城",
|
||||
url:"/packages/shop/index/index"
|
||||
},
|
||||
{
|
||||
photo:"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_door.png",
|
||||
photoAc:"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_communityAc.png",
|
||||
nav_name:"到家服务",
|
||||
url:"/packages/homeServer/index/index"
|
||||
},
|
||||
{
|
||||
photo:"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_mine.png",
|
||||
photoAc:"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_mineAc.png",
|
||||
nav_name:"我的",
|
||||
url:"/pages/user/index"
|
||||
},
|
||||
],
|
||||
foot_width: '20%',
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
getFootnav() {
|
||||
let _that = this;
|
||||
uni.request({
|
||||
url: 'https://zhsq.hshuishang.com/Miniapi/Index/footer_nav_list',
|
||||
method: 'post',
|
||||
header: {
|
||||
'Content-type': 'application/x-www-form-urlencoded'
|
||||
},
|
||||
data: {},
|
||||
dataType: 'json',
|
||||
success: (result) => {
|
||||
result.data[0].url = "/pages/index/index"
|
||||
result.data[1].url = "/pages/device/device"
|
||||
result.data[2].nav_name = "手机通行"
|
||||
result.data[2].url = "/pages/phoneGo/phoneGo"
|
||||
export default {
|
||||
name: "nav",
|
||||
props: {
|
||||
current: {
|
||||
type: Number,
|
||||
default: 0,
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
foot_width() {
|
||||
// 动态计算导航项宽度,确保均匀分布
|
||||
return (100 / this.navList.length).toFixed(2) + '%';
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
navList: [
|
||||
{
|
||||
photo:
|
||||
"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_home.png",
|
||||
photoAc:
|
||||
"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_homeAc.png",
|
||||
nav_name: "智慧首页",
|
||||
url: "/pages/index/index",
|
||||
},
|
||||
{
|
||||
photo:
|
||||
"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_facility.png",
|
||||
photoAc:
|
||||
"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_facilityAc.png",
|
||||
nav_name: "智能设备",
|
||||
url: "",
|
||||
},
|
||||
{
|
||||
photo:
|
||||
"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_richScan.png",
|
||||
photoAc:
|
||||
"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_richScan.png",
|
||||
url: "",
|
||||
isScan: true,
|
||||
},
|
||||
{
|
||||
photo:
|
||||
"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_community.png",
|
||||
photoAc:
|
||||
"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_communityAc.png",
|
||||
nav_name: "我的小区",
|
||||
url: "/packages/community/index/index",
|
||||
},
|
||||
// {
|
||||
// photo: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_localLife.png",
|
||||
// photoAc: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_localLifeAc.png",
|
||||
// nav_name: "本地生活",
|
||||
// url: "/packages/localLife/index/index",
|
||||
// },
|
||||
// {
|
||||
// photo:
|
||||
// "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_shop.png",
|
||||
// photoAc:
|
||||
// "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_shopAc.png",
|
||||
// nav_name: "优选商城",
|
||||
// url: "/packages/shop/index/index",
|
||||
// },
|
||||
// {
|
||||
// photo:
|
||||
// "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_door.png",
|
||||
// photoAc:
|
||||
// "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_communityAc.png",
|
||||
// nav_name: "到家服务",
|
||||
// url: "/packages/homeServer/index/index",
|
||||
// },
|
||||
{
|
||||
photo:
|
||||
"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_mine.png",
|
||||
photoAc:
|
||||
"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_mineAc.png",
|
||||
nav_name: "个人中心",
|
||||
url: "/pages/user/index",
|
||||
},
|
||||
],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getFootnav() {
|
||||
let _that = this;
|
||||
uni.request({
|
||||
url: "https://zhsq.hshuishang.com/Miniapi/Index/footer_nav_list",
|
||||
method: "post",
|
||||
header: {
|
||||
"Content-type": "application/x-www-form-urlencoded",
|
||||
},
|
||||
data: {},
|
||||
dataType: "json",
|
||||
success: (result) => {
|
||||
result.data[0].url = "/pages/index/index";
|
||||
result.data[1].url = "/pages/device/device";
|
||||
result.data[2].nav_name = "手机通行";
|
||||
result.data[2].url = "/pages/phoneGo/phoneGo";
|
||||
|
||||
result.data[3].url = `/packages/community/index/index`
|
||||
result.data[4].url = "/pages/user/index"
|
||||
result.data[3].url = `/packages/community/index/index`;
|
||||
result.data[4].url = "/pages/user/index";
|
||||
|
||||
result.data.splice(1, 2);
|
||||
let footWidth = (100 / result.data.length).toFixed(2) + '%';
|
||||
this.navList = result.data;
|
||||
this.foot_width = footWidth;
|
||||
},
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
//暂未开通
|
||||
NotOpen() {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '此功能暂未开通!',
|
||||
showCancel: false,
|
||||
complete: (res) => {
|
||||
if (res.cancel) {
|
||||
result.data.splice(1, 2);
|
||||
let footWidth = (100 / result.data.length).toFixed(2) + "%";
|
||||
this.navList = result.data;
|
||||
this.foot_width = footWidth;
|
||||
},
|
||||
});
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
//暂未开通
|
||||
NotOpen() {
|
||||
uni.showModal({
|
||||
title: "提示",
|
||||
content: "此功能暂未开通!",
|
||||
showCancel: false,
|
||||
complete: (res) => {
|
||||
if (res.cancel) {
|
||||
}
|
||||
},
|
||||
});
|
||||
},
|
||||
|
||||
jump(e) {
|
||||
const url = e.currentTarget.dataset.url;
|
||||
// 检查url是否存在且不为空
|
||||
if (!url || url.trim() === '') {
|
||||
this.NotOpen();
|
||||
return;
|
||||
}
|
||||
|
||||
jump(e) {
|
||||
const ctoken = uni.getStorageSync('ctoken');
|
||||
const authen = ['/pages/index/index', '/pages/user/index','/pages/user/index'];
|
||||
// 除首页及个人中心页不需要鉴定ctoken, 其他tab页均需存在登录态才可访问
|
||||
if (authen.includes(e.currentTarget.dataset.url)) {
|
||||
uni.redirectTo({
|
||||
url: e.currentTarget.dataset.url,
|
||||
})
|
||||
return
|
||||
}
|
||||
if (!ctoken) {
|
||||
uni.redirectTo({
|
||||
url: '/pages/login/login',
|
||||
})
|
||||
return;
|
||||
}
|
||||
const ctoken = uni.getStorageSync("ctoken");
|
||||
const authen = [
|
||||
"/pages/index/index",
|
||||
"/pages/user/index",
|
||||
];
|
||||
// 除首页及个人中心页不需要鉴定ctoken, 其他tab页均需存在登录态才可访问
|
||||
if (authen.includes(url)) {
|
||||
uni.redirectTo({
|
||||
url: url,
|
||||
});
|
||||
return;
|
||||
}
|
||||
if (!ctoken) {
|
||||
uni.redirectTo({
|
||||
url: "/pages/login/login",
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
uni.redirectTo({
|
||||
url: e.currentTarget.dataset.url,
|
||||
})
|
||||
},
|
||||
|
||||
|
||||
},
|
||||
mounted() {
|
||||
// this.getFootnav();
|
||||
}
|
||||
}
|
||||
uni.redirectTo({
|
||||
url: url,
|
||||
});
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
// this.getFootnav();
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./nav.css");
|
||||
@import url("./nav.css");
|
||||
</style>
|
||||
@ -1,153 +1,169 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<div class="line"></div>
|
||||
<view class="main">
|
||||
<view class="table">
|
||||
<view class="label">房产</view>
|
||||
<view class="flexBox" @click="choseCommunity">
|
||||
<input type="text" v-model="changeComm" disabled placeholder="请选择房产">
|
||||
<u-icon name="arrow-right"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="table">
|
||||
<view class="label">姓名</view>
|
||||
<input type="text" v-model="nameVal" placeholder="请输入姓名">
|
||||
</view>
|
||||
<view class="table">
|
||||
<view class="label">手机</view>
|
||||
<input type="text" v-model="phoneVal" placeholder="请输入手机号">
|
||||
</view>
|
||||
<view class="table">
|
||||
<view class="label">身份</view>
|
||||
<view class="container">
|
||||
<div class="line"></div>
|
||||
<view class="main">
|
||||
<view class="table">
|
||||
<view class="label">房产</view>
|
||||
<view class="flexBox" @click="choseCommunity">
|
||||
<input
|
||||
type="text"
|
||||
v-model="changeComm"
|
||||
disabled
|
||||
placeholder="请选择房产"
|
||||
/>
|
||||
<u-icon name="arrow-right"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="table">
|
||||
<view class="label">姓名</view>
|
||||
<input type="text" v-model="nameVal" placeholder="请输入姓名" />
|
||||
</view>
|
||||
<view class="table">
|
||||
<view class="label">手机</view>
|
||||
<input type="text" v-model="phoneVal" placeholder="请输入手机号" />
|
||||
</view>
|
||||
<view class="table">
|
||||
<view class="label">身份</view>
|
||||
|
||||
<view class="flexBox" @click="chooseIdentity">
|
||||
<input type="number" v-model="selectedLabel" disabled placeholder="请选择身份">
|
||||
<u-icon name="arrow-right"></u-icon>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<!-- <view class="tip">
|
||||
<view class="flexBox" @click="chooseIdentity">
|
||||
<input
|
||||
type="number"
|
||||
v-model="selectedLabel"
|
||||
disabled
|
||||
placeholder="请选择身份"
|
||||
/>
|
||||
<u-icon name="arrow-right"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="tip">
|
||||
注意:业主为在物业登记在册的人员,需经过物业审 核确认后,即可成为该房产的业主。如需帮助可与物 业或平台联系。
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="btn" @click="headerSubmitClick">确定</view>
|
||||
</view>
|
||||
<view class="btn" @click="headerSubmitClick">确定</view>
|
||||
|
||||
<u-popup :show="show" @close="close" mode="bottom" customStyle="width: 500rpx;" round="20rpx">
|
||||
<u-picker :show="show" :columns="columns" keyName="label" @cancel="close" @confirm="confirm"></u-picker>
|
||||
</u-popup>
|
||||
</view>
|
||||
<u-popup
|
||||
:show="show"
|
||||
@close="close"
|
||||
mode="bottom"
|
||||
customStyle="width: 500rpx;"
|
||||
round="20rpx"
|
||||
>
|
||||
<u-picker
|
||||
:show="show"
|
||||
:columns="columns"
|
||||
keyName="label"
|
||||
@cancel="close"
|
||||
@confirm="confirm"
|
||||
></u-picker>
|
||||
</u-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
request,
|
||||
NavgateTo,
|
||||
isPhone
|
||||
} from '../../../utils';
|
||||
import {
|
||||
apiArr
|
||||
} from '../../../api/community';
|
||||
export default {
|
||||
onBackPress(options) {
|
||||
console.log('from:' + options.from)
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
communityId: '',
|
||||
roomId: '',
|
||||
managementMobile: '',
|
||||
show: false,
|
||||
changeComm: '',
|
||||
columns: [
|
||||
[{
|
||||
label: "业主",
|
||||
value: "1"
|
||||
},
|
||||
{
|
||||
label: "家属",
|
||||
value: "2"
|
||||
},
|
||||
{
|
||||
label: "租客",
|
||||
value: "3"
|
||||
},
|
||||
{
|
||||
label: "访客",
|
||||
value: "4"
|
||||
},
|
||||
]
|
||||
],
|
||||
selectedValue: '',
|
||||
selectedLabel: '',
|
||||
nameVal: '',
|
||||
phoneVal: '',
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
close() {
|
||||
this.show = false
|
||||
},
|
||||
chooseIdentity() {
|
||||
this.show = true
|
||||
console.log()
|
||||
},
|
||||
confirm(selected) {
|
||||
console.log(selected.value[0].value)
|
||||
this.selectedValue = selected.value[0].value
|
||||
this.selectedLabel = selected.value[0].label
|
||||
this.show = false
|
||||
},
|
||||
headerCloseClick() {
|
||||
this.show = false;
|
||||
},
|
||||
import { request, NavgateTo, isPhone } from "../../../utils";
|
||||
import { apiArr } from "../../../api/community";
|
||||
export default {
|
||||
onBackPress(options) {
|
||||
console.log("from:" + options.from);
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
communityId: "",
|
||||
roomId: "",
|
||||
managementMobile: "",
|
||||
show: false,
|
||||
changeComm: "",
|
||||
columns: [
|
||||
[
|
||||
{
|
||||
label: "业主",
|
||||
value: "1",
|
||||
},
|
||||
{
|
||||
label: "家属",
|
||||
value: "2",
|
||||
},
|
||||
{
|
||||
label: "租客",
|
||||
value: "3",
|
||||
},
|
||||
{
|
||||
label: "访客",
|
||||
value: "4",
|
||||
},
|
||||
],
|
||||
],
|
||||
selectedValue: "",
|
||||
selectedLabel: "",
|
||||
nameVal: "",
|
||||
phoneVal: "",
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
close() {
|
||||
this.show = false;
|
||||
},
|
||||
chooseIdentity() {
|
||||
this.show = true;
|
||||
console.log();
|
||||
},
|
||||
confirm(selected) {
|
||||
console.log(selected.value[0].value);
|
||||
this.selectedValue = selected.value[0].value;
|
||||
this.selectedLabel = selected.value[0].label;
|
||||
this.show = false;
|
||||
},
|
||||
headerCloseClick() {
|
||||
this.show = false;
|
||||
},
|
||||
|
||||
headerInputClick(e) {
|
||||
const {
|
||||
name
|
||||
} = e.currentTarget.dataset;
|
||||
const {
|
||||
value
|
||||
} = e.detail;
|
||||
this[name] = value;
|
||||
},
|
||||
async headerSubmitClick() {
|
||||
await request(apiArr.create, "POST", {
|
||||
community_id: parseInt(this.communityId),
|
||||
room_id: parseInt(this.roomId),
|
||||
user_id: uni.getStorageSync('userId'),
|
||||
name: this.nameVal, // 姓名
|
||||
mobile: this.phoneVal, // 手机号
|
||||
type: parseInt(this.selectedValue), // 身份
|
||||
id_type: 1
|
||||
}).then(res => {
|
||||
console.log(res)
|
||||
uni.showToast({
|
||||
title: '创建成功',
|
||||
icon: "none",
|
||||
duration: 2000
|
||||
});
|
||||
NavgateTo("/packages/community/myCommunity/index")
|
||||
})
|
||||
},
|
||||
choseCommunity() {
|
||||
NavgateTo("/packages/community/choseCommunity/index")
|
||||
},
|
||||
headerInputClick(e) {
|
||||
const { name } = e.currentTarget.dataset;
|
||||
const { value } = e.detail;
|
||||
this[name] = value;
|
||||
},
|
||||
async headerSubmitClick() {
|
||||
await request(apiArr.create, "POST", {
|
||||
community_id: parseInt(this.communityId),
|
||||
room_id: parseInt(this.roomId),
|
||||
user_id: uni.getStorageSync("userId"),
|
||||
name: this.nameVal, // 姓名
|
||||
mobile: this.phoneVal, // 手机号
|
||||
type: parseInt(this.selectedValue), // 身份
|
||||
id_type: 1,
|
||||
}).then((res) => {
|
||||
console.log(res);
|
||||
uni.showToast({
|
||||
title: "提交成功请等待物业审核!",
|
||||
icon: "none",
|
||||
duration: 1500,
|
||||
});
|
||||
// 提示显示后延迟跳转
|
||||
setTimeout(() => {
|
||||
NavgateTo("/packages/community/myCommunity/index");
|
||||
}, 1500);
|
||||
});
|
||||
},
|
||||
choseCommunity() {
|
||||
NavgateTo("/packages/community/choseCommunity/index");
|
||||
},
|
||||
},
|
||||
|
||||
},
|
||||
onLoad(options) {
|
||||
console.log("接收到的参数:", options);
|
||||
this.communityId = options.community_id
|
||||
? decodeURIComponent(options.community_id)
|
||||
: "";
|
||||
this.roomId = options.room_id ? decodeURIComponent(options.room_id) : "";
|
||||
this.changeComm = options.changeVal
|
||||
? decodeURIComponent(options.changeVal)
|
||||
: "";
|
||||
},
|
||||
|
||||
onLoad(options) {
|
||||
console.log("接收到的参数:", options);
|
||||
this.communityId = options.community_id ? decodeURIComponent(options.community_id) : ''
|
||||
this.roomId = options.room_id ? decodeURIComponent(options.room_id) : ''
|
||||
this.changeComm = options.changeVal ? decodeURIComponent(options.changeVal) : ''
|
||||
},
|
||||
|
||||
onReachBottom() {
|
||||
|
||||
},
|
||||
}
|
||||
onReachBottom() {},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
@ -98,7 +98,7 @@ image {
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
background-color: #fff;
|
||||
/* background-color: #fff; */
|
||||
padding-bottom: 200rpx;
|
||||
margin-top: 20rpx;
|
||||
padding-top: 111rpx;
|
||||
|
||||
@ -1,39 +1,42 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<div class="currentAdd">
|
||||
<div class="currentAdd_left">{{city.region}}</div>
|
||||
<div class="currentAdd_right" @click="changeAddress">
|
||||
切换城市
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_choseAddress.png"></image>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="currentAdd">
|
||||
<div class="currentAdd_left">{{ city.region }}</div>
|
||||
<div class="currentAdd_right" @click="changeAddress">
|
||||
切换城市
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_choseAddress.png"></image>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="communityBox" v-if="step == 1">
|
||||
<div class="search">
|
||||
<input type="text" placeholder="请输入小区名称" v-model="communityName">
|
||||
<image @click="searchByName" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png"></image>
|
||||
</div>
|
||||
<div class="communityBox" v-if="step == 1">
|
||||
<div class="search">
|
||||
<input type="text" placeholder="请输入小区名称" v-model="communityName" />
|
||||
<image @click="searchByName"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png">
|
||||
</image>
|
||||
</div>
|
||||
|
||||
<!-- @click="chooseCommunity(item)" -->
|
||||
<div class="communityList">
|
||||
<div class="communityItem" v-for="item in communityList" :key="item.community_id" @click="nextStep(item)">
|
||||
<div class="communityItem_left">
|
||||
<div class="communityItem_tit">{{item.name}}</div>
|
||||
<div class="communityItem_address">{{item.addr}}</div>
|
||||
</div>
|
||||
<div class="communityItem_right">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communityMore.png"></image>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- @click="chooseCommunity(item)" -->
|
||||
<div class="communityList">
|
||||
<div class="communityItem" v-for="item in communityList" :key="item.community_id" @click="nextStep(item)">
|
||||
<div class="communityItem_left">
|
||||
<div class="communityItem_tit">{{ item.name }}</div>
|
||||
<div class="communityItem_address">{{ item.addr }}</div>
|
||||
</div>
|
||||
<div class="communityItem_right">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communityMore.png">
|
||||
</image>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="empty" v-if="!communityList">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_noSearch.png"></image>
|
||||
<span>未找到相关信息的小区</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="empty" v-if="communityList.length == 0">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_noSearch.png"></image>
|
||||
<span>未找到相关信息的小区</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- <div class="communityBox" v-if="step == 2">
|
||||
<!-- <div class="communityBox" v-if="step == 2">
|
||||
<div class="search">
|
||||
<input type="text" placeholder="请输入楼栋名称">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png"></image>
|
||||
@ -51,235 +54,270 @@
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<div class="communityBox" v-if="step == 2">
|
||||
<div class="search">
|
||||
<input v-model="searchQuery" type="text" placeholder="请输入楼栋名称">
|
||||
<image @click="searchName" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png"></image>
|
||||
</div>
|
||||
<div class="communityBox" v-if="step == 2">
|
||||
<div class="search">
|
||||
<input v-model="searchQuery" type="text" placeholder="请输入楼栋名称" />
|
||||
<image @click="searchName"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png">
|
||||
</image>
|
||||
</div>
|
||||
|
||||
<div class="floorList">
|
||||
<div @click="nextStep(item)" class="floorItem" v-for="(item, index) in filteredFloorsList" :key="index">
|
||||
{{ item.label }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="floorList">
|
||||
<div @click="nextStep(item, index)" :class="{ active: index === selectedFloorIndex }" class="floorItem"
|
||||
v-for="(item, index) in filteredFloorsList" :key="index">
|
||||
{{ item.label }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="empty" v-if="filteredFloorsList.length === 0">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_noSearch.png"></image>
|
||||
<span>未找到相关信息的楼栋</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="empty" v-if="filteredFloorsList.length === 0">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_noSearch.png"></image>
|
||||
<span>未找到相关信息的楼栋</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="communityBox" v-if="step == 3">
|
||||
<div class="search">
|
||||
<input v-model="searchQuery" type="text" placeholder="请输入楼层名称">
|
||||
<image @click="searchName" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png"></image>
|
||||
</div>
|
||||
<div class="communityBox" v-if="step == 3">
|
||||
<div class="search">
|
||||
<input v-model="searchQuery" type="text" placeholder="请输入楼层名称" />
|
||||
<image @click="searchName"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png">
|
||||
</image>
|
||||
</div>
|
||||
|
||||
<div class="roomList">
|
||||
<!-- <div class="roomItem" v-for="(item,index) in 5" :class="index == 1?'active2':''"> -->
|
||||
<div @click="nextStep(item)" class="roomItem" v-for="(item,index) in filteredFloorsList" :key="index">
|
||||
{{item.label}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="roomList">
|
||||
<!-- <div class="roomItem" v-for="(item,index) in 5" :class="index == 1?'active2':''"> -->
|
||||
<div @click="nextStep(item, index, 'room')" :class="{ active2: index === selectedRoomIndex }" class="roomItem"
|
||||
v-for="(item, index) in filteredFloorsList" :key="index">
|
||||
{{ item.label }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="empty" v-if="filteredFloorsList.length === 0">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_noSearch.png"></image>
|
||||
<span>未找到相关信息的楼层</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="empty" v-if="filteredFloorsList.length === 0">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_noSearch.png"></image>
|
||||
<span>未找到相关信息的楼层</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="communityBox" v-if="step == 4">
|
||||
<div class="search">
|
||||
<input v-model="searchQuery" type="text" placeholder="请输入房间名称">
|
||||
<image @click="searchName" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png"></image>
|
||||
</div>
|
||||
<div class="communityBox" v-if="step == 4">
|
||||
<div class="search">
|
||||
<input v-model="searchQuery" type="text" placeholder="请输入房间名称" />
|
||||
<image @click="searchName"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png">
|
||||
</image>
|
||||
</div>
|
||||
|
||||
<div class="roomList">
|
||||
<!-- <div class="roomItem" v-for="(item,index) in 5" :class="index == 1?'active2':''"> -->
|
||||
<div @click="nextStep(item)" class="roomItem" v-for="(item,index) in filteredFloorsList" :key="index">
|
||||
{{item.label}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="roomList">
|
||||
<!-- <div class="roomItem" v-for="(item,index) in 5" :class="index == 1?'active2':''"> -->
|
||||
<div @click="nextStep(item, index, 'room')" :class="{ active2: index === selectedRoomIndex }" class="roomItem"
|
||||
v-for="(item, index) in filteredFloorsList" :key="index">
|
||||
{{ item.label }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="empty" v-if="filteredFloorsList.length === 0">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_noSearch.png"></image>
|
||||
<span>未找到相关信息的房间</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="empty" v-if="filteredFloorsList.length === 0">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_noSearch.png"></image>
|
||||
<span>未找到相关信息的房间</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<areaPopup :show="show" @selectArea="selectArea" @close="close"></areaPopup>
|
||||
|
||||
<areaPopup :show="show" @selectArea="selectArea" @close="close"></areaPopup>
|
||||
|
||||
<div class="dialogBox" v-if="dialogBoxShow">
|
||||
<div class="dialogBoxCon">
|
||||
<div class="dialogBoxCon1">确认选择</div>
|
||||
<div class="dialogBoxCon2">{{cName}}</div>
|
||||
<div class="dialogBoxCon3">{{facilityName + fName + rName}}</div>
|
||||
<div class="dialogBoxConBtnList">
|
||||
<div class="dialogBoxConBtnItem1" @click="dialogBoxShow = false">取消</div>
|
||||
<div class="dialogBoxConBtnItem2" @click="confirmComm">确定</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="dialogBox" v-if="dialogBoxShow">
|
||||
<div class="dialogBoxCon">
|
||||
<div class="dialogBoxCon1">确认选择</div>
|
||||
<div class="dialogBoxCon2">{{ cName }}</div>
|
||||
<div class="dialogBoxCon3">{{ facilityName + fName + rName }}</div>
|
||||
<div class="dialogBoxConBtnList">
|
||||
<div class="dialogBoxConBtnItem1" @click="dialogBoxShow = false">
|
||||
取消
|
||||
</div>
|
||||
<div class="dialogBoxConBtnItem2" @click="confirmComm">确定</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
apiArr
|
||||
} from '../../../api/community';
|
||||
import {
|
||||
request,
|
||||
picUrl,
|
||||
uniqueByField,
|
||||
menuButtonInfo,
|
||||
NavgateTo
|
||||
} from '../../../utils';
|
||||
import { apiArr } from "../../../api/community";
|
||||
import {
|
||||
request,
|
||||
picUrl,
|
||||
uniqueByField,
|
||||
menuButtonInfo,
|
||||
NavgateTo,
|
||||
} from "../../../utils";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
step: "1",
|
||||
communityName: '',
|
||||
cName: '',
|
||||
fName: '',
|
||||
communityId: '',
|
||||
communityList: [],
|
||||
facilityName: '',
|
||||
// foloorList: [],
|
||||
// floorsList: [],
|
||||
rName: '',
|
||||
roomId: '',
|
||||
// roomList: [],
|
||||
page_num: 1,
|
||||
page_size: 10,
|
||||
dialogBoxShow: false,
|
||||
searchQuery: '',
|
||||
filteredFloorsList: [],
|
||||
searchList: [],
|
||||
city: uni.getStorageSync('location'),
|
||||
currentCommunity:""
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
changeAddress() {
|
||||
this.show = true
|
||||
},
|
||||
close() {
|
||||
this.show = false
|
||||
},
|
||||
selectArea(val) {
|
||||
console.log(val);
|
||||
this.city = {
|
||||
region: val.confirmDist.ad_name.split(',').join(''),
|
||||
...val.confirmDist
|
||||
}
|
||||
this.searchByName();
|
||||
this.show = false
|
||||
},
|
||||
async searchByName() {
|
||||
console.log(this.communityName,'zzz')
|
||||
await request(apiArr.getAllList, "POST", {
|
||||
community_id: '',
|
||||
name: this.communityName,
|
||||
comm_code: '',
|
||||
ad_code: this.city.ad_code ? this.city.ad_code : uni.getStorageSync('ad_code'),
|
||||
page_num: this.page_num,
|
||||
page_size: this.page_size
|
||||
}).then(res => {
|
||||
console.log(res.rows)
|
||||
this.communityList = res.rows
|
||||
})
|
||||
},
|
||||
async nextStep(item) {
|
||||
this.communityId = item.community_id ? item.community_id : this.communityId;
|
||||
this.facilityName = this.facilityName ? this.facilityName : item.label;
|
||||
this.fName = this.step == 4 ? this.fName : (this.facilityName ? item.label : '')
|
||||
await request(apiArr.commRoomSelect, "POST", {
|
||||
community_ids: item.community_id ? item.community_id : this.communityId,
|
||||
facility_names: this.facilityName,
|
||||
floors: this.facilityName ? (this.facilityName == this.fName ? '' : item.label) : '',
|
||||
}).then(res => {
|
||||
this.filteredFloorsList = this.step == 4 ? this.filteredFloorsList : res.rows
|
||||
this.searchList = res.rows
|
||||
this.searchQuery = ''
|
||||
if (this.step == '1') {
|
||||
this.step = '2';
|
||||
this.cName = item.name;
|
||||
// this.foloorList = res.rows
|
||||
} else if (this.step == '2') {
|
||||
this.step = '3';
|
||||
// this.floorsList = res.rows
|
||||
} else if (this.step == '3') {
|
||||
console.log(item.label);
|
||||
this.fName = item.label;
|
||||
// this.roomList = res.rows
|
||||
this.step = '4';
|
||||
} else {
|
||||
this.dialogBoxShow = true;
|
||||
this.rName = item.label
|
||||
this.romId = item.value
|
||||
}
|
||||
})
|
||||
},
|
||||
searchName() {
|
||||
// 根据输入框内容进行模糊查询
|
||||
this.filteredFloorsList = this.searchList.filter(item =>
|
||||
item.label.includes(this.searchQuery)
|
||||
);
|
||||
},
|
||||
confirmComm() {
|
||||
const params = {
|
||||
changeVal: `${this.cName}${this.facilityName}${this.fName}${this.rName}`,
|
||||
community_id: this.communityId,
|
||||
room_id: this.romId
|
||||
};
|
||||
console.log(params)
|
||||
// 手动创建查询字符串
|
||||
function createQueryString(params) {
|
||||
return Object.keys(params)
|
||||
.map(key => `${encodeURIComponent(key)}=${encodeURIComponent(params[key])}`)
|
||||
.join('&');
|
||||
}
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
selectedFloorIndex: -1,
|
||||
selectedRoomIndex: -1,
|
||||
show: false,
|
||||
step: "1",
|
||||
communityName: "",
|
||||
cName: "",
|
||||
fName: "",
|
||||
communityId: "",
|
||||
communityList: [],
|
||||
facilityName: "",
|
||||
// foloorList: [],
|
||||
// floorsList: [],
|
||||
rName: "",
|
||||
roomId: "",
|
||||
// roomList: [],
|
||||
page_num: 1,
|
||||
page_size: 10,
|
||||
dialogBoxShow: false,
|
||||
searchQuery: "",
|
||||
filteredFloorsList: [],
|
||||
searchList: [],
|
||||
city: uni.getStorageSync("location"),
|
||||
currentCommunity: "",
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
changeAddress() {
|
||||
this.show = true;
|
||||
},
|
||||
close() {
|
||||
this.show = false;
|
||||
},
|
||||
selectArea(val) {
|
||||
console.log(val);
|
||||
this.city = {
|
||||
region: val.confirmDist.ad_name.split(",").join(""),
|
||||
...val.confirmDist,
|
||||
};
|
||||
this.searchByName();
|
||||
this.show = false;
|
||||
},
|
||||
async searchByName() {
|
||||
console.log(this.communityName, "zzz");
|
||||
await request(apiArr.getAllList, "POST", {
|
||||
community_id: "",
|
||||
name: this.communityName,
|
||||
comm_code: "",
|
||||
ad_code: this.city.ad_code
|
||||
? this.city.ad_code
|
||||
: uni.getStorageSync("ad_code"),
|
||||
page_num: this.page_num,
|
||||
page_size: this.page_size,
|
||||
}).then((res) => {
|
||||
console.log(res.rows);
|
||||
this.communityList = res.rows;
|
||||
});
|
||||
},
|
||||
async nextStep(item, index, type = "") {
|
||||
if (type === "room") {
|
||||
this.selectedRoomIndex = index;
|
||||
} else {
|
||||
this.selectedFloorIndex = index;
|
||||
}
|
||||
this.communityId = item.community_id
|
||||
? item.community_id
|
||||
: this.communityId;
|
||||
this.facilityName = this.facilityName ? this.facilityName : item.label;
|
||||
this.fName =
|
||||
this.step == 4 ? this.fName : this.facilityName ? item.label : "";
|
||||
await request(apiArr.commRoomSelect, "POST", {
|
||||
community_ids: [item.community_id ? item.community_id : this.communityId],
|
||||
facility_names: this.facilityName ? [this.facilityName] : [],
|
||||
|
||||
// 拼接路径和参数
|
||||
const targetPath = "/packages/community/addCommunity/index";
|
||||
const queryString = createQueryString(params);
|
||||
const fullPath = `${targetPath}?${queryString}`;
|
||||
floors: this.facilityName
|
||||
? this.facilityName == this.fName
|
||||
? ""
|
||||
: [item.label]
|
||||
: "",
|
||||
}).then((res) => {
|
||||
// 对楼层数据进行从大到小排序
|
||||
if (this.step != 4) {
|
||||
res.rows.sort((a, b) => {
|
||||
// 提取楼层数字
|
||||
const floorA = parseInt(a.label.replace(/[^\d]/g, ''));
|
||||
const floorB = parseInt(b.label.replace(/[^\d]/g, ''));
|
||||
return floorA - floorB;
|
||||
});
|
||||
}
|
||||
this.filteredFloorsList = this.step == 4 ? this.filteredFloorsList : res.rows;
|
||||
this.searchList = res.rows;
|
||||
this.searchQuery = "";
|
||||
if (this.step == "1") {
|
||||
this.step = "2";
|
||||
this.cName = item.name;
|
||||
// this.foloorList = res.rows
|
||||
} else if (this.step == "2") {
|
||||
this.step = "3";
|
||||
// this.floorsList = res.rows
|
||||
} else if (this.step == "3") {
|
||||
console.log(item.label);
|
||||
this.fName = item.label.includes("层") ? item.label : item.label + "层";
|
||||
// this.roomList = res.rows
|
||||
this.step = "4";
|
||||
} else {
|
||||
this.dialogBoxShow = true;
|
||||
this.rName = item.label;
|
||||
this.romId = item.value;
|
||||
}
|
||||
});
|
||||
},
|
||||
searchName() {
|
||||
// 根据输入框内容进行模糊查询
|
||||
this.filteredFloorsList = this.searchList.filter((item) =>
|
||||
item.label.includes(this.searchQuery)
|
||||
);
|
||||
},
|
||||
confirmComm() {
|
||||
const params = {
|
||||
changeVal: `${this.cName}${this.facilityName}${this.fName}${this.rName}`,
|
||||
community_id: this.communityId,
|
||||
room_id: this.romId,
|
||||
};
|
||||
console.log(params);
|
||||
// 手动创建查询字符串
|
||||
function createQueryString(params) {
|
||||
return Object.keys(params)
|
||||
.map(
|
||||
(key) =>
|
||||
`${encodeURIComponent(key)}=${encodeURIComponent(params[key])}`
|
||||
)
|
||||
.join("&");
|
||||
}
|
||||
|
||||
// 调用导航方法
|
||||
NavgateTo(fullPath);
|
||||
},
|
||||
// 拼接路径和参数
|
||||
const targetPath = "/packages/community/addCommunity/index";
|
||||
const queryString = createQueryString(params);
|
||||
const fullPath = `${targetPath}?${queryString}`;
|
||||
|
||||
//选择小区
|
||||
chooseCommunity(e){
|
||||
this.currentCommunity = e
|
||||
|
||||
this.getRoomSelect()
|
||||
},
|
||||
//选择楼栋
|
||||
getRoomSelect(){
|
||||
request(apiArr.commRoomSelect,"POST",{
|
||||
community_ids:this.currentCommunity.community_id,
|
||||
}).then(res=>{
|
||||
console.log(res);
|
||||
this.step = 2
|
||||
})
|
||||
},
|
||||
},
|
||||
// 调用导航方法
|
||||
NavgateTo(fullPath);
|
||||
},
|
||||
|
||||
onLoad(options) {
|
||||
const meun = menuButtonInfo();
|
||||
this.searchByName()
|
||||
},
|
||||
//选择小区
|
||||
chooseCommunity(e) {
|
||||
this.currentCommunity = e;
|
||||
|
||||
onReachBottom() {
|
||||
this.getRoomSelect();
|
||||
},
|
||||
//选择楼栋
|
||||
getRoomSelect() {
|
||||
request(apiArr.commRoomSelect, "POST", {
|
||||
community_ids: [this.currentCommunity.community_id],
|
||||
}).then((res) => {
|
||||
console.log(res);
|
||||
this.step = 2;
|
||||
});
|
||||
},
|
||||
},
|
||||
|
||||
},
|
||||
}
|
||||
onLoad(options) {
|
||||
const meun = menuButtonInfo();
|
||||
this.searchByName();
|
||||
},
|
||||
|
||||
onReachBottom() { },
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
|
||||
@ -3,6 +3,40 @@ page {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.empty {
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-top: 400rpx;
|
||||
}
|
||||
|
||||
.empty image {
|
||||
width: 340rpx;
|
||||
height: 240rpx;
|
||||
}
|
||||
|
||||
.emptyBtn {
|
||||
width: 400rpx;
|
||||
height: 80rpx;
|
||||
background-color: #ea030d;
|
||||
color: white;
|
||||
align-items: center;
|
||||
margin-top: 400rpx;
|
||||
}
|
||||
|
||||
.emptyBtn2 {
|
||||
width: 400rpx;
|
||||
height: 80rpx;
|
||||
background-color: white;
|
||||
color: #333;
|
||||
align-items: center;
|
||||
margin-top: 50rpx;
|
||||
border: 1rpx solid #333;
|
||||
}
|
||||
|
||||
swiper {
|
||||
height: 100%;
|
||||
}
|
||||
@ -35,8 +69,9 @@ image {
|
||||
.emptyCommunity {
|
||||
font-size: 28rpx;
|
||||
color: #222222;
|
||||
width: 200rpx;
|
||||
width: auto;
|
||||
height: 44rpx;
|
||||
padding: 5rpx 15rpx;
|
||||
background: rgba(255, 255, 255, 0.8);
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
display: flex;
|
||||
@ -104,6 +139,10 @@ image {
|
||||
margin: 0 5rpx;
|
||||
}
|
||||
|
||||
.swiperBox2_img {
|
||||
border-radius: 20rpx 20rpx 0 0;
|
||||
}
|
||||
|
||||
.active {
|
||||
width: 26rpx;
|
||||
}
|
||||
@ -144,7 +183,8 @@ image {
|
||||
margin: 0 auto;
|
||||
margin-top: 40rpx;
|
||||
}
|
||||
.ads_first{
|
||||
|
||||
.ads_first {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
@ -156,13 +196,15 @@ image {
|
||||
height: 100rpx;
|
||||
padding: 0 20rpx;
|
||||
box-sizing: border-box;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.tabItem {
|
||||
font-size: 30rpx;
|
||||
color: #222222;
|
||||
margin-right: 60rpx;
|
||||
height: 42rpx;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.active2 {
|
||||
@ -183,6 +225,10 @@ image {
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.newsList {
|
||||
margin-bottom: 100rpx;
|
||||
}
|
||||
|
||||
.newsItem {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -193,6 +239,10 @@ image {
|
||||
border-bottom: 1rpx solid #EBEBEB;
|
||||
}
|
||||
|
||||
.newsItem:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.newsItem_left {
|
||||
flex: 1;
|
||||
}
|
||||
@ -305,4 +355,8 @@ image {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.grid_Text {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
@ -1,163 +1,110 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<div
|
||||
class="searchBox"
|
||||
:style="{ height: localHeight + 'px', paddingTop: top + 'px' }"
|
||||
>
|
||||
<div class="searchBox_add">
|
||||
<div class="emptyCommunity" @click="addCommunity">
|
||||
{{ communityVal }}
|
||||
</div>
|
||||
<!-- <div class="MyCommunity" v-if="false">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/community/community_mycommunity.png"
|
||||
mode="aspectFill"></image>
|
||||
<span>惠生活</span>
|
||||
<u-icon name="arrow-down" color="#999999" size="28"></u-icon>
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="empty" v-if="communityList.length == 0">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_newEmpty.png" alt="" />
|
||||
<text>当前账户未绑定任何项目房源信息</text>
|
||||
<button class="emptyBtn" @click="addCommunity">新增房产绑定</button>
|
||||
<!-- <button class="emptyBtn2" @click="refresh">刷新</button> -->
|
||||
</div>
|
||||
<div v-else>
|
||||
<div class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
|
||||
<div class="searchBox_add">
|
||||
<div class="emptyCommunity" @click="addCommunity">
|
||||
{{ communityVal }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="swiperBox1">
|
||||
<swiper @animationfinish="swipers" autoplay circular>
|
||||
<swiper-item
|
||||
v-for="(item, index) in bannerList"
|
||||
:key="index"
|
||||
@click="headerServerClick(item)"
|
||||
>
|
||||
<image :src="item.ad_picture" mode="aspectFill" />
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
<div class="swiperBox1">
|
||||
<swiper @animationfinish="swipers" autoplay circular>
|
||||
<swiper-item v-for="(item, index) in bannerList" :key="index" @click="headerServerClick(item)">
|
||||
<image :src="item.ad_picture" mode="aspectFill" />
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
|
||||
<view class="dot">
|
||||
<view
|
||||
:class="['dotItem', currentIdx == index ? 'active' : '']"
|
||||
v-for="(item, index) in bannerList"
|
||||
:key="index"
|
||||
>
|
||||
<view class="dot">
|
||||
<view :class="['dotItem', currentIdx == index ? 'active' : '']" v-for="(item, index) in bannerList"
|
||||
:key="index">
|
||||
</view>
|
||||
</view>
|
||||
</div>
|
||||
|
||||
<div class="swiperBox2">
|
||||
<swiper @animationfinish="swipers" autoplay circular>
|
||||
<swiper-item v-for="(item, index) in streamerList" :key="index" @click="headerServerClick(item)">
|
||||
<image :src="item.ad_picture" mode="aspectFill" class="swiperBox2_img" />
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</div>
|
||||
|
||||
<view class="funcList">
|
||||
<u-grid :col="rowNum" :border="false">
|
||||
<u-grid-item v-for="(item, index) in functionList" @click="jump(item.mini_program_url)" :key="index">
|
||||
<image class="grid_Pic" :src="item.nav_icon" mode=""></image>
|
||||
<text class="grid_Text">{{ item.nav_name }}</text>
|
||||
</u-grid-item>
|
||||
</u-grid>
|
||||
</view>
|
||||
|
||||
<!-- <div class="dot">
|
||||
<div class="dotItem"></div>
|
||||
<div class="dotItem active"></div>
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
<div class="swiperBox2">
|
||||
<swiper @animationfinish="swipers" autoplay circular>
|
||||
<swiper-item
|
||||
v-for="(item, index) in streamerList"
|
||||
:key="index"
|
||||
@click="headerServerClick(item)"
|
||||
>
|
||||
<image :src="item.ad_picture" mode="aspectFill" />
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</div>
|
||||
|
||||
<!-- <div class="funcList">
|
||||
<div class="funcItem" v-for="item in functionList" @click="jump(item.mini_program_url)">
|
||||
<image :src="item.nav_icon"></image>
|
||||
{{ item.nav_name }}
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<view class="funcList">
|
||||
<u-grid :col="rowNum" :border="false">
|
||||
<u-grid-item
|
||||
v-for="(item, index) in functionList"
|
||||
@click="jump(item.mini_program_url)"
|
||||
:key="index"
|
||||
>
|
||||
<image class="grid_Pic" :src="item.nav_icon" mode=""></image>
|
||||
<text>{{ item.nav_name }}</text>
|
||||
</u-grid-item>
|
||||
</u-grid>
|
||||
</view>
|
||||
|
||||
<div
|
||||
v-for="(item, index) in tileList"
|
||||
:key="index"
|
||||
:class="['ads', index == 0 ? 'ads_first' : '']"
|
||||
@click="headerServerClick(item)"
|
||||
>
|
||||
<image :src="item.ad_picture" mode="aspectFill" />
|
||||
</div>
|
||||
|
||||
<div class="tabs">
|
||||
<div
|
||||
v-for="(item, index) in categoryList"
|
||||
:key="index"
|
||||
:class="['tabItem', selectedTab === index ? 'active2' : '']"
|
||||
@click="selectTab(index, item)"
|
||||
>
|
||||
{{ item.category_name }}
|
||||
<div v-for="(item, index) in tileList" :key="index" :class="['ads', index == 0 ? 'ads_first' : '']"
|
||||
@click="headerServerClick(item)">
|
||||
<image :src="item.ad_picture" mode="aspectFill" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="newsList">
|
||||
<div
|
||||
class="newsItem"
|
||||
v-for="item in infoList"
|
||||
@click="detail(item)"
|
||||
:key="item.id"
|
||||
>
|
||||
<div class="newsItem_left">
|
||||
<div class="newsItem_left_tit">{{ item.title }}</div>
|
||||
<div class="newsItem_left_sub">{{ item.author }}</div>
|
||||
<div class="tabs">
|
||||
<div v-for="(item, index) in categoryList" :key="index"
|
||||
:class="['tabItem', selectedTab === index ? 'active2' : '']" @click="selectTab(index, item)">
|
||||
{{ item.category_name }}
|
||||
</div>
|
||||
<div class="newsItem_right">
|
||||
<image :src="item.list_image" mode="aspectFill" />
|
||||
</div>
|
||||
|
||||
<div class="newsList">
|
||||
<div class="newsItem" v-for="item in infoList" @click="detail(item)" :key="item.id">
|
||||
<div class="newsItem_left">
|
||||
<div class="newsItem_left_tit">{{ item.title }}</div>
|
||||
<div class="newsItem_left_sub">{{ item.author }}</div>
|
||||
</div>
|
||||
<div class="newsItem_right">
|
||||
<image :src="item.list_image" mode="aspectFill" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tips">{{ loadMoreText }}</div>
|
||||
|
||||
<div class="bigAds" v-if="ads1Show">
|
||||
<div class="bigAdsCon">
|
||||
<div class="bigAdsCon_img">
|
||||
<swiper @animationfinish="swipers" autoplay circular>
|
||||
<swiper-item v-for="(item, index) in largePopList" :key="index" @click="headerServerClick(item)">
|
||||
<image :src="item.ad_picture" mode="aspectFill" />
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</div>
|
||||
<div class="close" @click="closeAds">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_close.png">
|
||||
</image>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bigAds" v-if="ads2Show">
|
||||
<div class="bigAdsCon2">
|
||||
<div class="bigAdsCon2_img">
|
||||
<swiper :current="currentSwiperIndex" @change="onSwiperChange" @animationfinish="swipers" autoplay circular>
|
||||
<swiper-item v-for="(item, index) in popList" :key="index">
|
||||
<image :src="item.ad_picture" mode="aspectFill" />
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</div>
|
||||
<div class="AdsBtnList">
|
||||
<div class="AdsBtnItem1" @click="closeAds2">取消</div>
|
||||
<div class="AdsBtnItem2" @click="onDetailClick">了解详情</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tips">{{ loadMoreText }}</div>
|
||||
|
||||
<div class="bigAds" v-if="ads1Show">
|
||||
<div class="bigAdsCon">
|
||||
<div class="bigAdsCon_img">
|
||||
<swiper @animationfinish="swipers" autoplay circular>
|
||||
<swiper-item
|
||||
v-for="(item, index) in largePopList"
|
||||
:key="index"
|
||||
@click="headerServerClick(item)"
|
||||
>
|
||||
<image :src="item.ad_picture" mode="aspectFill" />
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</div>
|
||||
<div class="close" @click="closeAds">
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_close.png"
|
||||
>
|
||||
</image>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bigAds" v-if="ads2Show">
|
||||
<div class="bigAdsCon2">
|
||||
<div class="bigAdsCon2_img">
|
||||
<swiper
|
||||
:current="currentSwiperIndex"
|
||||
@change="onSwiperChange"
|
||||
@animationfinish="swipers"
|
||||
autoplay
|
||||
circular
|
||||
>
|
||||
<swiper-item v-for="(item, index) in popList" :key="index">
|
||||
<image :src="item.ad_picture" mode="aspectFill" />
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</div>
|
||||
<div class="AdsBtnList">
|
||||
<div class="AdsBtnItem1" @click="closeAds2">取消</div>
|
||||
<div class="AdsBtnItem2" @click="onDetailClick">了解详情</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<nav-footer :current="1" />
|
||||
<nav-footer :current="3" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -171,6 +118,7 @@ import {
|
||||
} from "../../../utils";
|
||||
|
||||
import { apiArr } from "../../../api/v2Community";
|
||||
import { apiArr as apiArr2 } from "../../../api/community";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
@ -208,20 +156,68 @@ export default {
|
||||
page_size: 10,
|
||||
page_num: 1,
|
||||
flag: false,
|
||||
loadMoreText: "下拉加载后续10条,共计30条",
|
||||
loadMoreText: "",
|
||||
|
||||
isShowBill: false,
|
||||
|
||||
houseVal: "",
|
||||
};
|
||||
},
|
||||
async onLoad(options) {
|
||||
// 页面加载时执行一次
|
||||
},
|
||||
|
||||
async onShow() {
|
||||
// 页面展示时执行
|
||||
// if (!uni.getStorageSync("changeCommData")) {
|
||||
// return;
|
||||
// }
|
||||
await request(apiArr2.commInfo, "POST", {
|
||||
user_id: uni.getStorageSync("userId"),
|
||||
longitude: uni.getStorageSync("location").lng,
|
||||
latitude: uni.getStorageSync("location").lat,
|
||||
page_num: this.page_num,
|
||||
page_size: this.page_size,
|
||||
}).then((res) => {
|
||||
if (res.rows.length == 0) {
|
||||
uni.removeStorageSync("changeCommData");
|
||||
return;
|
||||
}
|
||||
|
||||
const targetItem = res.rows.find((item) => {
|
||||
return item.community_id == uni.getStorageSync("changeCommData").id;
|
||||
});
|
||||
|
||||
if (targetItem) {
|
||||
//是否跳转物业缴费
|
||||
this.isShowBill = targetItem.bill_front_end_display == 1;
|
||||
//小区是否隐藏
|
||||
if (targetItem.front_end_display == 1) {
|
||||
uni.removeStorageSync("changeCommData");
|
||||
}
|
||||
}
|
||||
|
||||
res.rows = res.rows.filter((item) => {
|
||||
return item.front_end_display != 1;
|
||||
});
|
||||
console.log("🚀 ~ onLoad ~ res.rows:", res.rows)
|
||||
if (!uni.getStorageSync("changeCommData")) {
|
||||
uni.setStorageSync("changeCommData", { name: res.rows[0].name, id: res.rows[0].community_id })
|
||||
uni.setStorageSync("isShowNav", res.rows[0].room_owner_list[0].type)
|
||||
}
|
||||
this.communityList = res.rows;
|
||||
});
|
||||
const meun = menuButtonInfo();
|
||||
this.top = meun.top;
|
||||
// this.top = meun.height + meun.top;
|
||||
this.localHeight = meun.height;
|
||||
// this.getCommunityList()
|
||||
if (!uni.getStorageSync("changeCommData").id) {
|
||||
uni.setStorageSync("changeCommData", { name: "森呼吸二期", id: 14 });
|
||||
if (this.communityList.length == 0) {
|
||||
this.communityVal = "添加我的房产";
|
||||
} else {
|
||||
console.log("🚀 ~ onLoad ~ this.communityList:", this.communityList)
|
||||
this.communityVal = uni.getStorageSync("changeCommData").name;
|
||||
}
|
||||
|
||||
this.communityVal = uni.getStorageSync("changeCommData").name;
|
||||
this.getfunctionNum();
|
||||
this.getAdvertising();
|
||||
this.getCategoryList();
|
||||
@ -274,6 +270,16 @@ export default {
|
||||
this.NotOpen();
|
||||
return;
|
||||
}
|
||||
if (
|
||||
e == "/packages/community/propertyPayment/index" &&
|
||||
!this.isShowBill
|
||||
) {
|
||||
uni.showToast({
|
||||
title: "请配置账单",
|
||||
icon: "none",
|
||||
});
|
||||
return;
|
||||
}
|
||||
NavgateTo(e);
|
||||
},
|
||||
|
||||
@ -301,6 +307,9 @@ export default {
|
||||
},
|
||||
|
||||
async getfunctionList() {
|
||||
if (!uni.getStorageSync("changeCommData")) {
|
||||
return;
|
||||
}
|
||||
const res = await request(apiArr.navPage, "POST", {
|
||||
community_id: Number(uni.getStorageSync("changeCommData").id),
|
||||
page_num: 1,
|
||||
@ -322,6 +331,9 @@ export default {
|
||||
},
|
||||
|
||||
async getAdvertising() {
|
||||
if (!uni.getStorageSync("changeCommData")) {
|
||||
return;
|
||||
}
|
||||
const res = await request(apiArr.advPage, "POST", {
|
||||
community_id: Number(uni.getStorageSync("changeCommData").id),
|
||||
ad_position: 1,
|
||||
@ -392,26 +404,27 @@ export default {
|
||||
|
||||
headerServerClick(e) {
|
||||
console.log("当前点击内容", e);
|
||||
if (!e.link_url) {
|
||||
if (!e.target_page) {
|
||||
this.NotOpen();
|
||||
return;
|
||||
}
|
||||
if (e.link_url) {
|
||||
if (e.target_page) {
|
||||
// #ifdef APP-PLUS
|
||||
uni.navigateTo({
|
||||
url: "/pages/webview/webview?url=" + encodeURIComponent(e.link_url),
|
||||
url:
|
||||
"/pages/webview/webview?url=" + encodeURIComponent(e.target_page),
|
||||
});
|
||||
// #endif
|
||||
|
||||
// #ifdef H5
|
||||
window.open(e.link_url, "_blank");
|
||||
window.open(e.target_page, "_blank");
|
||||
// #endif
|
||||
|
||||
// #ifdef MP-WEIXIN || MP-ALIPAY || MP-BAIDU
|
||||
if (e.appid) {
|
||||
uni.navigateToMiniProgram({
|
||||
appId: e.appid,
|
||||
path: e.link_url,
|
||||
path: e.target_page,
|
||||
//需要传递给目标小程序的数据
|
||||
extraData: {
|
||||
data1: "test",
|
||||
@ -421,18 +434,23 @@ export default {
|
||||
},
|
||||
});
|
||||
} else {
|
||||
NavgateTo(e.link_url);
|
||||
// 确保路径是绝对路径
|
||||
let targetPage = e.target_page;
|
||||
if (!targetPage.startsWith("/")) {
|
||||
targetPage = "/" + targetPage;
|
||||
}
|
||||
NavgateTo(targetPage);
|
||||
// NavgateTo('/packages/localLife/index/index')
|
||||
}
|
||||
// 小程序中可能需要用户手动复制链接或使用web-view
|
||||
// uni.showModal({
|
||||
// title: '提示',
|
||||
// content: '即将打开外部链接,请复制后在浏览器中打开: ' + e.link_url,
|
||||
// content: '即将打开外部链接,请复制后在浏览器中打开: ' + e.target_page,
|
||||
// confirmText: '复制链接',
|
||||
// success(res) {
|
||||
// if (res.confirm) {
|
||||
// uni.setClipboardData({
|
||||
// data: e.link_url,
|
||||
// data: e.target_page,
|
||||
// success() {
|
||||
// uni.showToast({
|
||||
// title: '复制成功',
|
||||
@ -473,6 +491,9 @@ export default {
|
||||
},
|
||||
|
||||
async getCategoryList() {
|
||||
if (!uni.getStorageSync("changeCommData")) {
|
||||
return;
|
||||
}
|
||||
const res = await request(apiArr.categoryPage, "POST", {
|
||||
community_id: Number(uni.getStorageSync("changeCommData").id),
|
||||
category_code: "",
|
||||
@ -489,10 +510,15 @@ export default {
|
||||
if (isTabChange) {
|
||||
this.page_num = 1;
|
||||
this.infoList = [];
|
||||
this.loadMoreText = "下拉加载后续10条,共计30条";
|
||||
// this.loadMoreText = "下拉加载后续10条,共计30条";
|
||||
}
|
||||
this.selectedTab = index;
|
||||
console.log("选中的tab:", index);
|
||||
|
||||
// 如果不是切换tab,且已经没有更多数据,且已有数据,则不发送请求
|
||||
if (!isTabChange && !this.flag && this.infoList.length > 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
const res = await request(apiArr.infoPage, "POST", {
|
||||
community_id: Number(uni.getStorageSync("changeCommData").id),
|
||||
announcement_category_id: item.id,
|
||||
@ -513,10 +539,17 @@ export default {
|
||||
// 限制最多3页
|
||||
this.flag = hasMore;
|
||||
|
||||
// 检查数据是否重复
|
||||
const isDataDuplicate =
|
||||
!isTabChange &&
|
||||
this.infoList.length > 0 &&
|
||||
newData.length > 0 &&
|
||||
this.infoList[this.infoList.length - 1].id === newData[0].id;
|
||||
|
||||
// 更新数据
|
||||
if (isTabChange) {
|
||||
this.infoList = newData;
|
||||
} else {
|
||||
} else if (!isDataDuplicate) {
|
||||
this.infoList = this.infoList.concat(newData);
|
||||
}
|
||||
|
||||
@ -527,7 +560,7 @@ export default {
|
||||
icon: "none",
|
||||
});
|
||||
} else {
|
||||
this.loadMoreText = `下拉加载后续10条`;
|
||||
// this.loadMoreText = `下拉加载后续10条`;
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="empty" v-if="false">
|
||||
<view class="empty" v-if="communityList.length == 0">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_newEmpty.png"
|
||||
alt="" />
|
||||
没有添加任何房产
|
||||
@ -67,7 +67,7 @@ export default {
|
||||
res.rows.forEach(item => {
|
||||
item.pic = item.pic.startsWith('http') ? item.pic : picUrl + item.pic
|
||||
});
|
||||
this.communityList = res.rows
|
||||
this.communityList = res.rows.filter(item => item.front_end_display !== 1)
|
||||
})
|
||||
},
|
||||
// toUpview(item) {
|
||||
@ -79,7 +79,8 @@ export default {
|
||||
this.currentCommunity = e
|
||||
uni.setStorageSync('changeCommData', { id: e.community_id, name: e.name });
|
||||
uni.setStorageSync('currentCommunityAddr',e.addr);
|
||||
NavgateTo("/packages/community/index/index")
|
||||
uni.setStorageSync("isShowNav", e.room_owner_list[0].type)
|
||||
NavgateTo("1")
|
||||
},
|
||||
},
|
||||
|
||||
|
||||
@ -59,6 +59,10 @@ page {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.red{
|
||||
color: #FF0000;
|
||||
}
|
||||
|
||||
.label {
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
@ -73,7 +77,7 @@ page {
|
||||
}
|
||||
|
||||
.roomItem {
|
||||
width: 276rpx;
|
||||
width: auto;
|
||||
height: 54rpx;
|
||||
background: #FFF5F5;
|
||||
border-radius: 10rpx 10rpx 10rpx 10rpx;
|
||||
@ -85,6 +89,7 @@ page {
|
||||
color: #222222;
|
||||
margin-right: 30rpx;
|
||||
margin-bottom: 28rpx;
|
||||
padding: 0 10rpx;
|
||||
}
|
||||
|
||||
.roomItem:nth-child(2n) {
|
||||
|
||||
@ -12,16 +12,16 @@
|
||||
|
||||
<div class="repairMsg">
|
||||
<div class="repairTit">
|
||||
<span>*</span>报修信息
|
||||
报修信息
|
||||
</div>
|
||||
|
||||
<div class="label">选择房源信息</div>
|
||||
<div class="label"><span class="red">*</span>选择房源信息</div>
|
||||
<div class="roomList">
|
||||
<div v-for="(item, index) in roomList" :key="index" :class="active == index ?'roomItem active':'roomItem'" @click="changeAct(index)">{{ item.name }}</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="row_label">报修类型</div>
|
||||
<div class="row_label"><span class="red">*</span>报修类型</div>
|
||||
<div class="row_con" @click="chose">
|
||||
<input type="text" :value="category.category_name" placeholder="请选择报修类型" disabled>
|
||||
<u-icon bold color="#999999" size="30" name="arrow-right"></u-icon>
|
||||
@ -29,28 +29,28 @@
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="row_label">问题描述</div>
|
||||
<div class="row_label"><span class="red">*</span>问题描述</div>
|
||||
<div class="row_con">
|
||||
<input type="text" placeholder="请描述故障" :value="repairInfo" data-name="repairInfo" @input="handlerInputClick">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="row_label">联系人</div>
|
||||
<div class="row_label"><span class="red">*</span>联系人</div>
|
||||
<div class="row_con">
|
||||
<input type="text" placeholder="请输入您的姓名" :value="contactName" data-name="contactName" @input="handlerInputClick">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="row_label">联系电话</div>
|
||||
<div class="row_label"><span class="red">*</span>联系电话</div>
|
||||
<div class="row_con">
|
||||
<input type="number" maxlength="11" placeholder="请输入您的联系方式" :value="contactPhone" data-name="contactPhone" @input="handlerInputClick">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row noneBorder">
|
||||
<div class="row_label">上门时间</div>
|
||||
<div class="row_label"><span class="red">*</span>上门时间</div>
|
||||
<div class="row_con" @click="choseTime">
|
||||
<input type="text" :value="time" placeholder="请选择上门时间" disabled>
|
||||
<u-icon bold color="#999999" size="30" name="arrow-right"></u-icon>
|
||||
@ -63,7 +63,7 @@
|
||||
<div class="row_label">上传图片</div>
|
||||
<div class="row_con2">
|
||||
<u-upload :fileList="imgList" name="imgList" @afterRead="afterReadImg" @delete="deletePic" multiple
|
||||
:maxCount="10">
|
||||
:maxCount="5">
|
||||
<div class="imgCon">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_imageImg.png" mode="widthFix"></image>
|
||||
上传图片
|
||||
@ -235,6 +235,55 @@ export default {
|
||||
this.active = e;
|
||||
},
|
||||
async handlerSubmitClick() {
|
||||
// 表单验证
|
||||
if (!this.roomList[this.active]) {
|
||||
uni.showToast({
|
||||
title: '请选择房源信息',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (!this.category.id) {
|
||||
uni.showToast({
|
||||
title: '请选择报修类型',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (!this.repairInfo.trim()) {
|
||||
uni.showToast({
|
||||
title: '请输入问题描述',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (!this.contactName.trim()) {
|
||||
uni.showToast({
|
||||
title: '请输入联系人姓名',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (!this.contactPhone.trim() || this.contactPhone.length !== 11) {
|
||||
uni.showToast({
|
||||
title: '请输入有效的联系电话',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (!this.time) {
|
||||
uni.showToast({
|
||||
title: '请选择上门时间',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
uni.showLoading({
|
||||
title: '提交中'
|
||||
});
|
||||
|
||||
@ -212,6 +212,10 @@ image {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.payItem_money{
|
||||
width: 150rpx;
|
||||
}
|
||||
|
||||
.bottom {
|
||||
width: 750rpx;
|
||||
background: #FFFFFF;
|
||||
@ -409,6 +413,17 @@ image {
|
||||
font-size: 28rpx;
|
||||
color: #000000;
|
||||
margin-top: 10rpx;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.PayTypeItem_con_msg2{
|
||||
font-size: 26rpx;
|
||||
margin-left: 20rpx;
|
||||
border: 1rpx solid #f23f17;
|
||||
padding: 0 10rpx;
|
||||
background-color: #fde0dc;
|
||||
color: #f23f17;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.line3 {
|
||||
@ -421,8 +436,9 @@ image {
|
||||
font-weight: bold;
|
||||
font-size: 50rpx;
|
||||
color: #FF370B;
|
||||
text-align: center;
|
||||
/* text-align: center; */
|
||||
padding-bottom: 30rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.boxshadowCon_subTit span {
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,187 +1,226 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<u-navbar title=" " leftIconSize="20px" leftIconColor="#FFFFFF" bgColor="transparent" :autoBack="true" />
|
||||
<view class="container_body" :style="{ paddingTop: top + 'px' }">
|
||||
<view class="title">物业公积金</view>
|
||||
<view class="title_bottom">
|
||||
<view>¥{{ moeny }}</view>
|
||||
<u-icon name="info-circle" size="30rpx" color="linear-gradient( 180deg, #FFFFFF 0%, #FFD7D7 100%);" />
|
||||
</view>
|
||||
<view class="name" @click="headerSwitchClick">
|
||||
<text>{{defaultName.name}}</text>
|
||||
<u-icon name="arrow-right" color="#FFFFFF" size="30rpx" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="main">
|
||||
<view class="person_info" v-for="(item,index) in list.owners" :key="index">
|
||||
<view class="item">
|
||||
<view class="label">姓名</view>
|
||||
<view class="desc">{{ item.name }}</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="label">身份</view>
|
||||
<view class="desc" v-if="item.type == 1">业主</view>
|
||||
<view class="desc" v-if="item.type == 2">家属</view>
|
||||
<view class="desc" v-if="item.type == 3">租户</view>
|
||||
<view class="desc" v-if="item.type == 4">访客</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="container">
|
||||
<u-navbar
|
||||
title=" "
|
||||
leftIconSize="20px"
|
||||
leftIconColor="#FFFFFF"
|
||||
bgColor="transparent"
|
||||
:autoBack="true"
|
||||
/>
|
||||
<view class="container_body" :style="{ paddingTop: top + 'px' }">
|
||||
<view class="title">物业公积金</view>
|
||||
<view class="title_bottom">
|
||||
<view>¥{{ moeny }}</view>
|
||||
<u-icon
|
||||
name="info-circle"
|
||||
size="30rpx"
|
||||
color="linear-gradient( 180deg, #FFFFFF 0%, #FFD7D7 100%);"
|
||||
/>
|
||||
</view>
|
||||
<view class="name" @click="headerSwitchClick">
|
||||
<text>{{ defaultName.name }}</text>
|
||||
<u-icon name="arrow-right" color="#FFFFFF" size="30rpx" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="main">
|
||||
<view
|
||||
class="person_info"
|
||||
v-for="(item, index) in list.owners"
|
||||
:key="index"
|
||||
>
|
||||
<view class="item">
|
||||
<view class="label">姓名</view>
|
||||
<view class="desc">{{ item.name }}</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="label">身份</view>
|
||||
<view class="desc" v-if="item.type == 1">业主</view>
|
||||
<view class="desc" v-if="item.type == 2">家属</view>
|
||||
<view class="desc" v-if="item.type == 3">租户</view>
|
||||
<view class="desc" v-if="item.type == 4">访客</view>
|
||||
</view>
|
||||
<!-- <view class="item">
|
||||
<view class="label">手机号</view>
|
||||
<view class="desc">{{item.mobile}}</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="label">房产总数</view>
|
||||
<view class="desc">{{ item.count_of_rooms }}</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="label fix">
|
||||
<text>物业费公积金总余额</text>
|
||||
<u-icon name="info-circle-fill" size="30rpx" color="red" @click="headerIconClick(index)" />
|
||||
<view class="popup" v-if="item.popupShow" @click="headerIconClick(index)">
|
||||
{{ item.identity == '业主' ? ownerDesc : desc }}
|
||||
<view class="angle"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="desc">¥{{item.property_fund_balance}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="btn">去抵扣物业账单</view>
|
||||
</view> -->
|
||||
<view class="item">
|
||||
<view class="label">房产总数</view>
|
||||
<view class="desc">{{ item.count_of_rooms }}</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="label fix">
|
||||
<text>物业费公积金总余额</text>
|
||||
<u-icon
|
||||
name="info-circle-fill"
|
||||
size="30rpx"
|
||||
color="red"
|
||||
@click="headerIconClick(index)"
|
||||
/>
|
||||
<view
|
||||
class="popup"
|
||||
v-if="item.popupShow"
|
||||
@click="headerIconClick(index)"
|
||||
>
|
||||
{{ item.identity == "业主" ? ownerDesc : desc }}
|
||||
<view class="angle"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="desc">¥{{ item.property_fund_balance }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="btn" @click="goPay">去抵扣物业账单</view>
|
||||
|
||||
<u-popup :show="show" :round="50" @close="close">
|
||||
<view class="select_Popup">
|
||||
<view class="header">
|
||||
<view></view>
|
||||
<view class="title">选择房源</view>
|
||||
<view class="close" @click="close">取消</view>
|
||||
</view>
|
||||
<view class="line"></view>
|
||||
<view class="main">
|
||||
<view class="item" v-for="(item,index) in houseList" :key="index" @click="headerConfirmClick(item)">
|
||||
<text>{{ item.name }}</text>
|
||||
<image
|
||||
v-if="item.checked"
|
||||
class="pic"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/community_providentFund_Group_1444.png"
|
||||
mode="scaleToFill"
|
||||
/>
|
||||
<image
|
||||
v-else
|
||||
class="pic"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/community_providentFund_Ellipse_160.png"
|
||||
mode="scaleToFill"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
</view>
|
||||
<u-popup :show="show" :round="50" @close="close">
|
||||
<view class="select_Popup">
|
||||
<view class="header">
|
||||
<view></view>
|
||||
<view class="title">选择房源</view>
|
||||
<view class="close" @click="close">取消</view>
|
||||
</view>
|
||||
<view class="line"></view>
|
||||
<view class="main">
|
||||
<view
|
||||
class="item"
|
||||
v-for="(item, index) in houseList"
|
||||
:key="index"
|
||||
@click="headerConfirmClick(item)"
|
||||
>
|
||||
<text>{{ item.name }}</text>
|
||||
<image
|
||||
v-if="item.checked"
|
||||
class="pic"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/community_providentFund_Group_1444.png"
|
||||
mode="scaleToFill"
|
||||
/>
|
||||
<image
|
||||
v-else
|
||||
class="pic"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/community_providentFund_Ellipse_160.png"
|
||||
mode="scaleToFill"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
request,
|
||||
picUrl,
|
||||
uniqueByField,
|
||||
menuButtonInfo,
|
||||
} from '../../../utils';
|
||||
|
||||
import { apiArr } from '../../../api/v2Community';
|
||||
request,
|
||||
picUrl,
|
||||
uniqueByField,
|
||||
menuButtonInfo,
|
||||
NavgateTo,
|
||||
} from "../../../utils";
|
||||
|
||||
import { apiArr } from "../../../api/v2Community";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
top: '',
|
||||
moeny: '0.00',
|
||||
show: false,
|
||||
ownerDesc: '本房产的物业公积金为该房产的所有成员物业公积金总和。无需经过成员同意便可用于本房产的物业费抵扣,一旦成功抵扣,成员所拥有的物业公积金将自动进行扣除。',
|
||||
desc: '物业公积金可通用至您加入的所有房产,任一房产的物业相关费用均可用该物业公积金抵扣。',
|
||||
defaultName: '',
|
||||
list: [
|
||||
|
||||
],
|
||||
houseList: [
|
||||
|
||||
],
|
||||
roomList:[]
|
||||
}
|
||||
},
|
||||
async onLoad(options) {
|
||||
this.defaultName = {
|
||||
...this.houseList[0],
|
||||
checked: true
|
||||
};
|
||||
const meun = menuButtonInfo();
|
||||
this.top = meun.height + meun.top;
|
||||
await this.getRoomList()
|
||||
await this.getInfo()
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
top: "",
|
||||
moeny: "0.00",
|
||||
show: false,
|
||||
ownerDesc:
|
||||
"本房产的物业公积金为该房产的所有成员物业公积金总和。无需经过成员同意便可用于本房产的物业费抵扣,一旦成功抵扣,成员所拥有的物业公积金将自动进行扣除。",
|
||||
desc: "物业公积金可通用至您加入的所有房产,任一房产的物业相关费用均可用该物业公积金抵扣。",
|
||||
defaultName: "",
|
||||
list: [],
|
||||
houseList: [],
|
||||
roomList: [],
|
||||
|
||||
itemObj: '',
|
||||
};
|
||||
},
|
||||
async onLoad(options) {
|
||||
if (options.item) {
|
||||
this.itemObj = JSON.parse(decodeURIComponent(options.item));
|
||||
this.defaultName = {
|
||||
...this.itemObj,
|
||||
checked: true,
|
||||
};
|
||||
} else {
|
||||
this.defaultName = {
|
||||
...this.houseList[0],
|
||||
checked: true,
|
||||
};
|
||||
}
|
||||
console.log(this.itemObj)
|
||||
const meun = menuButtonInfo();
|
||||
this.top = meun.height + meun.top;
|
||||
await this.getRoomList();
|
||||
await this.getInfo();
|
||||
},
|
||||
|
||||
methods: {
|
||||
headerConfirmClick(item) {
|
||||
this.defaultName = {
|
||||
...item,
|
||||
checked: true
|
||||
};
|
||||
this.show = false;
|
||||
this.getInfo()
|
||||
},
|
||||
//选择房产
|
||||
headerSwitchClick() {
|
||||
this.show = true;
|
||||
const newRes = this.roomList.map(item => {
|
||||
if (item.name === this.defaultName.name) {
|
||||
return {
|
||||
...item,
|
||||
checked: true
|
||||
}
|
||||
}
|
||||
return {
|
||||
...item,
|
||||
checked: false
|
||||
}
|
||||
});
|
||||
console.log('newResnewRes', newRes);
|
||||
this.houseList = newRes;
|
||||
},
|
||||
// 业主点击弹出层
|
||||
headerIconClick(ind) {
|
||||
this.list.owners[ind].popupShow = !this.list.owners[ind].popupShow
|
||||
},
|
||||
close() {
|
||||
this.show = false;
|
||||
},
|
||||
methods: {
|
||||
headerConfirmClick(item) {
|
||||
this.defaultName = {
|
||||
...item,
|
||||
checked: true,
|
||||
};
|
||||
this.show = false;
|
||||
this.getInfo();
|
||||
},
|
||||
//选择房产
|
||||
headerSwitchClick() {
|
||||
this.show = true;
|
||||
const newRes = this.roomList.map((item) => {
|
||||
if (item.name === this.defaultName.name) {
|
||||
return {
|
||||
...item,
|
||||
checked: true,
|
||||
};
|
||||
}
|
||||
return {
|
||||
...item,
|
||||
checked: false,
|
||||
};
|
||||
});
|
||||
console.log("newResnewRes", newRes);
|
||||
this.houseList = newRes;
|
||||
},
|
||||
// 业主点击弹出层
|
||||
headerIconClick(ind) {
|
||||
this.list.owners[ind].popupShow = !this.list.owners[ind].popupShow;
|
||||
},
|
||||
close() {
|
||||
this.show = false;
|
||||
},
|
||||
|
||||
async getRoomList(){
|
||||
await request(apiArr.getCommunityList,"POST",{
|
||||
page_num:1,
|
||||
page_size:50,
|
||||
community_id:uni.getStorageSync("changeCommData").id
|
||||
}).then(res=>{
|
||||
res.rows.forEach(item=>{
|
||||
item.checked = false
|
||||
})
|
||||
this.roomList = res.rows
|
||||
this.defaultName = res.rows[0]
|
||||
})
|
||||
},
|
||||
async getInfo(){
|
||||
await request(apiArr.getGovernmentByRoom,"POST",{
|
||||
room_id:this.defaultName.room_id
|
||||
}).then(res=>{
|
||||
res.owners.forEach(item => {
|
||||
item.popupShow = false
|
||||
});
|
||||
this.list = res
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
async getRoomList() {
|
||||
await request(apiArr.getCommunityList, "POST", {
|
||||
page_num: 1,
|
||||
page_size: 50,
|
||||
community_id: uni.getStorageSync("changeCommData").id,
|
||||
}).then((res) => {
|
||||
res.rows.forEach((item) => {
|
||||
item.checked = false;
|
||||
});
|
||||
this.roomList = res.rows;
|
||||
if (!this.itemObj) {
|
||||
this.defaultName = res.rows[0];
|
||||
}
|
||||
});
|
||||
},
|
||||
async getInfo() {
|
||||
await request(apiArr.getGovernmentByRoom, "POST", {
|
||||
room_id: this.defaultName.room_id,
|
||||
}).then((res) => {
|
||||
res.owners.forEach((item) => {
|
||||
item.popupShow = false;
|
||||
});
|
||||
this.list = res;
|
||||
});
|
||||
},
|
||||
goPay() {
|
||||
NavgateTo("../propertyPayment/index");
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import './index.scss';
|
||||
|
||||
@import "./index.scss";
|
||||
</style>
|
||||
@ -138,6 +138,7 @@ page {
|
||||
font-size: 28rpx;
|
||||
color: #FFA600;
|
||||
font-weight: 600;
|
||||
width: 95rpx;
|
||||
}
|
||||
.orderItem_row_state2 {
|
||||
color: #FF4800;
|
||||
|
||||
@ -1,9 +1,18 @@
|
||||
<template>
|
||||
<view class="box">
|
||||
<div class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
|
||||
<div
|
||||
class="searchBox"
|
||||
:style="{ height: localHeight + 'px', paddingTop: top + 'px' }"
|
||||
>
|
||||
<div class="searchBox_add">
|
||||
<div class="searchBox_left">
|
||||
<u-icon bold color="#000" size="40" name="arrow-left" @click="back"></u-icon>
|
||||
<u-icon
|
||||
bold
|
||||
color="#000"
|
||||
size="40"
|
||||
name="arrow-left"
|
||||
@click="back"
|
||||
></u-icon>
|
||||
</div>
|
||||
<div class="searchBox_mid">我的报修</div>
|
||||
<div class="searchBox_right"></div>
|
||||
@ -11,21 +20,38 @@
|
||||
</div>
|
||||
|
||||
<div class="tabList">
|
||||
<div :class="active == 1 ? 'tab active' : 'tab'" @click="headerTabsClick(1)">
|
||||
<div
|
||||
:class="active == 1 ? 'tab active' : 'tab'"
|
||||
@click="headerTabsClick(1)"
|
||||
>
|
||||
待指派 <span>({{ awaitingNumb }})</span>
|
||||
</div>
|
||||
<div :class="active == 2 ? 'tab active' : 'tab'" @click="headerTabsClick(2)">
|
||||
<div
|
||||
:class="active == 2 ? 'tab active' : 'tab'"
|
||||
@click="headerTabsClick(2)"
|
||||
>
|
||||
进行中 <span>({{ underwayNum }})</span>
|
||||
</div>
|
||||
<div :class="active == 4 ? 'tab active' : 'tab'" @click="headerTabsClick(4)">
|
||||
<div
|
||||
:class="active == 4 ? 'tab active' : 'tab'"
|
||||
@click="headerTabsClick(4)"
|
||||
>
|
||||
已作废 <span>({{ discardNum }})</span>
|
||||
</div>
|
||||
<div :class="active == 3 ? 'tab active' : 'tab'" @click="headerTabsClick(3)">
|
||||
<div
|
||||
:class="active == 3 ? 'tab active' : 'tab'"
|
||||
@click="headerTabsClick(3)"
|
||||
>
|
||||
已完成 <span>({{ doneNum }})</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="list.length !== 0" class="orderList" v-for="(item, index) in list" :key="index">
|
||||
<div
|
||||
v-if="list.length !== 0"
|
||||
class="orderList"
|
||||
v-for="(item, index) in list"
|
||||
:key="index"
|
||||
>
|
||||
<div class="orderItem" @click="handlerDetailClick(item.id)">
|
||||
<div :class="['orderItemTit', statusType[item.status].style]">
|
||||
<div class="orderItemTit_left">工单编号:{{ item.order_code }}</div>
|
||||
@ -35,10 +61,11 @@
|
||||
<div class="df">
|
||||
<div class="orderItem_row_label">小区房源名称</div>
|
||||
<div class="orderItem_row_con">{{ item.room.name }}</div>
|
||||
</div>
|
||||
|
||||
<div :class="['orderItem_row_state', statusType[item.status].color]">
|
||||
{{ statusType[item.status].desc }}
|
||||
<div
|
||||
:class="['orderItem_row_state', statusType[item.status].color]"
|
||||
>
|
||||
{{ statusType[item.status].desc }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -70,8 +97,10 @@
|
||||
</div>
|
||||
|
||||
<div v-if="list.length == 0" class="empty">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_nearbyList_empty.png"
|
||||
mode="aspectFill"></image>
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_nearbyList_empty.png"
|
||||
mode="aspectFill"
|
||||
></image>
|
||||
暂无数据
|
||||
</div>
|
||||
|
||||
@ -92,31 +121,31 @@ export default {
|
||||
page_size: 10,
|
||||
flag: false, // 是否下拉请求接口
|
||||
list: [], // 列表数组
|
||||
awaitingNumb: '', // 待维修工单数量
|
||||
underwayNum: '', // 进行中工单数量
|
||||
doneNum: '', // 已完成工单数量
|
||||
discardNum: '', // 已废弃工单数量
|
||||
awaitingNumb: "", // 待维修工单数量
|
||||
underwayNum: "", // 进行中工单数量
|
||||
doneNum: "", // 已完成工单数量
|
||||
discardNum: "", // 已废弃工单数量
|
||||
// 状态枚举类型
|
||||
statusType: {
|
||||
1: {
|
||||
desc: "待指派",
|
||||
style: "orderItemTit_state1",
|
||||
color: "orderItem_row_state1"
|
||||
color: "orderItem_row_state1",
|
||||
},
|
||||
2: {
|
||||
desc: "进行中",
|
||||
style: "orderItemTit_state2",
|
||||
color: "orderItem_row_state2"
|
||||
color: "orderItem_row_state2",
|
||||
},
|
||||
3: {
|
||||
desc: "已完成",
|
||||
style: "orderItemTit_state3",
|
||||
color: "orderItem_row_state3"
|
||||
color: "orderItem_row_state3",
|
||||
},
|
||||
4: {
|
||||
desc: "已作废",
|
||||
style: "orderItemTit_state4",
|
||||
color: "orderItem_row_state4"
|
||||
color: "orderItem_row_state4",
|
||||
},
|
||||
},
|
||||
};
|
||||
@ -137,12 +166,13 @@ export default {
|
||||
this.getTabsList();
|
||||
},
|
||||
async init() {
|
||||
const [awaitingNumb, underwayNum, doneNum, discardNum] = await Promise.all([
|
||||
this.awaitingRes(),
|
||||
this.underwayRes(),
|
||||
this.doneRes(),
|
||||
this.discardRes(),
|
||||
]);
|
||||
const [awaitingNumb, underwayNum, doneNum, discardNum] =
|
||||
await Promise.all([
|
||||
this.awaitingRes(),
|
||||
this.underwayRes(),
|
||||
this.doneRes(),
|
||||
this.discardRes(),
|
||||
]);
|
||||
this.awaitingNumb = awaitingNumb;
|
||||
this.underwayNum = underwayNum;
|
||||
this.discardNum = discardNum;
|
||||
@ -188,7 +218,7 @@ export default {
|
||||
// 已废弃工单数量
|
||||
async discardRes() {
|
||||
const res = await request(apiArr.getWorkOrderCrudList, "POST", {
|
||||
status: 3,
|
||||
status: 4,
|
||||
page_num: this.page_num,
|
||||
page_size: this.page_size,
|
||||
});
|
||||
@ -197,7 +227,7 @@ export default {
|
||||
// 已完成工单数量
|
||||
async doneRes() {
|
||||
const res = await request(apiArr.getWorkOrderCrudList, "POST", {
|
||||
status: 4,
|
||||
status: 3,
|
||||
page_num: this.page_num,
|
||||
page_size: this.page_size,
|
||||
});
|
||||
@ -206,9 +236,9 @@ export default {
|
||||
|
||||
back() {
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
})
|
||||
}
|
||||
delta: 1,
|
||||
});
|
||||
},
|
||||
},
|
||||
|
||||
onLoad(options) {
|
||||
|
||||
@ -146,7 +146,7 @@
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<nav-footer :current="3" />
|
||||
<!-- <nav-footer :current="4" /> -->
|
||||
|
||||
<!-- 回到顶部 -->
|
||||
<div class="toUp" @click="scrollToTop">
|
||||
@ -304,7 +304,7 @@ export default {
|
||||
|
||||
// 查看公告
|
||||
lookNotice() {
|
||||
NavgateTo("/packages/homeServer/noticeDetials/index");
|
||||
NavgateTo("/packages/homeServer/noticeManage/index");
|
||||
},
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
@ -148,7 +148,7 @@ page {
|
||||
}
|
||||
|
||||
.master_info_right2 {
|
||||
font-size: 28rpx;
|
||||
font-size: 26rpx;
|
||||
color: #999999;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -423,6 +423,12 @@ page {
|
||||
margin-right: 6rpx;
|
||||
}
|
||||
|
||||
.evaluateItem_msg3{
|
||||
font-size: 24rpx;
|
||||
margin-left: 15rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.evaluateItem_main {
|
||||
font-size: 26rpx;
|
||||
color: #222222;
|
||||
@ -448,9 +454,9 @@ page {
|
||||
}
|
||||
|
||||
.footerbtn1 {
|
||||
width: 200rpx;
|
||||
width: 300rpx;
|
||||
height: 70rpx;
|
||||
background: linear-gradient(91deg, #FFB95E 0%, #FF9100 100%);
|
||||
background: linear-gradient(91deg, #ff765a 0%, #ff3d11 100%);
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
font-size: 36rpx;
|
||||
color: #FFFFFF;
|
||||
@ -501,4 +507,114 @@ page {
|
||||
text-align: center;
|
||||
padding: 20rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.shadow {
|
||||
background: rgba(0, 0, 0, 0.4);
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
z-index: 9;
|
||||
}
|
||||
|
||||
.shadowBox1 {
|
||||
height: 250rpx;
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.shadowBox1Item {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 26rpx;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.shadowBox1Item image {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
margin-bottom: 26rpx;
|
||||
}
|
||||
|
||||
.shadowBox2 {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: auto;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.shadowBox_img {
|
||||
width: 600rpx;
|
||||
height: 750rpx;
|
||||
background-color: white;
|
||||
background-size: 100% 100%;
|
||||
border-radius: 30rpx;
|
||||
}
|
||||
|
||||
.boxshadow_btnList{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.shadowBox_btn1 {
|
||||
font-size: 30rpx;
|
||||
color: #FFFFFF;
|
||||
width: 250rpx;
|
||||
height: 70rpx;
|
||||
background: #08c161;
|
||||
border-radius: 20rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 30rpx 10rpx;
|
||||
}
|
||||
.shadowBox_btn2 {
|
||||
font-size: 30rpx;
|
||||
color: #FFFFFF;
|
||||
width: 250rpx;
|
||||
height: 70rpx;
|
||||
background: #fe380e;
|
||||
border-radius: 20rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 30rpx 10rpx;
|
||||
}
|
||||
|
||||
.boxshadow_tit {
|
||||
font-size: 32rpx;
|
||||
color: #222222;
|
||||
text-align: center;
|
||||
padding-top: 40rpx;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.boxshadow_text{
|
||||
font-size: 26rpx;
|
||||
color: #a3a3a3;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.boxshadow_text2{
|
||||
font-size: 28rpx;
|
||||
text-align: center;
|
||||
margin: 20rpx;
|
||||
}
|
||||
|
||||
.boxshadow_img {
|
||||
width: 250rpx;
|
||||
height: 250rpx;
|
||||
margin: 0 auto;
|
||||
margin-top: 40rpx;
|
||||
}
|
||||
@ -13,7 +13,7 @@
|
||||
@click="back"
|
||||
></u-icon>
|
||||
</view>
|
||||
<div class="searchBox_mid">刘师傅</div>
|
||||
<div class="searchBox_mid">人员详情</div>
|
||||
<div class="searchBox_right">
|
||||
<u-icon
|
||||
bold
|
||||
@ -43,7 +43,9 @@
|
||||
<div class="master">
|
||||
<div class="master_info">
|
||||
<div class="master_info_left">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/home_icon12.png"></image>
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/home_icon12.png"
|
||||
></image>
|
||||
<div class="state state1">待服务</div>
|
||||
<div class="state state2" v-if="false">休息中</div>
|
||||
<div class="state state3" v-if="false">服务中</div>
|
||||
@ -146,7 +148,9 @@
|
||||
<div class="Tit">职业证书</div>
|
||||
<div class="imgList">
|
||||
<div class="imgItem" v-for="(item, index) in 5" :key="index">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_MsgImg1.png"></image>
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_MsgImg1.png"
|
||||
></image>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -155,7 +159,9 @@
|
||||
|
||||
<div class="master_info mt20" v-for="(item, index) in 3" :key="index">
|
||||
<div class="master_info_left">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/home_icon12.png"></image>
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/home_icon12.png"
|
||||
></image>
|
||||
<div class="state state1">待服务</div>
|
||||
<div class="state state2" v-if="false">休息中</div>
|
||||
<div class="state state3" v-if="false">服务中</div>
|
||||
@ -208,7 +214,9 @@
|
||||
<div class="master">
|
||||
<div class="master_info">
|
||||
<div class="master_info_left">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/home_icon12.png"></image>
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/home_icon12.png"
|
||||
></image>
|
||||
<div class="state state1">待服务</div>
|
||||
<div class="state state2" v-if="false">休息中</div>
|
||||
<div class="state state3" v-if="false">服务中</div>
|
||||
@ -233,7 +241,8 @@
|
||||
<span>4.8</span>
|
||||
</div>
|
||||
<div class="master_info_right2">
|
||||
价格范围: <span>¥500-¥800</span>
|
||||
<div>工号:<span>123456</span></div>
|
||||
<div>价格范围: <span>¥500-¥800</span></div>
|
||||
</div>
|
||||
<div class="master_info_right3">
|
||||
<div class="master_info_right3_item">
|
||||
@ -313,7 +322,9 @@
|
||||
<div class="EvaluateItem">
|
||||
<div class="evaluateItem_header">
|
||||
<div class="evaluateItem_ava">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_MsgImg1.png"></image>
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_MsgImg1.png"
|
||||
></image>
|
||||
</div>
|
||||
<div class="evaluateItem_msg">
|
||||
<div class="evaluateItem_msg1">TP</div>
|
||||
@ -323,6 +334,7 @@
|
||||
:key="index"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/homeServer_stait.png"
|
||||
></image>
|
||||
<span class="evaluateItem_msg3">技术评级:100分</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="evaluateItem_time">2025-06-24</div>
|
||||
@ -336,7 +348,9 @@
|
||||
<div class="Tit">职业证书</div>
|
||||
<div class="imgList">
|
||||
<div class="imgItem" v-for="(item, index) in 5" :key="index">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_MsgImg1.png"></image>
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_MsgImg1.png"
|
||||
></image>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -347,9 +361,9 @@
|
||||
<div class="footerIcon" @click="Vendor">
|
||||
<image
|
||||
id="footerIcon1"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/homeServer_serverInfoIcon.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_shop.png"
|
||||
></image>
|
||||
服务商
|
||||
店铺
|
||||
</div>
|
||||
<div class="footerIcon">
|
||||
<image
|
||||
@ -358,9 +372,37 @@
|
||||
></image>
|
||||
收藏
|
||||
</div>
|
||||
<div class="footerbtn1">联系客服</div>
|
||||
<div class="footerbtn2">立即预约</div>
|
||||
<div class="footerIcon">
|
||||
<image
|
||||
@click="openSave"
|
||||
id="footerIcon2"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_share.png"
|
||||
></image>
|
||||
分享
|
||||
</div>
|
||||
<div class="footerbtn1">联系客服咨询</div>
|
||||
<!-- <div class="footerbtn2">立即预约</div> -->
|
||||
</div>
|
||||
|
||||
<!-- 分享 -->
|
||||
<view class="shadow" @click="changeShadow2" v-if="boxshadow2">
|
||||
<view class="shadowBox2">
|
||||
<view class="shadowBox_img">
|
||||
<view class="boxshadow_tit">分享服务给朋友</view>
|
||||
<view class="boxshadow_text">将服务人员信息分享给微信,</view>
|
||||
<view class="boxshadow_text">好友对方可以直接查看详情</view>
|
||||
<view class="boxshadow_text2">张师傅</view>
|
||||
<view class="boxshadow_img">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/erweima.png"> </image>
|
||||
</view>
|
||||
<view class="boxshadow_text2">扫描二维码查看服务详情</view>
|
||||
<view class="boxshadow_btnList">
|
||||
<view class="shadowBox_btn1">分享到微信</view>
|
||||
<view class="shadowBox_btn2">保存二维码</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@ -378,6 +420,7 @@ export default {
|
||||
return {
|
||||
top: "",
|
||||
localHeight: "",
|
||||
boxshadow2: false,
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
@ -390,6 +433,13 @@ export default {
|
||||
back() {
|
||||
NavgateTo("1");
|
||||
},
|
||||
|
||||
openSave() {
|
||||
this.boxshadow2 = true;
|
||||
},
|
||||
changeShadow2() {
|
||||
this.boxshadow2 = false;
|
||||
},
|
||||
},
|
||||
onReady() {},
|
||||
|
||||
|
||||
49
packages/homeServer/noticeManage/index.css
Normal file
49
packages/homeServer/noticeManage/index.css
Normal file
@ -0,0 +1,49 @@
|
||||
page {
|
||||
background-color: #f6f7fb;
|
||||
}
|
||||
|
||||
.container {
|
||||
padding: 30rpx;
|
||||
}
|
||||
|
||||
.notice-item {
|
||||
border-radius: 20rpx;
|
||||
margin-bottom: 25rpx;
|
||||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.notice-image {
|
||||
width: 100%;
|
||||
height: 400rpx;
|
||||
border-radius: 20rpx 20rpx 0 0;
|
||||
}
|
||||
|
||||
.notice-main {
|
||||
background-color: white;
|
||||
border-radius: 0 0 20rpx 20rpx;
|
||||
padding: 20rpx 15rpx;
|
||||
}
|
||||
|
||||
.notice-title {
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.notice-content {
|
||||
font-size: 28ropx;
|
||||
color: #586271;
|
||||
margin: 20rpx 0;
|
||||
}
|
||||
|
||||
.notice-date {
|
||||
display: flex;
|
||||
font-size: 26rpx;
|
||||
color: #a0a7b1;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.date-image {
|
||||
width: 25rpx;
|
||||
height: 25rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
58
packages/homeServer/noticeManage/index.vue
Normal file
58
packages/homeServer/noticeManage/index.vue
Normal file
@ -0,0 +1,58 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view v-for="(item, index) in noticeList" :key="index">
|
||||
<view class="notice-item" @click="toNoticeDetail(item)">
|
||||
<image :src="item.image" class="notice-image"></image>
|
||||
<view class="notice-main">
|
||||
<view class="notice-title">{{ item.title }}</view>
|
||||
<view class="notice-content">{{ item.content }}</view>
|
||||
<view class="notice-date">
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/time.png"
|
||||
class="date-image"
|
||||
></image>
|
||||
<view>{{ item.date }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
request,
|
||||
picUrl,
|
||||
NavgateTo,
|
||||
menuButtonInfo,
|
||||
} from "../../../utils/index";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
noticeList: [
|
||||
{
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
title: "公告标题1",
|
||||
content: "公告内容",
|
||||
date: "2023-01-01",
|
||||
},
|
||||
{
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
title: "公告标题2",
|
||||
content: "公告内容",
|
||||
date: "2023-01-02",
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
toNoticeDetail(item) {
|
||||
NavgateTo("/packages/homeServer/noticeDetails/index");
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
@ -78,6 +78,43 @@
|
||||
}
|
||||
}
|
||||
|
||||
.tabs {
|
||||
align-items: center;
|
||||
background: #ffffff;
|
||||
height: 100rpx;
|
||||
padding: 0 20rpx;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 600rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.tabItem {
|
||||
font-size: 25rpx;
|
||||
color: #222222;
|
||||
margin-right: 60rpx;
|
||||
height: 42rpx;
|
||||
}
|
||||
|
||||
.active2 {
|
||||
font-size: 25rpx;
|
||||
font-weight: 700;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.active2::after {
|
||||
content: '';
|
||||
background: url(https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_active.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: 52rpx;
|
||||
height: 22rpx;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: -16rpx;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
/* 搜索指定内容 */
|
||||
.specifiedContent {
|
||||
min-height: 30rpx;
|
||||
@ -153,6 +190,10 @@
|
||||
.hot-services {
|
||||
margin: 20rpx;
|
||||
border: 1rpx solid #e8e8e8;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 80vh;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.section-header {
|
||||
|
||||
@ -18,7 +18,7 @@
|
||||
<input
|
||||
type="text"
|
||||
class="search-input"
|
||||
placeholder="请选择搜索指定内容"
|
||||
placeholder="请输入内容"
|
||||
v-model="searchText"
|
||||
@confirm="handleSearch"
|
||||
/>
|
||||
@ -26,7 +26,7 @@
|
||||
</view>
|
||||
|
||||
<!-- 搜索指定内容 -->
|
||||
<view
|
||||
<!-- <view
|
||||
class="specifiedContent"
|
||||
v-if="!isLoading && specifiedContent.length > 0 && !hasResult"
|
||||
>
|
||||
@ -42,7 +42,7 @@
|
||||
<view>{{ item.name }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
|
||||
<!-- 搜索历史 -->
|
||||
<view
|
||||
@ -73,12 +73,31 @@
|
||||
|
||||
<!-- 搜索结果 -->
|
||||
<view class="search-result" v-if="!isLoading && hasResult">
|
||||
<view class="hot-services">
|
||||
<view class="tabs">
|
||||
<view
|
||||
v-for="(item, index) in categoryList"
|
||||
:key="index"
|
||||
:class="['tabItem', selectedTab === index ? 'active2' : '']"
|
||||
@click="selectTab(index, item)"
|
||||
>
|
||||
{{ item.category_name }}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 全部 -->
|
||||
<searchAll v-if="selectedTab === 0" class="searchAll" />
|
||||
|
||||
<!-- 店铺 -->
|
||||
<searchShop v-if="selectedTab === 1" class="searchShop" />
|
||||
|
||||
<!-- 服务 -->
|
||||
<view class="hot-services" v-if="selectedTab === 2">
|
||||
<view class="service-list">
|
||||
<view
|
||||
class="service-card"
|
||||
v-for="(service, index) in hotServiceList"
|
||||
:key="index"
|
||||
@click="navigateToReservation(service)"
|
||||
>
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/ceshi.png"
|
||||
@ -99,12 +118,12 @@
|
||||
</view>
|
||||
<view class="service-info-right">
|
||||
<view class="service-footer">
|
||||
<view
|
||||
<!-- <view
|
||||
class="service-button"
|
||||
@click="navigateToReservation(service)"
|
||||
>
|
||||
<text class="button-text" @click="goSubscribe">去预约</text>
|
||||
</view>
|
||||
</view> -->
|
||||
<text class="service-count">{{ service.count }}</text>
|
||||
</view>
|
||||
</view>
|
||||
@ -121,9 +140,10 @@
|
||||
</view>
|
||||
|
||||
<!-- 回到顶部 -->
|
||||
<div
|
||||
<u-back-top :scroll-top="scrollTop"></u-back-top>
|
||||
<!-- <div
|
||||
class="toUp"
|
||||
v-show="searchHistory.length > 0 && isShowToTop"
|
||||
v-show="isShowToTop"
|
||||
@click="scrollToTop"
|
||||
>
|
||||
<u-badge
|
||||
@ -132,15 +152,23 @@
|
||||
max="99"
|
||||
:value="value"
|
||||
></u-badge>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/toUp.png"></image>
|
||||
</div>
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/toUp.png"
|
||||
></image>
|
||||
</div> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { request, NavgateTo } from "../../../utils/index";
|
||||
import SearchAll from "../searchAll/index.vue";
|
||||
import SearchShop from "../searchShop/index.vue";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
SearchAll,
|
||||
SearchShop,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isShowToTop: false,
|
||||
@ -172,10 +200,58 @@ export default {
|
||||
description: "专业保洁团队,全屋深度清洁,去除顽固污渍,还您清新居所",
|
||||
count: "已预约100+",
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
name: "空调清洗",
|
||||
image: "",
|
||||
badge: "推荐",
|
||||
tag: "平台保障",
|
||||
description: "专业保洁团队,全屋深度清洁,去除顽固污渍,还您清新居所",
|
||||
count: "已预约100+",
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
name: "空调清洗",
|
||||
image: "",
|
||||
badge: "推荐",
|
||||
tag: "平台保障",
|
||||
description: "专业保洁团队,全屋深度清洁,去除顽固污渍,还您清新居所",
|
||||
count: "已预约100+",
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
name: "空调清洗",
|
||||
image: "",
|
||||
badge: "推荐",
|
||||
tag: "平台保障",
|
||||
description: "专业保洁团队,全屋深度清洁,去除顽固污渍,还您清新居所",
|
||||
count: "已预约100+",
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
name: "空调清洗",
|
||||
image: "",
|
||||
badge: "推荐",
|
||||
tag: "平台保障",
|
||||
description: "专业保洁团队,全屋深度清洁,去除顽固污渍,还您清新居所",
|
||||
count: "已预约100+",
|
||||
},
|
||||
],
|
||||
|
||||
categoryList: [
|
||||
{ category_name: "全部" },
|
||||
{ category_name: "店铺" },
|
||||
{ category_name: "服务" },
|
||||
],
|
||||
selectedTab: 0,
|
||||
scrollTop: 0
|
||||
};
|
||||
},
|
||||
|
||||
onPageScroll(e) {
|
||||
this.scrollTop = e.scrollTop;
|
||||
},
|
||||
|
||||
created() {
|
||||
const history = uni.getStorageSync("searchHistory") || [];
|
||||
this.searchHistory = history;
|
||||
@ -186,8 +262,8 @@ export default {
|
||||
window.removeEventListener("scroll", this.handleScroll);
|
||||
},
|
||||
methods: {
|
||||
handleScroll() {
|
||||
this.isShowToTop = window.pageYOffset > 200;
|
||||
handleScroll(e) {
|
||||
this.isShowToTop = e.detail.scrollTop > 0;
|
||||
},
|
||||
scrollToTop() {
|
||||
uni.pageScrollTo({
|
||||
@ -198,6 +274,9 @@ export default {
|
||||
back() {
|
||||
NavgateTo("1");
|
||||
},
|
||||
selectTab(index, item) {
|
||||
this.selectedTab = index;
|
||||
},
|
||||
// 处理搜索
|
||||
handleSearch() {
|
||||
const keyword = this.searchText.trim();
|
||||
@ -256,10 +335,18 @@ export default {
|
||||
goSubscribe() {
|
||||
NavgateTo("/packages/homeServer/searchInfo/index");
|
||||
},
|
||||
|
||||
navigateToReservation(item) {
|
||||
uni.navigateTo({
|
||||
url: `/packages/homeServer/serverInfo/index?service=${encodeURIComponent(
|
||||
JSON.stringify(item)
|
||||
)}`,
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
</style>
|
||||
|
||||
509
packages/homeServer/searchAll/index.css
Normal file
509
packages/homeServer/searchAll/index.css
Normal file
@ -0,0 +1,509 @@
|
||||
page {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.container2 {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 83vh;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.main {
|
||||
flex: 1;
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
overflow-y: auto;
|
||||
position: relative;
|
||||
padding-bottom: 160rpx;
|
||||
}
|
||||
|
||||
.searchBox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.Filter {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-color: #fff;
|
||||
margin-top: -20rpx;
|
||||
}
|
||||
|
||||
.Filter_right {
|
||||
width: 133rpx;
|
||||
height: 110rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 0rpx 0rpx 0rpx 0rpx;
|
||||
font-size: 26rpx;
|
||||
color: #333;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-left: 200rpx;
|
||||
}
|
||||
|
||||
.activeFilter{
|
||||
color: #FF370B;
|
||||
}
|
||||
|
||||
.Filter_right image {
|
||||
width: 22rpx;
|
||||
height: 24rpx;
|
||||
margin-left: 7rpx;
|
||||
}
|
||||
|
||||
.iptBox {
|
||||
width: 431rpx;
|
||||
height: 70rpx;
|
||||
background: #F6F7FB;
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
margin-left: 40rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 30rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.iptBox image {
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
|
||||
.iptBox .u-input {
|
||||
padding: 0 !important;
|
||||
background-color: transparent !important;
|
||||
|
||||
}
|
||||
|
||||
.Filter_left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
overflow: hidden;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
|
||||
/* 选中状态图片样式 */
|
||||
.iconStyle {
|
||||
width: 25rpx !important;
|
||||
height: 45rpx !important;
|
||||
}
|
||||
|
||||
/* 默认状态样式 */
|
||||
.FilterItem image:not(.iconStyle) {
|
||||
width: 20rpx;
|
||||
height: 20rpx;
|
||||
}
|
||||
|
||||
.FilterItem:not(.active) {
|
||||
/* 默认字体样式 */
|
||||
font-size: 26rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.FilterItem {
|
||||
font-size: 26rpx;
|
||||
color: #222222;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 20rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.FilterItem image {
|
||||
width: 24rpx;
|
||||
height: 15rpx;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
|
||||
.MasterList {
|
||||
margin-top: 30rpx;
|
||||
background-color: #fff;
|
||||
padding: 12rpx 20rpx 20rpx 20rpx;
|
||||
}
|
||||
|
||||
.MasterItem {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 20rpx;
|
||||
border-bottom: 1rpx solid #EBEBEB;
|
||||
box-sizing: border-box;
|
||||
padding-bottom: 30rpx;
|
||||
padding-top: 20rpx;
|
||||
}
|
||||
|
||||
.MasterItem:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.MasterItem_right {
|
||||
flex: 1;
|
||||
background: #FFFFFF;
|
||||
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||||
}
|
||||
|
||||
.MasterItem_info {
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
|
||||
.MasterItem_Info_left {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
width: 130rpx;
|
||||
margin-right: 40rpx;
|
||||
}
|
||||
|
||||
.MasterItem_Info_left image {
|
||||
width: 130rpx;
|
||||
height: 130rpx;
|
||||
}
|
||||
|
||||
.state {
|
||||
width: 110rpx;
|
||||
height: 40rpx;
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 26rpx;
|
||||
color: #FFFFFF;
|
||||
margin: 0 auto;
|
||||
margin-top: -20rpx;
|
||||
z-index: 2;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.state1 {
|
||||
background: #AECE2B;
|
||||
|
||||
}
|
||||
|
||||
.state2 {
|
||||
background: #CECECE;
|
||||
}
|
||||
|
||||
.state3 {
|
||||
background: #FF370B;
|
||||
}
|
||||
|
||||
.MasterItem_Info_right {
|
||||
flex: 1;
|
||||
|
||||
}
|
||||
|
||||
.filter-section {
|
||||
padding: 20rpx 30rpx;
|
||||
border-bottom: 1rpx solid #f5f5f5;
|
||||
}
|
||||
.filter-title {
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
margin-bottom: 20rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
.filter-options {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 15rpx;
|
||||
}
|
||||
.filter-option {
|
||||
background: #f5f5f5;
|
||||
border-radius: 50rpx;
|
||||
padding: 12rpx 30rpx;
|
||||
font-size: 24rpx;
|
||||
color: #666;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.filter-option.active {
|
||||
background: #ff370b;
|
||||
color: white;
|
||||
}
|
||||
.price-range {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 20rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
.price-input {
|
||||
flex: 1;
|
||||
height: 60rpx;
|
||||
background: #f5f5f5;
|
||||
border-radius: 10rpx;
|
||||
padding: 0 20rpx;
|
||||
font-size: 24rpx;
|
||||
border: none;
|
||||
}
|
||||
.price-separator {
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
}
|
||||
.filter-buttons {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 20rpx 30rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
.reset-button {
|
||||
width: 200rpx;
|
||||
height: 70rpx;
|
||||
border: 1rpx solid #7abbff;
|
||||
border-radius: 50rpx;
|
||||
background: #f0f7ff;
|
||||
color: #409eff;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.confirm-button {
|
||||
width: 200rpx;
|
||||
height: 70rpx;
|
||||
background: #409eff;
|
||||
border-radius: 50rpx;
|
||||
color: white;
|
||||
font-size: 28rpx;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.MasterItem_Info_right_1 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 36rpx;
|
||||
color: #222222;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.Medal {
|
||||
width: 35rpx;
|
||||
height: 40rpx;
|
||||
margin-left: 6rpx;
|
||||
margin-right: 28rpx;
|
||||
}
|
||||
|
||||
.star {
|
||||
width: 22rpx;
|
||||
height: 22rpx;
|
||||
margin-right: 6rpx;
|
||||
}
|
||||
|
||||
.MasterItem_Info_right_1 span {
|
||||
font-size: 26rpx;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.MasterItem_Info_right_2 {
|
||||
font-size: 26rpx;
|
||||
color: #999999;
|
||||
margin-top: 8rpx;
|
||||
}
|
||||
|
||||
.MasterItem_Info_right_3 {
|
||||
font-size: 26rpx;
|
||||
display: flex;
|
||||
color: #999999;
|
||||
align-items: center;
|
||||
margin-top: 16rpx;
|
||||
}
|
||||
|
||||
.MasterItem_Info_right_3 span {
|
||||
color: #FF370B;
|
||||
|
||||
}
|
||||
|
||||
.MasterItem_Info_right_4 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 16rpx;
|
||||
}
|
||||
|
||||
.tagItem {
|
||||
width: 130rpx;
|
||||
height: 40rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
font-size: 22rpx;
|
||||
color: #555555;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.tag1 {
|
||||
background: rgba(255, 178, 23, 0.1);
|
||||
}
|
||||
|
||||
.tag2 {
|
||||
background: rgba(255, 81, 42, 0.1);
|
||||
}
|
||||
|
||||
.tag3 {
|
||||
background: rgba(175, 175, 175, 0.1);
|
||||
}
|
||||
|
||||
.MasterItem_Info_right_5 {
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 16rpx;
|
||||
}
|
||||
|
||||
.MasterItem_Info_right_5 span {
|
||||
color: #FF370B;
|
||||
}
|
||||
|
||||
.MasterItem_Info_right_6 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.MasterItem_Info_right_6 image {
|
||||
width: 110rpx;
|
||||
height: 110rpx;
|
||||
margin-right: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.Btn {
|
||||
font-size: 36rpx;
|
||||
color: #FFFFFF;
|
||||
width: 600rpx;
|
||||
height: 90rpx;
|
||||
background: linear-gradient(91deg, #FF7658 0%, #FF370B 100%);
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
bottom: 60rpx;
|
||||
transform: translateX(-50%);
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.local {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.local span {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.filterMore1 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
overflow: hidden;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.filterMoreItem {
|
||||
font-size: 28rpx;
|
||||
color: #222222;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-color: #f6f6fa;
|
||||
padding: 0 20rpx;
|
||||
margin-right: 10rpx;
|
||||
margin-right: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
padding: 10rpx 20rpx;
|
||||
}
|
||||
|
||||
.filterMore2_item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 20rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.filterMore2_item_left {}
|
||||
|
||||
.active3 {
|
||||
color: #ff702c !important;
|
||||
}
|
||||
|
||||
.filterMore2_item_left2 {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.filterMore3Item {
|
||||
font-size: 26rpx;
|
||||
color: #555555;
|
||||
width: 130rpx;
|
||||
height: 50rpx;
|
||||
background: #F6F7FB;
|
||||
border-radius: 10rpx 10rpx 10rpx 10rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-right: 40rpx;
|
||||
margin-bottom: 18rpx;
|
||||
}
|
||||
|
||||
.filterMore3Item:nth-child(4n) {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.fullscreen-black-bg {
|
||||
/* position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
background-color: rgba(0, 0, 0, .4);
|
||||
box-sizing: border-box;
|
||||
z-index: 9;
|
||||
overflow: hidden; */
|
||||
}
|
||||
|
||||
.FilterMore3 {
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
padding: 20rpx;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.FilterMore {
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
padding: 20rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.dialogBox {
|
||||
position: absolute;
|
||||
background-color: rgba(0, 0, 0, .4);
|
||||
z-index: 8;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
|
||||
.master_info_right_left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.master_info_right_right {
|
||||
font-size: 28rpx;
|
||||
color: #FF370B;
|
||||
}
|
||||
433
packages/homeServer/searchAll/index.vue
Normal file
433
packages/homeServer/searchAll/index.vue
Normal file
@ -0,0 +1,433 @@
|
||||
<template>
|
||||
<view class="container2">
|
||||
<div class="header">
|
||||
<div class="Filter">
|
||||
<div class="Filter_left">
|
||||
<div
|
||||
v-for="filter in filters"
|
||||
:key="filter.id"
|
||||
class="FilterItem"
|
||||
:class="{ active: selectedFilter === filter.id }"
|
||||
@click="
|
||||
showDialog(filter.id);
|
||||
selectedFilter = filter.id;
|
||||
"
|
||||
>
|
||||
{{ filter.label }}
|
||||
<image
|
||||
:src="
|
||||
selectedFilter === filter.id
|
||||
? 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/search_up.png'
|
||||
: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/homeServer_filterMore.png'
|
||||
"
|
||||
:class="{ iconStyle: selectedFilter === filter.id }"
|
||||
></image>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="Filter_right" @click="showDialog(6)">
|
||||
<text :class="{ activeFilter: show6 }">筛选</text>
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/homeServer_filter.png"
|
||||
></image>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 位置筛选 -->
|
||||
<div class="FilterMore" v-if="show1">
|
||||
<div class="local">距离 <span>上海公馆</span></div>
|
||||
<div class="filterMore1">
|
||||
<div class="filterMoreItem">附近</div>
|
||||
<div class="filterMoreItem">500m</div>
|
||||
<div class="filterMoreItem">1km</div>
|
||||
<div class="filterMoreItem">3km</div>
|
||||
<div class="filterMoreItem">5km</div>
|
||||
<div class="filterMoreItem">10km</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 综合筛选 -->
|
||||
<div class="FilterMore" v-if="show2">
|
||||
<div class="filterMore2_item">
|
||||
<div class="filterMore2_item_left">综合</div>
|
||||
<div class="filterMore2_item_right">
|
||||
<u-icon name="checkmark-circle-fill" color="#ff702c"></u-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div class="filterMore2_item">
|
||||
<div class="filterMore2_item_left active3">从高到低</div>
|
||||
<div class="filterMore2_item_right">
|
||||
<u-icon name="checkmark-circle-fill" color="#ff702c"></u-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div class="filterMore2_item">
|
||||
<div class="filterMore2_item_left">从低到高</div>
|
||||
<div class="filterMore2_item_right">
|
||||
<u-icon name="checkmark-circle-fill" color="#ff702c"></u-icon>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 排序筛选 -->
|
||||
<div class="FilterMore" v-if="show3">
|
||||
<div class="filterMore2_item">
|
||||
<div class="filterMore2_item_left2">智能排序</div>
|
||||
<div class="filterMore2_item_right">
|
||||
<u-icon name="checkmark-circle-fill" color="#ff702c"></u-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div class="filterMore2_item">
|
||||
<div class="filterMore2_item_left2 active3">距离优先</div>
|
||||
<div class="filterMore2_item_right">
|
||||
<u-icon name="checkmark-circle-fill" color="#ff702c"></u-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div class="filterMore2_item">
|
||||
<div class="filterMore2_item_left2">好评优先</div>
|
||||
<div class="filterMore2_item_right">
|
||||
<u-icon name="checkmark-circle-fill" color="#ff702c"></u-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div class="filterMore2_item">
|
||||
<div class="filterMore2_item_left2">销量优先</div>
|
||||
<div class="filterMore2_item_right">
|
||||
<u-icon name="checkmark-circle-fill" color="#ff702c"></u-icon>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 高级筛选面板 -->
|
||||
<div class="FilterMore" v-if="show6">
|
||||
<div class="filter-section">
|
||||
<div class="filter-title">满意度</div>
|
||||
<div class="filter-options">
|
||||
<div
|
||||
class="filter-option"
|
||||
:class="{ active: selectedSatisfaction.includes('5+') }"
|
||||
@click="toggleSatisfaction('5+')"
|
||||
>
|
||||
5分及以上
|
||||
</div>
|
||||
<div
|
||||
class="filter-option"
|
||||
:class="{ active: selectedSatisfaction.includes('4.9+') }"
|
||||
@click="toggleSatisfaction('4.9+')"
|
||||
>
|
||||
4.9分及以上
|
||||
</div>
|
||||
<div
|
||||
class="filter-option"
|
||||
:class="{ active: selectedSatisfaction.includes('4.8+') }"
|
||||
@click="toggleSatisfaction('4.8+')"
|
||||
>
|
||||
4.8分及以上
|
||||
</div>
|
||||
<div
|
||||
class="filter-option"
|
||||
:class="{ active: selectedSatisfaction.includes('4.7+') }"
|
||||
@click="toggleSatisfaction('4.7+')"
|
||||
>
|
||||
4.7分及以上
|
||||
</div>
|
||||
<div
|
||||
class="filter-option"
|
||||
:class="{ active: selectedSatisfaction.includes('4.6+') }"
|
||||
@click="toggleSatisfaction('4.6+')"
|
||||
>
|
||||
4.6分及以上
|
||||
</div>
|
||||
<div
|
||||
class="filter-option"
|
||||
:class="{ active: selectedSatisfaction.includes('4.5+') }"
|
||||
@click="toggleSatisfaction('4.5+')"
|
||||
>
|
||||
4.5分及以上
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="filter-section">
|
||||
<div class="filter-title">评论数量</div>
|
||||
<div class="filter-options">
|
||||
<div
|
||||
class="filter-option"
|
||||
:class="{ active: selectedReviewCount === '1-100' }"
|
||||
@click="selectedReviewCount = '1-100'"
|
||||
>
|
||||
1-100
|
||||
</div>
|
||||
<div
|
||||
class="filter-option"
|
||||
:class="{ active: selectedReviewCount === '100-500' }"
|
||||
@click="selectedReviewCount = '100-500'"
|
||||
>
|
||||
100-500
|
||||
</div>
|
||||
<div
|
||||
class="filter-option"
|
||||
:class="{ active: selectedReviewCount === '500+' }"
|
||||
@click="selectedReviewCount = '500+'"
|
||||
>
|
||||
500以上
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="filter-section">
|
||||
<div class="filter-title">价格范围</div>
|
||||
<div class="price-range">
|
||||
<input
|
||||
type="number"
|
||||
v-model="minPrice"
|
||||
placeholder="最低价"
|
||||
class="price-input"
|
||||
@input="validatePriceRange"
|
||||
/>
|
||||
<span class="price-separator">—</span>
|
||||
<input
|
||||
type="number"
|
||||
v-model="maxPrice"
|
||||
placeholder="最高价"
|
||||
class="price-input"
|
||||
@input="validatePriceRange"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="filter-section">
|
||||
<div class="filter-title">类别</div>
|
||||
<div class="filter-options">
|
||||
<div
|
||||
class="filter-option"
|
||||
:class="{ active: selectedCategory === 'airConditioner' }"
|
||||
@click="selectedCategory = 'airConditioner'"
|
||||
>
|
||||
空调维修
|
||||
</div>
|
||||
<div
|
||||
class="filter-option"
|
||||
:class="{ active: selectedCategory === 'refrigerator' }"
|
||||
@click="selectedCategory = 'refrigerator'"
|
||||
>
|
||||
冰箱维修
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="filter-buttons">
|
||||
<button class="reset-button" @click="resetFilters">重置</button>
|
||||
<button class="confirm-button" @click="applyFilters">确定</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="main">
|
||||
<!-- 遮罩 -->
|
||||
<div class="dialogBox" v-if="isShowDia"></div>
|
||||
|
||||
<div class="MasterList">
|
||||
<div class="MasterItem" v-for="(item, index) in 5" :key="index">
|
||||
<div class="MasterItem_right">
|
||||
<div class="MasterItem_info">
|
||||
<div class="MasterItem_Info_left">
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/home_icon12.png"
|
||||
></image>
|
||||
<div class="state state1">待服务</div>
|
||||
<div class="state state2" v-if="false">休息中</div>
|
||||
<div class="state state3" v-if="false">服务中</div>
|
||||
</div>
|
||||
<div class="MasterItem_Info_right">
|
||||
<div class="MasterItem_Info_right_1">
|
||||
<div class="master_info_right_left">
|
||||
林师傅
|
||||
<image
|
||||
class="Medal"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/homeServer_Champion.png"
|
||||
>
|
||||
</image>
|
||||
<image
|
||||
class="Medal"
|
||||
v-if="false"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/homeServer_RunnerUp.png"
|
||||
>
|
||||
</image>
|
||||
<image
|
||||
class="star"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_start1.png"
|
||||
></image>
|
||||
<span>4.8</span>
|
||||
</div>
|
||||
|
||||
<div class="master_info_right_right" @click="masterInfo">
|
||||
查看资料
|
||||
</div>
|
||||
</div>
|
||||
<div class="MasterItem_Info_right_2">
|
||||
52岁 广东梅州人 5-10年
|
||||
</div>
|
||||
<div class="MasterItem_Info_right_3">
|
||||
<span>500+</span>预定 <span>100+</span>评价
|
||||
</div>
|
||||
<div class="MasterItem_Info_right_4">
|
||||
<div class="tagItem tag1">积极主动</div>
|
||||
<div class="tagItem tag2">技术精湛</div>
|
||||
<div class="tagItem tag3">技术精湛</div>
|
||||
</div>
|
||||
|
||||
<div class="MasterItem_Info_right_5">
|
||||
价格范围: <span>¥500-¥800</span>
|
||||
</div>
|
||||
|
||||
<div class="MasterItem_Info_right_6">
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_MsgImg1.png"
|
||||
></image>
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_MsgImg1.png"
|
||||
></image>
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_MsgImg1.png"
|
||||
></image>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.FilterItem.active {
|
||||
color: red;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
import {
|
||||
request,
|
||||
picUrl,
|
||||
NavgateTo,
|
||||
menuButtonInfo,
|
||||
} from "../../../utils/index";
|
||||
import { apiArr } from "../../../api/reservation";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
top: "",
|
||||
localHeight: "",
|
||||
selectedFilter: null,
|
||||
// 筛选条件数据
|
||||
filters: [
|
||||
{ id: 1, label: "附近" },
|
||||
{ id: 2, label: "综合" },
|
||||
{ id: 3, label: "排序" },
|
||||
],
|
||||
show1: false,
|
||||
show2: false,
|
||||
show3: false,
|
||||
show4: false,
|
||||
show5: false,
|
||||
show6: false,
|
||||
isShowDia: false,
|
||||
selectedSatisfaction: [],
|
||||
selectedReviewCount: null,
|
||||
selectedCategory: null,
|
||||
minPrice: 0,
|
||||
maxPrice: "",
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
show1(val) {
|
||||
if (!val) this.selectedFilter = null;
|
||||
},
|
||||
show2(val) {
|
||||
if (!val) this.selectedFilter = null;
|
||||
},
|
||||
show3(val) {
|
||||
if (!val) this.selectedFilter = null;
|
||||
},
|
||||
show6(val) {
|
||||
if (!val) this.selectedFilter = null;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
masterInfo() {
|
||||
NavgateTo("../masterInfo/index");
|
||||
},
|
||||
back() {
|
||||
NavgateTo("1");
|
||||
},
|
||||
toggleSatisfaction(value) {
|
||||
const index = this.selectedSatisfaction.indexOf(value);
|
||||
if (index === -1) {
|
||||
this.selectedSatisfaction.push(value);
|
||||
} else {
|
||||
this.selectedSatisfaction.splice(index, 1);
|
||||
}
|
||||
},
|
||||
validatePriceRange() {
|
||||
// 确保最小值在0-99999之间
|
||||
if (this.minPrice < 0) this.minPrice = 0;
|
||||
if (this.minPrice > 99999) this.minPrice = 99999;
|
||||
// 确保最大值在0-99999之间且不小于最小值
|
||||
if (
|
||||
this.maxPrice &&
|
||||
(this.maxPrice < this.minPrice || this.maxPrice > 99999)
|
||||
) {
|
||||
this.maxPrice = Math.min(Math.max(this.maxPrice, this.minPrice), 99999);
|
||||
}
|
||||
},
|
||||
resetFilters() {
|
||||
this.selectedSatisfaction = [];
|
||||
this.selectedReviewCount = null;
|
||||
this.selectedCategory = null;
|
||||
this.minPrice = 0;
|
||||
this.maxPrice = "";
|
||||
},
|
||||
applyFilters() {
|
||||
const filterData = {
|
||||
satisfaction: this.selectedSatisfaction,
|
||||
reviewCount: this.selectedReviewCount,
|
||||
category: this.selectedCategory,
|
||||
priceRange: {
|
||||
min: this.minPrice || 0,
|
||||
max: this.maxPrice || 99999,
|
||||
},
|
||||
};
|
||||
console.log("筛选条件:", filterData);
|
||||
this.show6 = false;
|
||||
this.isShowDia = false;
|
||||
},
|
||||
showDialog(index) {
|
||||
this[`show${index}`] = !this[`show${index}`];
|
||||
this.logOtherButtons(index);
|
||||
this.isShowDia = this[`show${index}`];
|
||||
},
|
||||
logOtherButtons(excludeIndex) {
|
||||
for (let i = 1; i <= 6; i++) {
|
||||
if (i !== excludeIndex) {
|
||||
this[`show${i}`] = false;
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
onReady() {},
|
||||
|
||||
onLoad(options) {
|
||||
const meun = menuButtonInfo();
|
||||
this.top = meun.top;
|
||||
this.localHeight = meun.height;
|
||||
},
|
||||
onShow() {},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom() {},
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
@ -4,14 +4,15 @@ page {
|
||||
}
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
display: grid;
|
||||
grid-template-rows: auto 1fr;
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.header {
|
||||
z-index: 9;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.main {
|
||||
|
||||
@ -62,6 +62,13 @@
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/homeServer_filterMore.png"
|
||||
></image>
|
||||
</div>
|
||||
|
||||
<div class="FilterItem" @click="showDialog(6)">
|
||||
地区
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/homeServer_filterMore.png"
|
||||
></image>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="Filter_right">
|
||||
@ -147,12 +154,50 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 地区筛选 -->
|
||||
<u-popup :show="show6" @close="close" v-if="show6">
|
||||
<view>
|
||||
<picker-view
|
||||
indicator-style="height: 50px;"
|
||||
style="width: 100%; height: 400rpx"
|
||||
:value="id"
|
||||
@change="bindChange"
|
||||
>
|
||||
<picker-view-column>
|
||||
<view
|
||||
v-for="(item, index) in provList"
|
||||
:key="index"
|
||||
style="line-height: 50px; text-align: center"
|
||||
>{{ item.short_name }}</view
|
||||
>
|
||||
</picker-view-column>
|
||||
<picker-view-column>
|
||||
<view
|
||||
v-for="(item, index) in defaultCity"
|
||||
:key="index"
|
||||
style="line-height: 50px; text-align: center"
|
||||
>{{ item.short_name }}</view
|
||||
>
|
||||
</picker-view-column>
|
||||
<picker-view-column>
|
||||
<view
|
||||
v-for="(item, index) in defaultDist"
|
||||
:key="index"
|
||||
style="line-height: 50px; text-align: center"
|
||||
>{{ item.short_name }}</view
|
||||
>
|
||||
</picker-view-column>
|
||||
</picker-view>
|
||||
</view>
|
||||
</u-popup>
|
||||
|
||||
|
||||
<div class="main">
|
||||
<!-- 遮罩 -->
|
||||
<div class="dialogBox" v-if="isShowDia"></div>
|
||||
|
||||
<div class="MasterList">
|
||||
<div class="MasterItem" v-for="(item, index) in 3" :key="index">
|
||||
<div class="MasterItem" v-for="(item, index) in 5" :key="index">
|
||||
<div class="MasterItem_right">
|
||||
<div class="MasterItem_info">
|
||||
<div class="MasterItem_Info_left">
|
||||
@ -222,7 +267,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="Btn">确定</div>
|
||||
<!-- <div class="Btn">确定</div> -->
|
||||
</div>
|
||||
</view>
|
||||
</template>
|
||||
@ -235,6 +280,7 @@ import {
|
||||
menuButtonInfo,
|
||||
} from "../../../utils/index";
|
||||
import { apiArr } from "../../../api/reservation";
|
||||
import { apiArr as apiArr2 } from "../../../api/area";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
@ -246,7 +292,19 @@ export default {
|
||||
show3: false,
|
||||
show4: false,
|
||||
show5: false,
|
||||
show6: false,
|
||||
isShowDia: false,
|
||||
id: [0, 0, 0], // 默认选中第一个省、市、区
|
||||
|
||||
provList: [], // 省
|
||||
cityList: [], //市
|
||||
distList: [], // 区
|
||||
defaultCity: [], // 默认展示的市区数据
|
||||
defaultDist: [], // 默认展示的县/区数据
|
||||
confirmProv: {}, // 默认选中省
|
||||
confirmProv1: {},
|
||||
confirmCity: {}, // 默认选中市
|
||||
confirmDist: {}, // 默认选中区/县
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
@ -260,15 +318,97 @@ export default {
|
||||
showDialog(index) {
|
||||
this[`show${index}`] = !this[`show${index}`];
|
||||
this.logOtherButtons(index);
|
||||
this.isShowDia = this[`show${index}`]
|
||||
this.isShowDia = this[`show${index}`];
|
||||
},
|
||||
close() {
|
||||
this.show6 = false;
|
||||
this.isShowDia = false;
|
||||
},
|
||||
logOtherButtons(excludeIndex) {
|
||||
for (let i = 1; i <= 5; i++) {
|
||||
for (let i = 1; i <= 6; i++) {
|
||||
if (i == 6) {
|
||||
this.getProvList();
|
||||
}
|
||||
if (i !== excludeIndex) {
|
||||
this[`show${i}`] = false
|
||||
this[`show${i}`] = false;
|
||||
}
|
||||
}
|
||||
},
|
||||
/////////////////////////////////// 省市区方法///////////////////////////////////////////
|
||||
// 获取省份信息
|
||||
async getProvList() {
|
||||
const res = await request(apiArr2.getArea, "POST", {}, { silent: false });
|
||||
this.provList = res.rows;
|
||||
this.confirmProv1 = res.rows[0];
|
||||
// 加载默认省份的城市数据
|
||||
this.getCityList(0);
|
||||
// 缓存省市区数据
|
||||
},
|
||||
|
||||
// 获取市区信息
|
||||
async getCityList(sq = 0, x = 0) {
|
||||
console.log("11swq", sq);
|
||||
console.log("获取x", x);
|
||||
if (!this.sf && this.cityList.length > 0) {
|
||||
console.log("省份没变,查市跟区", this.cityList);
|
||||
let newDist = this.cityList[sq];
|
||||
console.log("新的市信息", newDist);
|
||||
if (this.xsq.ad_code !== newDist.ad_code) {
|
||||
console.log("新市区跟旧市区不一直");
|
||||
this.xsq = newDist;
|
||||
this.getDistList(this.confirmCity, x);
|
||||
} else {
|
||||
console.log("新市区跟旧市区一直");
|
||||
this.confirmDist = this.defaultDist[x];
|
||||
}
|
||||
return;
|
||||
}
|
||||
const res = await request(
|
||||
apiArr2.getArea,
|
||||
"POST",
|
||||
{ parent_ad_code: this.confirmProv1.ad_code },
|
||||
{ silent: false }
|
||||
);
|
||||
this.cityList = res.rows;
|
||||
let newDist;
|
||||
|
||||
this.defaultCity = res.rows;
|
||||
this.confirmCity = res.rows[0]; // 拿市的第一条区查区
|
||||
this.getDistList(newDist, x);
|
||||
},
|
||||
// 获取 县/区 信息
|
||||
async getDistList(xsq, x) {
|
||||
console.log("页面传递的x", x);
|
||||
const res = await request(
|
||||
apiArr2.getArea,
|
||||
"POST",
|
||||
{ parent_ad_code: xsq ? xsq.ad_code : this.confirmCity.ad_code },
|
||||
{ silent: false }
|
||||
);
|
||||
this.distList = res.rows;
|
||||
this.defaultDist = res.rows;
|
||||
this.confirmDist = res.rows[0]; // 区的第一条信息
|
||||
this.id = [0, 0, 0]; // 刷新选择器视图
|
||||
},
|
||||
|
||||
// 切换省市区时联动改变参数值
|
||||
bindChange(e) {
|
||||
console.log("[1231331], e", e);
|
||||
const { value } = e.detail;
|
||||
// // 每次切换时,根据当前点击的省过滤出所属市区,并且变化县/区
|
||||
let newCrty = this.provList[value[0]];
|
||||
console.log("新的省份信息", newCrty);
|
||||
console.log("旧的省信息", this.confirmProv1);
|
||||
if (newCrty.ad_code === this.confirmProv1.ad_code) {
|
||||
console.log("省份信息没变");
|
||||
this.sf = false;
|
||||
} else {
|
||||
this.sf = true;
|
||||
}
|
||||
console.log("this.cityListthis.cityList", this.cityList);
|
||||
this.confirmProv1 = newCrty;
|
||||
this.getCityList(value[1], value[2]);
|
||||
},
|
||||
},
|
||||
onReady() {},
|
||||
|
||||
@ -277,6 +417,7 @@ export default {
|
||||
this.top = meun.top;
|
||||
// this.top = meun.height + meun.top;
|
||||
this.localHeight = meun.height;
|
||||
this.getProvList(); // 初始化加载省份数据
|
||||
},
|
||||
onShow() {},
|
||||
|
||||
|
||||
73
packages/homeServer/searchShop/index.css
Normal file
73
packages/homeServer/searchShop/index.css
Normal file
@ -0,0 +1,73 @@
|
||||
.shop-list {
|
||||
padding: 20rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 80vh;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.shop-card {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 20rpx;
|
||||
border-bottom: 1rpx solid #f5f5f5;
|
||||
}
|
||||
|
||||
.shop-img {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
border-radius: 10rpx;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.shop-info {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.shop-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.shop-rating {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.rating-count {
|
||||
margin-right: 15rpx;
|
||||
align-items: center;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
margin: 20rpx 0;
|
||||
}
|
||||
|
||||
.rating-stars {
|
||||
color: #FFC107;
|
||||
margin-right: 15rpx;
|
||||
}
|
||||
|
||||
.distance {
|
||||
margin-right: 15rpx;
|
||||
}
|
||||
|
||||
.fans {
|
||||
margin-right: 15rpx;
|
||||
}
|
||||
|
||||
.enter-shop-btn {
|
||||
width: 120rpx;
|
||||
height: 60rpx;
|
||||
background-color: #FF370B;
|
||||
color: white;
|
||||
border-radius: 30rpx;
|
||||
border: none;
|
||||
font-size: 28rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
213
packages/homeServer/searchShop/index.vue
Normal file
213
packages/homeServer/searchShop/index.vue
Normal file
@ -0,0 +1,213 @@
|
||||
<template>
|
||||
<view class="shop-list">
|
||||
<view class="shop-card" v-for="shop in shops" :key="shop.id">
|
||||
<image :src="shop.image" class="shop-img"></image>
|
||||
<view class="shop-info">
|
||||
<view class="shop-title">{{ shop.title }}</view>
|
||||
<view class="rating-count">{{ shop.ratingCount }}条评价</view>
|
||||
<view class="shop-rating">
|
||||
<view class="rating-stars">
|
||||
<text class="star">★</text>
|
||||
<text class="rating-score">{{ shop.rating }}</text>
|
||||
</view>
|
||||
<view class="distance">
|
||||
<text class="distance-value">{{ shop.distance }}km</text>
|
||||
</view>
|
||||
<view class="fans">
|
||||
<text class="fans-count">{{ shop.fans }}个粉丝</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<button class="enter-shop-btn" @click="goShop">进店</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
request,
|
||||
picUrl,
|
||||
NavgateTo,
|
||||
menuButtonInfo,
|
||||
} from "../../../utils/index";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
shops: [
|
||||
{
|
||||
id: 1,
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
title: "专业到家服务",
|
||||
ratingCount: 5,
|
||||
rating: 4.8,
|
||||
distance: 3.0,
|
||||
fans: 120,
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
title: "专业到家服务",
|
||||
ratingCount: 5,
|
||||
rating: 4.8,
|
||||
distance: 3.0,
|
||||
fans: 120,
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
title: "专业到家服务",
|
||||
ratingCount: 5,
|
||||
rating: 4.8,
|
||||
distance: 3.0,
|
||||
fans: 120,
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
title: "专业到家服务",
|
||||
ratingCount: 5,
|
||||
rating: 4.8,
|
||||
distance: 3.0,
|
||||
fans: 120,
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
title: "专业到家服务",
|
||||
ratingCount: 5,
|
||||
rating: 4.8,
|
||||
distance: 3.0,
|
||||
fans: 120,
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
title: "专业到家服务",
|
||||
ratingCount: 5,
|
||||
rating: 4.8,
|
||||
distance: 3.0,
|
||||
fans: 120,
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
title: "专业到家服务",
|
||||
ratingCount: 5,
|
||||
rating: 4.8,
|
||||
distance: 3.0,
|
||||
fans: 120,
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
title: "专业到家服务",
|
||||
ratingCount: 5,
|
||||
rating: 4.8,
|
||||
distance: 3.0,
|
||||
fans: 120,
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
title: "专业到家服务",
|
||||
ratingCount: 5,
|
||||
rating: 4.8,
|
||||
distance: 3.0,
|
||||
fans: 120,
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
title: "专业到家服务",
|
||||
ratingCount: 5,
|
||||
rating: 4.8,
|
||||
distance: 3.0,
|
||||
fans: 120,
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
title: "专业到家服务",
|
||||
ratingCount: 5,
|
||||
rating: 4.8,
|
||||
distance: 3.0,
|
||||
fans: 120,
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
title: "专业到家服务",
|
||||
ratingCount: 5,
|
||||
rating: 4.8,
|
||||
distance: 3.0,
|
||||
fans: 120,
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
title: "专业到家服务",
|
||||
ratingCount: 5,
|
||||
rating: 4.8,
|
||||
distance: 3.0,
|
||||
fans: 120,
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
title: "专业到家服务",
|
||||
ratingCount: 5,
|
||||
rating: 4.8,
|
||||
distance: 3.0,
|
||||
fans: 120,
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
title: "专业到家服务",
|
||||
ratingCount: 5,
|
||||
rating: 4.8,
|
||||
distance: 3.0,
|
||||
fans: 120,
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
title: "专业到家服务",
|
||||
ratingCount: 5,
|
||||
rating: 4.8,
|
||||
distance: 3.0,
|
||||
fans: 120,
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
title: "专业到家服务",
|
||||
ratingCount: 5,
|
||||
rating: 4.8,
|
||||
distance: 3.0,
|
||||
fans: 120,
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
title: "专业到家服务",
|
||||
ratingCount: 5,
|
||||
rating: 4.8,
|
||||
distance: 3.0,
|
||||
fans: 120,
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
goShop() {
|
||||
NavgateTo("../vendor/index");
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
@ -10,6 +10,29 @@
|
||||
height: 307rpx;
|
||||
}
|
||||
|
||||
.cirList {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0 auto;
|
||||
margin-top: 10rpx;
|
||||
padding-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.cir {
|
||||
width: 6rpx;
|
||||
height: 6rpx;
|
||||
border-radius: 50%;
|
||||
background-color: #333;
|
||||
margin-right: 6rpx;
|
||||
}
|
||||
|
||||
.active {
|
||||
width: 12rpx;
|
||||
height: 6rpx;
|
||||
border-radius: 100rpx;
|
||||
}
|
||||
|
||||
.dotList {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -92,7 +115,7 @@
|
||||
}
|
||||
|
||||
.serverListTit {
|
||||
font-size: 63rpx;
|
||||
font-size: 32rpx;
|
||||
color: #222222;
|
||||
font-weight: 600;
|
||||
}
|
||||
@ -119,6 +142,7 @@
|
||||
}
|
||||
|
||||
.msg_tit {
|
||||
display: flex;
|
||||
font-size: 30rpx;
|
||||
color: #222222;
|
||||
margin-bottom: 20rpx;
|
||||
@ -145,15 +169,7 @@
|
||||
justify-content: center;
|
||||
font-size: 30rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.serverItem_right_btn .more {
|
||||
width: 26rpx;
|
||||
height: 26rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 50%;
|
||||
margin-left: 200rpx;
|
||||
}
|
||||
|
||||
.range {
|
||||
@ -186,4 +202,131 @@
|
||||
/* 添加左右间距 */
|
||||
min-width: 0;
|
||||
/* 防止 flex 子项溢出 */
|
||||
}
|
||||
|
||||
.msg_meta {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 12rpx;
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.msg_meta .rating,
|
||||
.msg_meta .distance,
|
||||
.msg_meta .served {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.infoImage {
|
||||
width: 25rpx;
|
||||
height: 25rpx;
|
||||
margin-right: 5rpx;
|
||||
}
|
||||
|
||||
.tabs {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: #ffffff;
|
||||
height: 100rpx;
|
||||
padding: 0 20rpx;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.tabItem {
|
||||
font-size: 25rpx;
|
||||
color: #222222;
|
||||
margin-right: 60rpx;
|
||||
height: 42rpx;
|
||||
}
|
||||
|
||||
.active2 {
|
||||
font-size: 25rpx;
|
||||
font-weight: 700;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.active2::after {
|
||||
content: '';
|
||||
background: url(https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_active.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: 52rpx;
|
||||
height: 22rpx;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: -16rpx;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.FilterMore {
|
||||
width: 100%;
|
||||
height: 220rpx;
|
||||
background-color: #fff;
|
||||
padding: 20rpx;
|
||||
box-sizing: border-box;
|
||||
/* 添加阴影 */
|
||||
box-shadow: 0 0 8rpx rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.filter-section {
|
||||
padding: 20rpx 30rpx;
|
||||
border-bottom: 1rpx solid #f5f5f5;
|
||||
}
|
||||
|
||||
.filter-title {
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
margin-bottom: 20rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.price-range {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 20rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.price-input {
|
||||
flex: 1;
|
||||
height: 60rpx;
|
||||
background: #f5f5f5;
|
||||
border-radius: 10rpx;
|
||||
padding: 0 20rpx;
|
||||
font-size: 24rpx;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.filter-buttons {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 20rpx 30rpx;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.reset-button {
|
||||
width: 150rpx;
|
||||
height: 50rpx;
|
||||
border: 1rpx solid #7abbff;
|
||||
border-radius: 50rpx;
|
||||
background: #f0f7ff;
|
||||
color: #409eff;
|
||||
font-size: 26rpx;
|
||||
line-height: 50rpx;
|
||||
}
|
||||
|
||||
.confirm-button {
|
||||
width: 150rpx;
|
||||
height: 50rpx;
|
||||
background: #409eff;
|
||||
border-radius: 50rpx;
|
||||
color: white;
|
||||
font-size: 26rpx;
|
||||
border: none;
|
||||
line-height: 50rpx;
|
||||
}
|
||||
@ -1,125 +1,249 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<div class="banner">
|
||||
<swiper>
|
||||
<swiper-item>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/homeServer_banner.png"></image>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
<div class="dotList">
|
||||
<div class="dot active"></div>
|
||||
<div class="dot"></div>
|
||||
<div class="dot"></div>
|
||||
</div>
|
||||
<view class="container">
|
||||
<div class="banner">
|
||||
<swiper @animationfinish="swipers" autoplay circular>
|
||||
<swiper-item
|
||||
v-for="(item, index) in bannerList"
|
||||
:key="index"
|
||||
@click="lookImage(item, index)"
|
||||
>
|
||||
<image :src="item.pic_src" mode="aspectFill" />
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
|
||||
<view class="cirList">
|
||||
<view
|
||||
:class="['cir', currentIdx == index ? 'active' : '']"
|
||||
v-for="(item, index) in bannerList"
|
||||
:key="index"
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
<div class="serverTitBox">
|
||||
<div class="serverTit">
|
||||
<div class="serverTit_left">
|
||||
<div class="tit">空调清洗</div>
|
||||
<div class="msg">平台保障</div>
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
<div class="serverTitBox">
|
||||
<div class="serverTit">
|
||||
<div class="serverTit_left">
|
||||
<div class="tit">空调清洗</div>
|
||||
<div class="msg">
|
||||
平台保障
|
||||
</div>
|
||||
</div>
|
||||
<div class="serverTit_right">已预约100+</div>
|
||||
</div>
|
||||
<div class="serverCon">专业保洁团队,全屋深度清洁,去除顽固污渍,还您清新居所还您清新居所</div>
|
||||
<div class="serverTit_right">已预约100+</div>
|
||||
</div>
|
||||
<div class="serverCon">
|
||||
专业保洁团队,全屋深度清洁,去除顽固污渍,还您清新居所还您清新居所
|
||||
</div>
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
|
||||
<div class="serverList">
|
||||
<div class="serverListTit">找到8个匹配服务商</div>
|
||||
<view class="tabs">
|
||||
<view
|
||||
v-for="(item, index) in categoryList"
|
||||
:key="index"
|
||||
:class="['tabItem', selectedTab === index ? 'active2' : '']"
|
||||
@click="selectTab(index, item)"
|
||||
>
|
||||
{{ item.category_name }}
|
||||
</view>
|
||||
</view>
|
||||
<div class="FilterMore" v-if="showPrice">
|
||||
<div class="filter-section">
|
||||
<div class="price-range">
|
||||
<input
|
||||
type="number"
|
||||
v-model="minPrice"
|
||||
placeholder="最低价"
|
||||
class="price-input"
|
||||
@input="validatePriceRange"
|
||||
/>
|
||||
<span class="price-separator">—</span>
|
||||
<input
|
||||
type="number"
|
||||
v-model="maxPrice"
|
||||
placeholder="最高价"
|
||||
class="price-input"
|
||||
@input="validatePriceRange"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
<div class="priceSelect">
|
||||
<div class="tit">价格范围</div>
|
||||
|
||||
<div class="range">
|
||||
<div class="minPrice">¥10</div>
|
||||
<slider-range style="flex: 1;" :value="rangeValue" :min="rangeMin" :max="rangeMax" :step="5" :bar-height="3"
|
||||
:block-size="26" background-color="#EEEEF6" active-color="#FF6B00" :format="format"
|
||||
:decorationVisible="true" @change="handleRangeChange"></slider-range>
|
||||
<div class="maxPrice">¥39</div>
|
||||
</div>
|
||||
<div class="filter-buttons">
|
||||
<button class="reset-button" @click="resetFilters">重置</button>
|
||||
<button class="confirm-button" @click="applyFilters">确定</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="serverList">
|
||||
<div class="serverListTit">匹配的服务商(3)</div>
|
||||
|
||||
<div class="serverItem" @click="selectVendor">
|
||||
<div class="serverItem_left">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/test.png"></image>
|
||||
</div>
|
||||
<div class="serverItem_right">
|
||||
<div class="serverItem_right_msg">
|
||||
<div class="msg_tit">安心家政</div>
|
||||
<div class="msg_price">价格范围: <span>¥80-¥150</span></div>
|
||||
</div>
|
||||
|
||||
<div class="serverItem_right_btn" @click="selectMaster">
|
||||
选择师傅
|
||||
<div class="more">
|
||||
<u-icon name="arrow-right" color="#fff" size="28"></u-icon>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="serverItem" @click="selectVendor">
|
||||
<div class="serverItem_left">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png"></image>
|
||||
</div>
|
||||
|
||||
</view>
|
||||
<div class="serverItem_right">
|
||||
<div class="serverItem_right_msg">
|
||||
<div class="msg_tit">
|
||||
<view>安心家政</view>
|
||||
<div class="serverItem_right_btn" @click="selectMaster">
|
||||
选择服务
|
||||
</div>
|
||||
</div>
|
||||
<div class="msg_meta">
|
||||
<span class="rating">
|
||||
<image
|
||||
class="infoImage"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/serverInfo_xing.png"
|
||||
/>
|
||||
4.8
|
||||
</span>
|
||||
<span class="distance">
|
||||
<image
|
||||
class="infoImage"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/serverInfo_weizhi.png"
|
||||
/>3.3km</span
|
||||
>
|
||||
<span class="served">
|
||||
<image
|
||||
class="infoImage"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/serverInfo_fuwu.png"
|
||||
/>服务12226人</span
|
||||
>
|
||||
</div>
|
||||
<div class="msg_price">价格范围: <span>¥80-¥150</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { request, picUrl, NavgateTo, menuButtonInfo } from '../../../utils/index';
|
||||
import { apiArr } from '../../../api/reservation';
|
||||
import SliderRange from '@/components/primewind-sliderrange/components/primewind-sliderrange/index.vue'
|
||||
import {
|
||||
request,
|
||||
picUrl,
|
||||
NavgateTo,
|
||||
menuButtonInfo,
|
||||
} from "../../../utils/index";
|
||||
import { apiArr } from "../../../api/reservation";
|
||||
import SliderRange from "@/components/primewind-sliderrange/components/primewind-sliderrange/index.vue";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
// 注册组件
|
||||
SliderRange
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
top: "",
|
||||
localHeight: "",
|
||||
rangeMin: 5,
|
||||
rangeMax: 200,
|
||||
rangeValue: [10, 50]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
format(val) {
|
||||
return val + '%'
|
||||
components: {
|
||||
// 注册组件
|
||||
SliderRange,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
bannerList: [
|
||||
{
|
||||
pic_src: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
},
|
||||
handleRangeChange(e) {
|
||||
this.rangeValue = e
|
||||
{
|
||||
pic_src:
|
||||
"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/homeServer_banner.png",
|
||||
},
|
||||
selectVendor(){
|
||||
NavgateTo("../vendor/index")
|
||||
{
|
||||
pic_src: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
},
|
||||
selectMaster(){
|
||||
NavgateTo("../chooseMaster/index")
|
||||
],
|
||||
currentIdx: 0,
|
||||
top: "",
|
||||
localHeight: "",
|
||||
rangeMin: 5,
|
||||
rangeMax: 200,
|
||||
rangeValue: [10, 50],
|
||||
|
||||
selectedTab: 0,
|
||||
categoryList: [
|
||||
{ category_name: "推荐" },
|
||||
{ category_name: "评分优先" },
|
||||
{ category_name: "距离最近" },
|
||||
{ category_name: "价格最低" },
|
||||
{ category_name: "服务最多" },
|
||||
{ category_name: "价格范围" },
|
||||
],
|
||||
|
||||
showPrice: false,
|
||||
minPrice: "",
|
||||
maxPrice: "",
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
swipers(e) {
|
||||
this.currentIdx = e.detail.current;
|
||||
},
|
||||
format(val) {
|
||||
return val + "%";
|
||||
},
|
||||
handleRangeChange(e) {
|
||||
this.rangeValue = e;
|
||||
},
|
||||
selectVendor() {
|
||||
// NavgateTo("../vendor/index");
|
||||
NavgateTo("../searchInfo/index");
|
||||
},
|
||||
selectMaster() {
|
||||
NavgateTo("../searchInfo/index");
|
||||
},
|
||||
lookImage(item, index) {
|
||||
// 提取所有图片URL
|
||||
const urls = this.bannerList.map((item) => item.pic_src);
|
||||
// 调用UniApp预览图片API
|
||||
uni.previewImage({
|
||||
current: index,
|
||||
urls: urls,
|
||||
loop: true,
|
||||
});
|
||||
},
|
||||
selectTab(index, item) {
|
||||
this.selectedTab = index;
|
||||
if (item.category_name === "价格范围") {
|
||||
this.showPrice = !this.showPrice;
|
||||
} else {
|
||||
this.showPrice = false;
|
||||
}
|
||||
},
|
||||
|
||||
validatePriceRange() {
|
||||
// 确保最小值在0-99999之间
|
||||
if (this.minPrice < 0) this.minPrice = 0;
|
||||
if (this.minPrice > 99999) this.minPrice = 99999;
|
||||
// 确保最大值在0-99999之间且不小于最小值
|
||||
if (
|
||||
this.maxPrice &&
|
||||
(this.maxPrice < this.minPrice || this.maxPrice > 99999)
|
||||
) {
|
||||
this.maxPrice = Math.min(Math.max(this.maxPrice, this.minPrice), 99999);
|
||||
}
|
||||
},
|
||||
resetFilters() {
|
||||
this.minPrice = "";
|
||||
this.maxPrice = "";
|
||||
},
|
||||
applyFilters() {
|
||||
const filterData = {
|
||||
priceRange: {
|
||||
min: this.minPrice || 0,
|
||||
max: this.maxPrice || 99999,
|
||||
},
|
||||
};
|
||||
console.log("筛选条件:", filterData);
|
||||
this.showPrice = false;
|
||||
},
|
||||
onReady() {
|
||||
},
|
||||
onReady() {},
|
||||
|
||||
},
|
||||
onLoad(options) {
|
||||
const meun = menuButtonInfo();
|
||||
this.top = meun.top;
|
||||
this.localHeight = meun.height;
|
||||
},
|
||||
onShow() {},
|
||||
|
||||
onLoad(options) {
|
||||
const meun = menuButtonInfo();
|
||||
this.top = meun.top;
|
||||
this.localHeight = meun.height;
|
||||
},
|
||||
onShow() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom() {
|
||||
|
||||
},
|
||||
|
||||
}
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom() {},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@ -56,6 +56,26 @@ image {
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.Msg_con_img {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
width: 100%;
|
||||
margin-top: 15rpx;
|
||||
gap: 15rpx;
|
||||
}
|
||||
|
||||
.Msg_con_img image {
|
||||
width: calc(33.33% - 11rpx);
|
||||
height: 225rpx;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.Msg_con_video{
|
||||
width: calc(33.33% - 11rpx);
|
||||
height: 225rpx;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.Msg_iconList_leftIcon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -117,9 +137,11 @@ image {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.comment_con input{
|
||||
|
||||
.comment_con input {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.comment_con image {
|
||||
width: 28.3rpx;
|
||||
height: 28rpx;
|
||||
|
||||
@ -3,13 +3,14 @@
|
||||
<div class="Msg">
|
||||
<div class="Msg_Tit">
|
||||
<div class="Msg_Tit_left">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/user_ava.png" v-if="!info.user.avatar" mode="aspectFill">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/user_ava.png"
|
||||
v-if="!info.user.avatar" mode="aspectFill">
|
||||
</image>
|
||||
<image :src="picUrl + info.user.avatar" v-if="info.user.avatar" mode="aspectFill"></image>
|
||||
{{ info.user.nick_name }}
|
||||
</div>
|
||||
<div class="Msg_Tit_right">
|
||||
<image v-for="indez in 5"
|
||||
<image v-for="(item, index) in 5" :key="index"
|
||||
:src="indez < info.satisfaction ? 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_start1.png' : 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_start2.png'"
|
||||
mode="aspectFill"></image>
|
||||
</div>
|
||||
@ -17,35 +18,46 @@
|
||||
|
||||
<div class="Msg_con">
|
||||
{{ info.comment }}
|
||||
<div class="Msg_con_img" v-if="info.image_url">
|
||||
<image v-for="(img, index) in info.image_url.split(',')" :key="index" :src="picUrl + img"
|
||||
mode="aspectFill"></image>
|
||||
<video class="Msg_con_video" v-if="info.video_url" :src="picUrl + info.video_url" controls></video>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="Msg_iconList">
|
||||
<div class="Msg_iconList_left">
|
||||
<div class="Msg_iconList_leftIcon">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_review.png" mode="widthFix"></image>
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_review.png"
|
||||
mode="widthFix"></image>
|
||||
{{ info.merchant_evaluation_reply_list ? info.merchant_evaluation_reply_list.length : 0 }}
|
||||
</div>
|
||||
|
||||
<div class="Msg_iconList_leftIcon">
|
||||
<image v-if="info.is_like == 2" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_likeIcon.png" mode="widthFix"
|
||||
@click="like(info)"></image>
|
||||
<image v-if="info.is_like == 1" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_likeIcon2.png"
|
||||
<image v-if="info.is_like == 2"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_likeIcon.png"
|
||||
mode="widthFix" @click="like(info)"></image>
|
||||
<image v-if="info.is_like == 1"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_likeIcon2.png"
|
||||
mode="widthFix" @click="unlike(info)"></image>
|
||||
{{ info.merchant_evaluation_like_list ? info.merchant_evaluation_like_list.length : 0 }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="Msg_iconList_right">
|
||||
<div class="Msg_iconList_leftIcon" @click="deletes" v-if="isDelte">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_del.png" mode="widthFix"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_del.png"
|
||||
mode="widthFix"></image>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 回复列表 -->
|
||||
<div class="reply" v-for="item in replyList">
|
||||
<div class="reply" v-for="(item, index) in replyList" :key="index">
|
||||
<div class="reply_tit">
|
||||
<div class="reply_tit_left">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/user_ava.png" v-if="!item.user.avatar" mode="aspectFill">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/user_ava.png"
|
||||
v-if="!item.user.avatar" mode="aspectFill">
|
||||
</image>
|
||||
<image :src="picUrl + item.user.avatar" v-if="item.user.avatar" mode="aspectFill"></image>
|
||||
{{ item.user.nick_name }}
|
||||
@ -58,7 +70,8 @@
|
||||
|
||||
<div class="comment">
|
||||
<div class="comment_con">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_send.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_send.png"
|
||||
mode="aspectFill"></image>
|
||||
<input type="text" v-model="reply_content" placeholder="说点什么">
|
||||
|
||||
<button id="send" @click="sendComment">发送</button>
|
||||
@ -116,6 +129,14 @@ export default {
|
||||
sendComment() {
|
||||
// 这里添加发送评论的逻辑
|
||||
console.log('发送评论');
|
||||
if (!this.reply_content) {
|
||||
uni.showToast({
|
||||
title: "请输入评论内容",
|
||||
icon: "none",
|
||||
duration: 2000
|
||||
})
|
||||
return
|
||||
}
|
||||
let that = this
|
||||
request(apiArr.createUserReply, "POST", {
|
||||
evaluation_id: that.info.id,
|
||||
@ -167,7 +188,9 @@ export default {
|
||||
request(apiArr.userCommentInfo, "POST", {
|
||||
id: that.id
|
||||
}).then(res => {
|
||||
console.log(res);
|
||||
res.merchant_evaluation_reply_list = res.merchant_evaluation_reply_list.filter((item) => {
|
||||
return item.status == 2;
|
||||
});
|
||||
that.info = res
|
||||
if (res.user_id == uni.getStorageSync('userId')) {
|
||||
that.isDelte = true
|
||||
@ -223,6 +246,9 @@ export default {
|
||||
that.flag = false
|
||||
}
|
||||
that.page_num++
|
||||
res.rows = res.rows.filter((item) => {
|
||||
return item.status == 2;
|
||||
});
|
||||
that.replyList = that.replyList.concat(res.rows)
|
||||
})
|
||||
},
|
||||
|
||||
@ -179,6 +179,26 @@ page {
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.Msg_con_img {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
width: 100%;
|
||||
margin-top: 15rpx;
|
||||
gap: 15rpx;
|
||||
}
|
||||
|
||||
.Msg_con_img image {
|
||||
width: calc(33.33% - 11rpx);
|
||||
height: 225rpx;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.Msg_con_video{
|
||||
width: calc(33.33% - 11rpx);
|
||||
height: 225rpx;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.Msg_iconList_leftIcon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
@ -12,7 +12,7 @@
|
||||
|
||||
<!-- <u-icon name="star-fill" color="#FFB84D" /> -->
|
||||
<div class="startList">
|
||||
<image v-for="index in 5"
|
||||
<image v-for="index in 5" :key="index"
|
||||
:src="index < item.rating ? 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_start1.png' : 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_start2.png'"
|
||||
mode="aspectFill"></image>
|
||||
</div>
|
||||
@ -42,16 +42,17 @@
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<view class="white_container detail" v-for="item in commentList">
|
||||
<view class="white_container detail" v-for="(item, index) in commentList" :key="index">
|
||||
<div class="Msg">
|
||||
<div class="Msg_Tit">
|
||||
<div class="Msg_Tit_left">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/user_ava.png" v-if="!item.user.avatar" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/user_ava.png"
|
||||
v-if="!item.user.avatar" mode="aspectFill"></image>
|
||||
<image :src="picUrl + item.user.avatar" v-if="item.user.avatar" mode="aspectFill"></image>
|
||||
{{ item.user.nick_name }}
|
||||
</div>
|
||||
<div class="Msg_Tit_right">
|
||||
<image v-for="indez in 5"
|
||||
<image v-for="indez in 5" :key="indez"
|
||||
:src="indez < item.satisfaction ? 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_start1.png' : 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_start2.png'"
|
||||
mode="aspectFill"></image>
|
||||
</div>
|
||||
@ -59,20 +60,28 @@
|
||||
|
||||
<div class="Msg_con">
|
||||
{{ item.comment }}
|
||||
<div class="Msg_con_img" v-if="item.image_url">
|
||||
<image v-for="(img, index) in item.image_url.split(',')" :key="index" :src="picUrl + img" mode="aspectFill">
|
||||
</image>
|
||||
<video class="Msg_con_video" v-if="item.video_url" :src="picUrl + item.video_url" controls></video>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="Msg_iconList">
|
||||
<div class="Msg_iconList_left">
|
||||
<div class="Msg_iconList_leftIcon">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_review.png" mode="widthFix"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_review.png"
|
||||
mode="widthFix"></image>
|
||||
{{ item.merchant_evaluation_reply_list ? item.merchant_evaluation_reply_list.length : 0 }}
|
||||
</div>
|
||||
|
||||
<div class="Msg_iconList_leftIcon">
|
||||
<image v-if="item.is_like == 2" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_likeIcon.png" mode="widthFix"
|
||||
@click="like(item)"></image>
|
||||
<image v-if="item.is_like == 1" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_likeIcon2.png" mode="widthFix"
|
||||
@click="unlike(item)"></image>
|
||||
<image v-if="item.is_like == 2"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_likeIcon.png"
|
||||
mode="widthFix" @click="like(item)"></image>
|
||||
<image v-if="item.is_like == 1"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_likeIcon2.png"
|
||||
mode="widthFix" @click="unlike(item)"></image>
|
||||
{{ item.merchant_evaluation_like_list ? item.merchant_evaluation_like_list.length : 0 }}
|
||||
</div>
|
||||
</div>
|
||||
@ -89,15 +98,18 @@
|
||||
<view>导航</view>
|
||||
</view>
|
||||
<view class="left_label" @click="handlePhoneClick">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/localLife_detail_Frame.png" mode="" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/localLife_detail_Frame.png"
|
||||
mode="" />
|
||||
<view>电话</view>
|
||||
</view>
|
||||
<view class="left_label" @click="handleDiscussClick">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/localLife_shopList_Group_1334.png" mode="" />
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/localLife_shopList_Group_1334.png"
|
||||
mode="" />
|
||||
<view>点评</view>
|
||||
</view>
|
||||
</view>
|
||||
<text class="btn" @click="handleQuickPayClick">快捷买单</text>
|
||||
<text v-if="isShow" class="btn" @click="handleQuickPayClick">快捷买单</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
@ -120,16 +132,18 @@ export default {
|
||||
page_size: 10,
|
||||
commentList: [],
|
||||
flag: false,
|
||||
isShow: false,
|
||||
};
|
||||
},
|
||||
onLoad(options) {
|
||||
this.info = uni.getStorageSync("merchantInfo")
|
||||
},
|
||||
onShow(){
|
||||
onShow() {
|
||||
this.page_num = 1
|
||||
this.flag = false
|
||||
this.commentList = []
|
||||
this.getCommentList()
|
||||
this.getMerchantInfo()
|
||||
},
|
||||
onReachBottom() {
|
||||
if (this.flag) {
|
||||
@ -154,7 +168,26 @@ export default {
|
||||
} else {
|
||||
this.flag = false;
|
||||
}
|
||||
this.commentList = this.commentList.concat(res.rows);
|
||||
this.isShow = res.rows[0].merchant_info.quick_purchase_enabled == 1
|
||||
const list = res.rows.filter((item) => {
|
||||
return item.status == 2;
|
||||
});
|
||||
|
||||
list.forEach(item => {
|
||||
item.merchant_evaluation_reply_list =item.merchant_evaluation_reply_list.filter((item) => {
|
||||
return item.status == 2;
|
||||
})
|
||||
})
|
||||
|
||||
this.commentList = this.commentList.concat(list);
|
||||
})
|
||||
},
|
||||
|
||||
getMerchantInfo() {
|
||||
request(apiArr.getMerchantInfo, "POST", {
|
||||
id: uni.getStorageSync("merchantInfo").id,
|
||||
}).then(res => {
|
||||
this.isShow = res.quick_purchase_enabled == 1
|
||||
})
|
||||
},
|
||||
|
||||
@ -194,15 +227,15 @@ export default {
|
||||
evaluation_id: e.id,
|
||||
}).then(res => {
|
||||
console.log(e);
|
||||
if(e.merchant_evaluation_like_list){
|
||||
if (e.merchant_evaluation_like_list) {
|
||||
e.merchant_evaluation_like_list.push({})
|
||||
}else{
|
||||
} else {
|
||||
e.merchant_evaluation_like_list = []
|
||||
e.merchant_evaluation_like_list.push({})
|
||||
}
|
||||
e.is_like = 1
|
||||
uni.showToast({
|
||||
icon:"none",
|
||||
icon: "none",
|
||||
title: '点赞成功',
|
||||
duration: 2000
|
||||
});
|
||||
@ -216,13 +249,13 @@ export default {
|
||||
e.merchant_evaluation_like_list.pop()
|
||||
uni.showToast({
|
||||
title: '取消成功',
|
||||
icon:"none",
|
||||
icon: "none",
|
||||
duration: 2000
|
||||
});
|
||||
})
|
||||
},
|
||||
|
||||
commentDesc(e){
|
||||
commentDesc(e) {
|
||||
NavgateTo(`../UserComment/index?id=${e.id}`)
|
||||
},
|
||||
},
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
page {
|
||||
background-color: #f6f7fb;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.container {
|
||||
|
||||
@ -2,6 +2,10 @@ page {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.container{
|
||||
/* padding-top: 100rpx; */
|
||||
}
|
||||
|
||||
.local {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
@ -1,39 +1,52 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<div class="local">
|
||||
<image id="local" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_localIcon.png" mode="aspectFill"></image>
|
||||
{{address}}
|
||||
<u-icon name="arrow-down" color="#999999" size="28"></u-icon>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="local">
|
||||
<image
|
||||
id="local"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_localIcon.png"
|
||||
mode="aspectFill"
|
||||
></image>
|
||||
{{ address }}
|
||||
<u-icon name="arrow-down" color="#999999" size="28"></u-icon>
|
||||
</div>
|
||||
|
||||
<div class="search">
|
||||
<div class="searchBox">
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png"
|
||||
mode="aspectFill"
|
||||
></image>
|
||||
<input type="text" placeholder="请输入您想搜索的内容" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="search">
|
||||
<div class="searchBox">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png" mode="aspectFill"></image>
|
||||
<input type="text" placeholder="请输入您想搜索的内容">
|
||||
<div class="swiperBox">
|
||||
<swiper class="swiper" @change="swiperChange" :current="currentIndex">
|
||||
<swiper-item v-for="(page, pageIndex) in swiperList" :key="pageIndex">
|
||||
<div class="navList">
|
||||
<div
|
||||
class="navItem"
|
||||
v-for="(item, itemIndex) in page"
|
||||
:key="itemIndex"
|
||||
>
|
||||
<image :src="picUrl + item.cate_image" mode="widthFix"></image>
|
||||
<div class="navName">{{ item.cate_name }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
|
||||
<div class="dot">
|
||||
<div
|
||||
class="dotItem"
|
||||
v-for="(page, index) in swiperList" :key="index"
|
||||
:class="currentIndex == index ? 'actives' : ''"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="swiperBox">
|
||||
<swiper class="swiper" @change="swiperChange" :current="currentIndex">
|
||||
<swiper-item v-for="(page, pageIndex) in swiperList" :key="pageIndex">
|
||||
<div class="navList">
|
||||
<div class="navItem" v-for="(item, itemIndex) in page" :key="itemIndex">
|
||||
<image :src="picUrl + item.cate_image" mode="widthFix"></image>
|
||||
<div class="navName">{{ item.cate_name }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
|
||||
<div class="dot">
|
||||
<div class="dotItem" v-for="(page, index) in swiperList" :class="currentIndex == index ? 'actives' : ''"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="lines"></div>
|
||||
<!-- <scroll-view scroll-x="true" enhanced enable-flex class="scrollBox">
|
||||
<div class="lines"></div>
|
||||
<!-- <scroll-view scroll-x="true" enhanced enable-flex class="scrollBox">
|
||||
<div class="scrollView">
|
||||
<div class="scroll-viewItem" v-for="(item, index) in 4" @click="checkItem(index)">
|
||||
<image v-show="!checkedItems[index]" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_uncheck.png"
|
||||
@ -45,173 +58,216 @@
|
||||
</div>
|
||||
</scroll-view> -->
|
||||
|
||||
<div class="merchantList">
|
||||
<div class="merchantItem" v-for="item in merchatList" :key="item.id" @click="Info(item)">
|
||||
<div class="merchantItem_left">
|
||||
<image :src="picUrl + item.bigImg[0]" mode="aspectFill"></image>
|
||||
</div>
|
||||
<div class="merchantItem_right">
|
||||
<div class="merchantItem_right_tit">
|
||||
<div class="merchantItem_right_tit_left">
|
||||
{{item.merchant_name}}
|
||||
</div>
|
||||
<div class="merchantItem_right_tit_right">
|
||||
{{item.distances}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="merchantItem_right_con">
|
||||
<div class="merchantItem_right_con_left">
|
||||
<div class="startList">
|
||||
<image v-for="index in 5" :src="index < item.rating ? 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_start1.png' : 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_start2.png'" mode="aspectFill"></image>
|
||||
</div>
|
||||
<div class="merchangtItem_tag" v-if="item.refund_property_fee_ratio">买单反物业费</div>
|
||||
<div class="merchangtItem_tag" v-if="item.refund_user_points_ratio">买单反积分</div>
|
||||
</div>
|
||||
<div class="merchantItem_right_con_right">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_review.png" mode="aspectFill"></image>
|
||||
点评
|
||||
</div>
|
||||
</div>
|
||||
<div class="merchantItem_right_add">
|
||||
{{item.comAddress}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="merchantList">
|
||||
<div
|
||||
class="merchantItem"
|
||||
v-for="item in merchatList"
|
||||
:key="item.id"
|
||||
@click="Info(item)"
|
||||
>
|
||||
<div class="merchantItem_left">
|
||||
<image :src="picUrl + item.bigImg[0]" mode="aspectFill"></image>
|
||||
</div>
|
||||
|
||||
<div class="btnList">
|
||||
<div class="btn_left">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_serverIcon.png" mode="aspectFill"></image>
|
||||
到店服务券
|
||||
<div class="merchantItem_right">
|
||||
<div class="merchantItem_right_tit">
|
||||
<div class="merchantItem_right_tit_left">
|
||||
{{ item.merchant_name }}
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
<div class="btn_right">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/lcoal_payIcon.png" mode="aspectFill"></image>
|
||||
快捷支付记录
|
||||
<div class="merchantItem_right_tit_right">
|
||||
{{ item.distances }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="merchantItem_right_con">
|
||||
<div class="merchantItem_right_con_left">
|
||||
<div class="startList">
|
||||
<image
|
||||
v-for="index in 5"
|
||||
:key="index"
|
||||
:src="
|
||||
index < item.rating
|
||||
? 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_start1.png'
|
||||
: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_start2.png'
|
||||
"
|
||||
mode="aspectFill"
|
||||
></image>
|
||||
</div>
|
||||
<div
|
||||
class="merchangtItem_tag"
|
||||
v-if="item.refund_property_fee_ratio"
|
||||
>
|
||||
买单返物业费
|
||||
</div>
|
||||
<div
|
||||
class="merchangtItem_tag"
|
||||
v-if="item.refund_user_points_ratio"
|
||||
>
|
||||
买单返积分
|
||||
</div>
|
||||
</div>
|
||||
<div class="merchantItem_right_con_right" @click="toJump(item)">
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_review.png"
|
||||
mode="aspectFill"
|
||||
></image>
|
||||
点评
|
||||
</div>
|
||||
</div>
|
||||
<div class="merchantItem_right_add">
|
||||
{{ item.comAddress }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="btnList_after"></div>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="btnList">
|
||||
<div class="btn_left">
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_serverIcon.png"
|
||||
mode="aspectFill"
|
||||
></image>
|
||||
到店服务券
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
<div class="btn_right">
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/lcoal_payIcon.png"
|
||||
mode="aspectFill"
|
||||
></image>
|
||||
快捷支付记录
|
||||
</div>
|
||||
</div>
|
||||
<div class="btnList_after"></div>
|
||||
|
||||
<!-- <nav-footer :current="2" /> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
request,
|
||||
picUrl,
|
||||
uniqueByField,
|
||||
menuButtonInfo,
|
||||
calculateDistance,
|
||||
NavgateTo
|
||||
} from '../../../utils';
|
||||
|
||||
import { apiArr } from '../../../api/v2local';
|
||||
request,
|
||||
picUrl,
|
||||
uniqueByField,
|
||||
menuButtonInfo,
|
||||
calculateDistance,
|
||||
NavgateTo,
|
||||
} from "../../../utils";
|
||||
|
||||
import { apiArr } from "../../../api/v2local";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
picUrl,
|
||||
top: "",
|
||||
localHeight: "",
|
||||
swiperList: [
|
||||
],
|
||||
currentIndex: 0,
|
||||
checkedItems: [false, false, false, false],
|
||||
address:"",
|
||||
page_size:"10",
|
||||
page_num:"1",
|
||||
flag:false,
|
||||
merchatList:[]
|
||||
data() {
|
||||
return {
|
||||
picUrl,
|
||||
top: "",
|
||||
localHeight: "",
|
||||
swiperList: [],
|
||||
currentIndex: 0,
|
||||
checkedItems: [false, false, false, false],
|
||||
address: "",
|
||||
page_size: "10",
|
||||
page_num: "1",
|
||||
flag: false,
|
||||
merchatList: [],
|
||||
};
|
||||
},
|
||||
onLoad(options) {
|
||||
const meun = menuButtonInfo();
|
||||
this.top = meun.top;
|
||||
// this.top = meun.height + meun.top;
|
||||
this.localHeight = meun.height;
|
||||
this.getCateList();
|
||||
this.getMechantList();
|
||||
this.address = uni.getStorageSync("location").address;
|
||||
console.log(this.address);
|
||||
},
|
||||
|
||||
onReachBottom() {
|
||||
if (this.flag) {
|
||||
this.getMechantList();
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
swiperChange(e) {
|
||||
this.currentIndex = e.detail.current;
|
||||
},
|
||||
|
||||
checkItem(index) {
|
||||
this.$set(this.checkedItems, index, !this.checkedItems[index]);
|
||||
},
|
||||
//查询商家分类
|
||||
async getCateList() {
|
||||
let that = this;
|
||||
await request(apiArr.getMerChantCateList, "POST").then((res) => {
|
||||
res.rows = res.rows.filter((item) => item.is_visible == 1)
|
||||
console.log(res);
|
||||
// 将数据分成每10个一组
|
||||
const chunkSize = 10;
|
||||
that.swiperList = [];
|
||||
for (let i = 0; i < res.rows.length; i += chunkSize) {
|
||||
that.swiperList.push(res.rows.slice(i, i + chunkSize));
|
||||
}
|
||||
});
|
||||
},
|
||||
onLoad(options) {
|
||||
const meun = menuButtonInfo();
|
||||
this.top = meun.top;
|
||||
// this.top = meun.height + meun.top;
|
||||
this.localHeight = meun.height;
|
||||
this.getCateList();
|
||||
this.getMechantList();
|
||||
this.address = uni.getStorageSync("location").address
|
||||
console.log(this.address)
|
||||
},
|
||||
//查询商家列表
|
||||
async getMechantList() {
|
||||
let that = this;
|
||||
await request(apiArr.getMerchantList, "POST", {
|
||||
page_num: that.page_num,
|
||||
page_size: that.page_size,
|
||||
}).then((res) => {
|
||||
let latitude = uni.getStorageSync("location").lat;
|
||||
let longitude = uni.getStorageSync("location").lng;
|
||||
res.rows.forEach((item) => {
|
||||
item.bigImg = item.album_images.split(",");
|
||||
const distanceInKm = calculateDistance(
|
||||
latitude,
|
||||
longitude,
|
||||
item.latitude,
|
||||
item.longitude
|
||||
);
|
||||
item.distances =
|
||||
distanceInKm >= 1
|
||||
? `${distanceInKm.toFixed(1)}km`
|
||||
: `${(distanceInKm * 1000).toFixed(1)}m`;
|
||||
|
||||
onReachBottom() {
|
||||
if(this.flag){
|
||||
this.getMechantList();
|
||||
if (item.ad) {
|
||||
item.comAddress = item.ad.ad_name.replace(/,/g, "") + item.address;
|
||||
} else {
|
||||
item.comAddress = item.address;
|
||||
}
|
||||
});
|
||||
res.rows.sort((a, b) => {
|
||||
const valueA =
|
||||
parseFloat(a.distances.replace("km", "").replace("m", "")) *
|
||||
(a.distances.includes("km") ? 1000 : 1);
|
||||
const valueB =
|
||||
parseFloat(b.distances.replace("km", "").replace("m", "")) *
|
||||
(b.distances.includes("km") ? 1000 : 1);
|
||||
return valueA - valueB;
|
||||
});
|
||||
|
||||
if (res.rows.length == this.page_size) {
|
||||
this.page_num = this.page_num + 1;
|
||||
this.flag = true;
|
||||
} else {
|
||||
this.flag = false;
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
swiperChange(e) {
|
||||
this.currentIndex = e.detail.current;
|
||||
},
|
||||
|
||||
checkItem(index) {
|
||||
this.$set(this.checkedItems, index, !this.checkedItems[index]);
|
||||
},
|
||||
//查询商家分类
|
||||
async getCateList() {
|
||||
let that = this
|
||||
await request(apiArr.getMerChantCateList, "POST").then(res => {
|
||||
console.log(res);
|
||||
// 将数据分成每10个一组
|
||||
const chunkSize = 10;
|
||||
that.swiperList = [];
|
||||
for (let i = 0; i < res.rows.length; i += chunkSize) {
|
||||
that.swiperList.push(res.rows.slice(i, i + chunkSize));
|
||||
}
|
||||
})
|
||||
},
|
||||
//查询商家列表
|
||||
async getMechantList(){
|
||||
let that = this
|
||||
await request(apiArr.getMerchantList, "POST",{
|
||||
page_num:that.page_num,
|
||||
page_size:that.page_size,
|
||||
}).then(res => {
|
||||
let latitude = uni.getStorageSync("location").lat
|
||||
let longitude = uni.getStorageSync("location").lng
|
||||
res.rows.forEach(item => {
|
||||
item.bigImg = item.album_images.split(',')
|
||||
const distanceInKm = calculateDistance(latitude,longitude,item.latitude,item.longitude);
|
||||
item.distances = distanceInKm >= 1 ? `${distanceInKm.toFixed(1)}km` : `${(distanceInKm * 1000).toFixed(1)}m`;
|
||||
|
||||
if(item.ad){
|
||||
item.comAddress = item.ad.ad_name.replace(/,/g, '') + item.address
|
||||
}else{
|
||||
item.comAddress = item.address
|
||||
}
|
||||
});
|
||||
res.rows.sort((a, b) => {
|
||||
const valueA = parseFloat(a.distances.replace('km', '').replace('m', '')) * (a.distances.includes('km') ? 1000 : 1);
|
||||
const valueB = parseFloat(b.distances.replace('km', '').replace('m', '')) * (b.distances.includes('km') ? 1000 : 1);
|
||||
return valueA - valueB;
|
||||
});
|
||||
|
||||
|
||||
|
||||
if(res.rows.length == this.page_size){
|
||||
this.page_num = this.page_num + 1;
|
||||
this.flag = true
|
||||
}else{
|
||||
this.flag = false
|
||||
}
|
||||
this.merchatList = this.merchatList.concat(res.rows)
|
||||
})
|
||||
},
|
||||
//跳转商家详情
|
||||
Info(e){
|
||||
uni.setStorageSync("merchantInfo",e)
|
||||
NavgateTo("../detail/index")
|
||||
},
|
||||
this.merchatList = this.merchatList.concat(res.rows);
|
||||
});
|
||||
},
|
||||
//跳转商家详情
|
||||
Info(e) {
|
||||
uni.setStorageSync("merchantInfo", e);
|
||||
NavgateTo("../detail/index");
|
||||
},
|
||||
//跳转点评
|
||||
toJump(e){
|
||||
NavgateTo('../comment/index');
|
||||
},
|
||||
|
||||
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
@ -18,8 +18,8 @@
|
||||
|
||||
<div class="Msg">
|
||||
<div class="payMony">
|
||||
¥<input type="text" v-model="Money" placeholder="付款金额" placeholder-style="font-size: 50rpx;">
|
||||
</div>
|
||||
¥<input type="number" v-model="Money" placeholder="付款金额" placeholder-style="font-size: 50rpx;"
|
||||
@blur="handleMoneyInput" step="0.01" min="0.01"> </div>
|
||||
<div class="payRemark">
|
||||
<input type="text" v-model="remarks" placeholder="付款备注">
|
||||
</div>
|
||||
@ -62,7 +62,8 @@
|
||||
<div class="line"></div>
|
||||
<div class="btnItem" @click="home">首页</div>
|
||||
<div class="btnItem2" @click="changeBoxshadow">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_qrcode.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_qrcode.png"
|
||||
mode="aspectFill"></image>
|
||||
本页二维码
|
||||
</div>
|
||||
</div>
|
||||
@ -135,6 +136,29 @@ export default {
|
||||
|
||||
|
||||
methods: {
|
||||
handleMoneyInput() {
|
||||
// 清除非数字和非小数点的字符
|
||||
let value = this.Money.toString().replace(/[^\d.]/g, '');
|
||||
|
||||
// 限制只能有一个小数点
|
||||
value = value.replace(/\.{2,}/g, '.');
|
||||
|
||||
// 确保小数点后最多两位
|
||||
value = value.replace(/^(\d+)\.(\d{2}).*$/, '$1.$2');
|
||||
|
||||
// 处理开头是小数点的情况
|
||||
if (value.startsWith('.')) {
|
||||
value = '0' + value;
|
||||
}
|
||||
|
||||
// 处理大于0的验证
|
||||
const num = parseFloat(value);
|
||||
if (isNaN(num) || num <= 0) {
|
||||
value = '';
|
||||
}
|
||||
|
||||
this.Money = value;
|
||||
},
|
||||
|
||||
createQrcode() {
|
||||
uni.showLoading({
|
||||
@ -157,7 +181,7 @@ export default {
|
||||
});
|
||||
},
|
||||
createQrcode2(e) {
|
||||
let that= this
|
||||
let that = this
|
||||
uni.request({
|
||||
url: `https://api.weixin.qq.com/cgi-bin/wxaapp/createwxaqrcode?access_token=${e}`,
|
||||
method: 'post',
|
||||
@ -182,7 +206,7 @@ export default {
|
||||
}
|
||||
});
|
||||
},
|
||||
changeBoxshadow2(){
|
||||
changeBoxshadow2() {
|
||||
this.boxShow = !this.boxShow
|
||||
},
|
||||
changeBoxshadow() {
|
||||
|
||||
217
packages/myOrders/evaluate/index.css
Normal file
217
packages/myOrders/evaluate/index.css
Normal file
@ -0,0 +1,217 @@
|
||||
page {
|
||||
background-color: #f0f2f5;
|
||||
min-height: 100vh;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.container {
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
/* 商品图片区域 */
|
||||
.goods-scroll {
|
||||
width: 96%;
|
||||
white-space: nowrap;
|
||||
margin-bottom: 30rpx;
|
||||
padding: 20rpx 15rpx;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.goods-list {
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
.goods-item {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
margin-right: 16rpx;
|
||||
border-radius: 8rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.goods-img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
/* 订单编号 */
|
||||
.order-info {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 20rpx 0;
|
||||
border-bottom: 1rpx solid #EEEEEE;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.order-label {
|
||||
font-size: 26rpx;
|
||||
color: #9a9a9a;
|
||||
}
|
||||
|
||||
.order-value {
|
||||
font-size: 26rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.goods{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
gap: 20rpx;
|
||||
}
|
||||
|
||||
/* 货品图 */
|
||||
.goodsImg{
|
||||
display: flex;
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
}
|
||||
|
||||
/* 评分区域 */
|
||||
.rating{
|
||||
width: 460rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 0 0 0rpx 55rpx;
|
||||
color: #a6a6a6;
|
||||
}
|
||||
|
||||
.rating-section {
|
||||
background-color: #FFFFFF;
|
||||
border-radius: 16rpx;
|
||||
padding: 20rpx;
|
||||
margin-bottom: 30rpx;
|
||||
height: 80vh;
|
||||
}
|
||||
|
||||
.rating-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 30rpx;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.rating-item:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.rating-label {
|
||||
width: 160rpx;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* 评价输入 */
|
||||
.comment-section {
|
||||
padding: 20rpx;
|
||||
margin-bottom: 30rpx;
|
||||
border-top: 1rpx solid #f5f5f5;
|
||||
}
|
||||
|
||||
.comment-input {
|
||||
width: 100%;
|
||||
min-height: 100rpx;
|
||||
font-size: 26rpx;
|
||||
color: #333333;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
/* 图片上传 */
|
||||
.upload-section {
|
||||
/* background-color: #FFFFFF; */
|
||||
border-radius: 16rpx;
|
||||
padding: 20rpx;
|
||||
margin-bottom: 40rpx;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.upload-btn {
|
||||
display: flex;
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
padding: 15rpx;
|
||||
background-color: #f6f6f6;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-bottom: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.upload-icon {
|
||||
width: 60rpx;
|
||||
height: 50rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.upload-text {
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
margin: 10rpx 0;
|
||||
}
|
||||
|
||||
.upload-count {
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.image-list {
|
||||
display: flex;
|
||||
/* flex-wrap: wrap; */
|
||||
}
|
||||
|
||||
.image-item {
|
||||
width: 170rpx;
|
||||
height: 170rpx;
|
||||
margin-right: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
position: relative;
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.uploaded-img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.delete-btn {
|
||||
position: absolute;
|
||||
top: -10rpx;
|
||||
right: -10rpx;
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.delete-icon {
|
||||
color: #FFFFFF;
|
||||
font-size: 24rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* 提交按钮 */
|
||||
.submit-btn {
|
||||
width: 90%;
|
||||
height: 98rpx;
|
||||
background-color: #ff4117;
|
||||
border-radius: 49rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-top: 20rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.btn-text {
|
||||
font-size: 32rpx;
|
||||
color: #FFFFFF;
|
||||
font-weight: bold;
|
||||
}
|
||||
182
packages/myOrders/evaluate/index.vue
Normal file
182
packages/myOrders/evaluate/index.vue
Normal file
@ -0,0 +1,182 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
|
||||
<!-- 评分区域 -->
|
||||
<view class="rating-section">
|
||||
<!-- 订单编号 -->
|
||||
<view class="order-info">
|
||||
<text class="order-label">订单编号</text>
|
||||
<text class="order-value">38757328485</text>
|
||||
</view>
|
||||
<view class="goods">
|
||||
<view>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png" class="goodsImg"></image>
|
||||
</view>
|
||||
<view class="rating">
|
||||
<view>很差</view>
|
||||
<view>差</view>
|
||||
<view>一般</view>
|
||||
<view>不错</view>
|
||||
<view>满意</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 商品品质 -->
|
||||
<view class="rating-item">
|
||||
<text class="rating-label">商品品质</text>
|
||||
<u-rate
|
||||
v-model="qualityRating"
|
||||
size="40"
|
||||
active-color="#FFB400"
|
||||
inactive-color="#EEEEEE"
|
||||
gutter="60"
|
||||
></u-rate>
|
||||
</view>
|
||||
|
||||
<!-- 配送速度 -->
|
||||
<view class="rating-item">
|
||||
<text class="rating-label">配送速度</text>
|
||||
<u-rate
|
||||
v-model="speedRating"
|
||||
size="40"
|
||||
active-color="#FFB400"
|
||||
inactive-color="#EEEEEE"
|
||||
gutter="60"
|
||||
></u-rate>
|
||||
</view>
|
||||
|
||||
<!-- 快递员服务 -->
|
||||
<view class="rating-item">
|
||||
<text class="rating-label">快递员服务</text>
|
||||
<u-rate
|
||||
v-model="serviceRating"
|
||||
size="40"
|
||||
active-color="#FFB400"
|
||||
inactive-color="#EEEEEE"
|
||||
gutter="60"
|
||||
></u-rate>
|
||||
</view>
|
||||
|
||||
<!-- 评价输入 -->
|
||||
<view class="comment-section">
|
||||
<textarea
|
||||
class="comment-input"
|
||||
placeholder="展开说说对商品的想法吧…"
|
||||
v-model="comment"
|
||||
></textarea>
|
||||
</view>
|
||||
<!-- 图片上传 -->
|
||||
<view class="upload-section">
|
||||
<view class="image-list">
|
||||
<view
|
||||
class="image-item"
|
||||
v-for="(img, index) in imageList"
|
||||
:key="index"
|
||||
>
|
||||
<image :src="img" class="uploaded-img"></image>
|
||||
<view class="delete-btn" @click="deleteImage(index)">
|
||||
<text class="delete-icon">×</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view
|
||||
class="upload-btn"
|
||||
@click="chooseImage"
|
||||
v-if="imageList.length < 3"
|
||||
>
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/upload.png"
|
||||
class="upload-icon"
|
||||
></image>
|
||||
<view class="upload-text">上传图片</view>
|
||||
<view class="upload-count">({{ imageList.length }}/3)</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 提交按钮 -->
|
||||
<view class="submit-btn" @click="submitEvaluate">
|
||||
<text class="btn-text">提交</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uImage from "../../../uni_modules/uview-ui/components/u--image/u--image.vue";
|
||||
export default {
|
||||
components: { uImage },
|
||||
data() {
|
||||
return {
|
||||
// 商品列表
|
||||
goods: [
|
||||
{ image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_index1.png" },
|
||||
{ image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_index2.png" },
|
||||
{ image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_index3.png" },
|
||||
{ image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_index4.png" },
|
||||
{ image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_index5.png" },
|
||||
{ image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_index1.png" },
|
||||
{ image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_index2.png" },
|
||||
{ image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_index3.png" },
|
||||
{ image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_index4.png" },
|
||||
{ image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_index5.png" },
|
||||
],
|
||||
// 评分数据
|
||||
qualityRating: 5,
|
||||
speedRating: 0,
|
||||
serviceRating: 0,
|
||||
// 评价内容
|
||||
comment: "",
|
||||
// 图片列表
|
||||
imageList: [],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
// 选择图片
|
||||
chooseImage() {
|
||||
if (this.imageList.length >= 3) {
|
||||
uni.showToast({
|
||||
title: "最多上传3张图片",
|
||||
icon: "none",
|
||||
});
|
||||
return;
|
||||
}
|
||||
uni.chooseImage({
|
||||
count: 3 - this.imageList.length,
|
||||
sizeType: ["original", "compressed"],
|
||||
sourceType: ["album", "camera"],
|
||||
success: (res) => {
|
||||
this.imageList = this.imageList.concat(res.tempFilePaths);
|
||||
},
|
||||
});
|
||||
},
|
||||
// 删除图片
|
||||
deleteImage(index) {
|
||||
this.imageList.splice(index, 1);
|
||||
},
|
||||
// 提交评价
|
||||
submitEvaluate() {
|
||||
if (!this.comment.trim() && this.imageList.length === 0) {
|
||||
uni.showToast({
|
||||
title: "请至少填写评价内容或上传图片",
|
||||
icon: "none",
|
||||
});
|
||||
return;
|
||||
}
|
||||
// 这里添加提交评价的API调用逻辑
|
||||
uni.showToast({
|
||||
title: "评价提交成功",
|
||||
icon: "success",
|
||||
});
|
||||
setTimeout(() => {
|
||||
uni.navigateBack();
|
||||
}, 1500);
|
||||
},
|
||||
},
|
||||
onLoad(options) {
|
||||
console.log("🚀 ~ onLoad ~ options:", options);
|
||||
const itemObj = JSON.parse(decodeURIComponent(options.item));
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
110
packages/myOrders/index/awaitRated.css
Normal file
110
packages/myOrders/index/awaitRated.css
Normal file
@ -0,0 +1,110 @@
|
||||
.order-list {
|
||||
padding: 20rpx;
|
||||
background-color: #f5f7fb;
|
||||
}
|
||||
|
||||
.order-item {
|
||||
background-color: white;
|
||||
border-radius: 20rpx;
|
||||
padding: 30rpx;
|
||||
margin-bottom: 25rpx;
|
||||
}
|
||||
|
||||
.order-header {
|
||||
margin-bottom: 25rpx;
|
||||
}
|
||||
|
||||
.order-name {
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.order-number {
|
||||
font-size: 30rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.product-list {
|
||||
padding-top: 25rpx;
|
||||
}
|
||||
|
||||
.product-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 20rpx 0;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
}
|
||||
|
||||
.product-item:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.product-info {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.product-img {
|
||||
position: relative;
|
||||
width: 130rpx;
|
||||
height: 130rpx;
|
||||
margin-right: 25rpx;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.product-img image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.tag {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background-color: #ff7d00;
|
||||
color: white;
|
||||
font-size: 22rpx;
|
||||
padding: 5rpx 10rpx;
|
||||
border-radius: 20rpx 0 20rpx 20rpx;
|
||||
}
|
||||
|
||||
.product-details {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.product-name {
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
font-weight: bold;
|
||||
margin-bottom: 10rpx;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.product-spec {
|
||||
font-size: 22rpx;
|
||||
color: #666;
|
||||
margin-bottom: 10rpx;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.product-unit {
|
||||
font-size: 26rpx;
|
||||
color: red;
|
||||
margin-bottom: 10rpx;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.evaluate-btn {
|
||||
background-color: #ffe8e5;
|
||||
color: #e33612;
|
||||
border: none;
|
||||
border-radius: 50rpx;
|
||||
font-size: 26rpx;
|
||||
min-width: 150rpx;
|
||||
}
|
||||
|
||||
.evaluate-btn::after {
|
||||
border: none;
|
||||
}
|
||||
101
packages/myOrders/index/awaitRated.vue
Normal file
101
packages/myOrders/index/awaitRated.vue
Normal file
@ -0,0 +1,101 @@
|
||||
<template>
|
||||
<view class="order-list">
|
||||
<view class="order-item" v-for="(item, index) in orderList" :key="index">
|
||||
<view class="order-header">
|
||||
<text class="order-name">{{ item.orderName }}</text>
|
||||
<text class="order-number">{{ item.orderNumber }}</text>
|
||||
</view>
|
||||
<view class="product-list">
|
||||
<view
|
||||
class="product-item"
|
||||
v-for="(product, pIndex) in item.products"
|
||||
:key="pIndex"
|
||||
>
|
||||
<view class="product-info">
|
||||
<view class="product-img">
|
||||
<image :src="product.imageUrl" mode="aspectFit"></image>
|
||||
<view class="tag" v-if="product.tag">{{ product.tag }}</view>
|
||||
</view>
|
||||
<view class="product-details">
|
||||
<text class="product-name">{{ product.name }}</text>
|
||||
<text class="product-spec">{{ product.spec }}</text>
|
||||
<text class="product-unit">{{ product.unit }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<button class="evaluate-btn" @click="evaluateOrder(product)">
|
||||
评价
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { request, NavgateTo } from "../../../utils";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
orderList: [
|
||||
{
|
||||
orderName: "衡水商贸国际公司",
|
||||
orderNumber: "4534534255",
|
||||
products: [
|
||||
{
|
||||
imageUrl: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/product.png",
|
||||
tag: "当日达",
|
||||
name: "货品名称",
|
||||
spec: "货品规格",
|
||||
unit: "货品单位",
|
||||
},
|
||||
{
|
||||
imageUrl: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/product.png",
|
||||
tag: "当日达",
|
||||
name: "货品名称",
|
||||
spec: "货品规格",
|
||||
unit: "货品单位",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
orderNumber: "54352342331",
|
||||
products: [
|
||||
{
|
||||
imageUrl: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/product.png",
|
||||
tag: "",
|
||||
name: "货品名称",
|
||||
spec: "货品规格",
|
||||
unit: "货品单位",
|
||||
},
|
||||
{
|
||||
imageUrl: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/product.png",
|
||||
tag: "",
|
||||
name: "货品名称",
|
||||
spec: "货品规格",
|
||||
unit: "货品单位",
|
||||
},
|
||||
{
|
||||
imageUrl: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/product.png",
|
||||
tag: "",
|
||||
name: "货品名称",
|
||||
spec: "货品规格",
|
||||
unit: "货品单位",
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
evaluateOrder(item) {
|
||||
console.log("🚀 ~ evaluateOrder ~ orderNumber:", item);
|
||||
NavgateTo(`../evaluate/index?item=${JSON.stringify(item)}`);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./awaitRated.css");
|
||||
</style>
|
||||
@ -11,6 +11,9 @@ page {
|
||||
height: 100rpx;
|
||||
padding: 0 20rpx;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.tabItem {
|
||||
|
||||
@ -12,87 +12,83 @@
|
||||
</view>
|
||||
|
||||
<view class="content">
|
||||
<view v-for="(category, catIndex) in categoryList" :key="catIndex">
|
||||
<view v-if="selectedTab === catIndex">
|
||||
<view v-for="(item, index) in orderData" :key="index">
|
||||
<view class="contentList">
|
||||
<!-- 订单头部信息 -->
|
||||
<view class="order-header" @click="toDetails(item.order_status)">
|
||||
<text>提交订单:{{ item.order_time }}</text>
|
||||
<view
|
||||
v-if="item.order_status == 6 || item.order_status == 5"
|
||||
class="status3"
|
||||
>{{ getOrderStatus(item.order_status) }}</view
|
||||
>
|
||||
<view v-else-if="item.order_status == 7" class="status2">
|
||||
<img src="http://localhost:8080/refund.png" />
|
||||
{{ getOrderStatus(item.order_status) }}
|
||||
</view>
|
||||
<view v-else class="order_status">{{
|
||||
getOrderStatus(item.order_status)
|
||||
}}</view>
|
||||
<view v-if="selectedTab === 6">
|
||||
<awaitRated />
|
||||
</view>
|
||||
<view v-if="selectedTab === 7">
|
||||
<rated />
|
||||
</view>
|
||||
<view v-else>
|
||||
<view v-for="(item, index) in orderData" :key="index">
|
||||
<view class="contentList">
|
||||
<!-- 订单头部信息 -->
|
||||
<view class="order-header" @click="toDetails(item.order_status)">
|
||||
<text>提交订单:{{ item.order_time }}</text>
|
||||
<view
|
||||
v-if="item.order_status == 6 || item.order_status == 5"
|
||||
class="status3"
|
||||
>{{ getOrderStatus(item.order_status) }}</view
|
||||
>
|
||||
<view v-else-if="item.order_status == 7" class="status2">
|
||||
<img src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/refund.png" />
|
||||
{{ getOrderStatus(item.order_status) }}
|
||||
</view>
|
||||
<view v-else class="order_status">{{
|
||||
getOrderStatus(item.order_status)
|
||||
}}</view>
|
||||
</view>
|
||||
|
||||
<!-- 商品列表 -->
|
||||
<view class="goods-list" @click="toDetails(item.order_status)">
|
||||
<view
|
||||
v-for="(goods, goodsIndex) in item.commodity_order_item_list
|
||||
.commodity_pic"
|
||||
:key="goodsIndex"
|
||||
class="goods-item"
|
||||
>
|
||||
<image :src="goods.image" class="goods-img"></image>
|
||||
</view>
|
||||
<!-- 商品列表 -->
|
||||
<view class="goods-list" @click="toDetails(item.order_status)">
|
||||
<view
|
||||
v-for="(goods, goodsIndex) in item.commodity_order_item_list
|
||||
.commodity_pic"
|
||||
:key="goodsIndex"
|
||||
class="goods-item"
|
||||
>
|
||||
<image :src="goods.image" class="goods-img"></image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 订单底部信息 -->
|
||||
<view class="order-footer">
|
||||
<view
|
||||
class="order-footer-text"
|
||||
@click="toDetails(item.order_status)"
|
||||
>共{{ item.total_count }}件商品,共计
|
||||
<text> {{ item.total_amount }}</text>
|
||||
<!-- 订单底部信息 -->
|
||||
<view class="order-footer">
|
||||
<view
|
||||
class="order-footer-text"
|
||||
@click="toDetails(item.order_status)"
|
||||
>共{{ item.total_count }}件商品,共计
|
||||
<text> {{ item.total_amount }}</text>
|
||||
</view>
|
||||
<view>
|
||||
<view class="btn-group" v-if="item.order_status === 1">
|
||||
<button class="cancel-btn" @click="cancelOrder">
|
||||
取消订单
|
||||
</button>
|
||||
<button class="yfd-btn" @click="cancelOrder">运费单</button>
|
||||
<button class="pay-btn" @click="goToPay">立即支付</button>
|
||||
</view>
|
||||
<view>
|
||||
<view class="btn-group" v-if="item.order_status === 1">
|
||||
<button class="cancel-btn" @click="cancelOrder">
|
||||
取消订单
|
||||
</button>
|
||||
<button class="yfd-btn" @click="cancelOrder">运费单</button>
|
||||
<button class="pay-btn" @click="goToPay">立即支付</button>
|
||||
</view>
|
||||
<view class="btn-group" v-if="item.order_status === 3">
|
||||
<button class="yfd-btn" @click="cancelOrder">运费单</button>
|
||||
</view>
|
||||
<view class="btn-group" v-if="item.order_status === 6">
|
||||
<button class="yfd-btn" @click="cancelOrder">运费单</button>
|
||||
<button class="pay-btn" @click="cancelOrder">
|
||||
再来一单
|
||||
</button>
|
||||
</view>
|
||||
<view class="btn-group" v-if="item.order_status === 4">
|
||||
<button class="cancel-btn" @click="checkLogistics">
|
||||
查看物流
|
||||
</button>
|
||||
<button class="yfd-btn" @click="cancelOrder">运费单</button>
|
||||
<button class="pay-btn" @click="cancelOrder">
|
||||
再来一单
|
||||
</button>
|
||||
</view>
|
||||
<view class="btn-group" v-if="item.order_status === 5">
|
||||
<button class="cancel-btn" @click="orderEvaluate">
|
||||
服务评价
|
||||
</button>
|
||||
<button class="yfd-btn" @click="cancelOrder">运费单</button>
|
||||
<button class="pay-btn" @click="cancelOrder">
|
||||
再来一单
|
||||
</button>
|
||||
</view>
|
||||
<view class="btn-group" v-if="item.order_status === 7">
|
||||
<button class="pay-btn" @click="cancelOrder">
|
||||
再来一单
|
||||
</button>
|
||||
</view>
|
||||
<view class="btn-group" v-if="item.order_status === 3">
|
||||
<button class="yfd-btn" @click="cancelOrder">运费单</button>
|
||||
</view>
|
||||
<view class="btn-group" v-if="item.order_status === 6">
|
||||
<button class="yfd-btn" @click="cancelOrder">运费单</button>
|
||||
<button class="pay-btn" @click="cancelOrder">再来一单</button>
|
||||
</view>
|
||||
<view class="btn-group" v-if="item.order_status === 4">
|
||||
<button class="cancel-btn" @click="checkLogistics">
|
||||
查看物流
|
||||
</button>
|
||||
<button class="yfd-btn" @click="cancelOrder">运费单</button>
|
||||
<button class="pay-btn" @click="cancelOrder">再来一单</button>
|
||||
</view>
|
||||
<view class="btn-group" v-if="item.order_status === 5">
|
||||
<button class="cancel-btn" @click="orderEvaluate">
|
||||
服务评价
|
||||
</button>
|
||||
<button class="yfd-btn" @click="cancelOrder">运费单</button>
|
||||
<button class="pay-btn" @click="cancelOrder">再来一单</button>
|
||||
</view>
|
||||
<view class="btn-group" v-if="item.order_status === 7">
|
||||
<button class="pay-btn" @click="cancelOrder">再来一单</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -104,26 +100,38 @@
|
||||
</template>
|
||||
<script>
|
||||
import { picUrl, NavgateTo, request } from "../../../utils";
|
||||
import { apiArr } from "../../../api/order"
|
||||
import { apiArr } from "../../../api/order";
|
||||
import Rated from "./rated.vue";
|
||||
import AwaitRated from "./awaitRated.vue";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Rated,
|
||||
AwaitRated,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
categoryList: [
|
||||
{ category_name: "全部" },
|
||||
{ category_name: "待付款" },
|
||||
{ category_name: "已取消" },
|
||||
{ category_name: "待发货" },
|
||||
{ category_name: "配送中" },
|
||||
{ category_name: "已完成" },
|
||||
{ category_name: "待评价" },
|
||||
{ category_name: "已评价" },
|
||||
{ category_name: "售后" },
|
||||
],
|
||||
selectedTab: 0,
|
||||
orderData:[],
|
||||
orderData: [],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
selectTab(index, item) {
|
||||
this.selectedTab = index;
|
||||
this.getOrderList()
|
||||
if (index !== 6) {
|
||||
this.getOrderList();
|
||||
}
|
||||
},
|
||||
cancelOrder() {
|
||||
// 取消订单逻辑
|
||||
@ -138,68 +146,71 @@ export default {
|
||||
});
|
||||
},
|
||||
goToPay() {
|
||||
console.log("🚀 ~ goToPay ~ goToPay:", "去支付...");
|
||||
},
|
||||
toDetails(order_status) {
|
||||
NavgateTo(`/packages/myOrders/orderDetails/index?order_status=${order_status}`);
|
||||
NavgateTo(
|
||||
`/packages/myOrders/orderDetails/index?order_status=${order_status}`
|
||||
);
|
||||
},
|
||||
|
||||
checkLogistics() {
|
||||
NavgateTo(`/packages/myOrders/logistics/index`);
|
||||
},
|
||||
|
||||
orderEvaluate(){
|
||||
orderEvaluate() {
|
||||
NavgateTo(`/packages/myOrders/orderEvaluate/index`);
|
||||
},
|
||||
|
||||
getOrderStatus(order_status){
|
||||
switch(order_status){
|
||||
getOrderStatus(order_status) {
|
||||
switch (order_status) {
|
||||
case 1:
|
||||
return '待付款'
|
||||
return "待付款";
|
||||
case 2:
|
||||
return '支付中'
|
||||
return "支付中";
|
||||
case 3:
|
||||
return '待发货'
|
||||
return "待发货";
|
||||
case 4:
|
||||
return '配送中'
|
||||
return "配送中";
|
||||
case 5:
|
||||
return '已完成'
|
||||
return "已完成";
|
||||
case 6:
|
||||
return '已取消'
|
||||
return "已取消";
|
||||
case 7:
|
||||
return '退款中'
|
||||
return "退款中";
|
||||
case 8:
|
||||
return '已退款'
|
||||
return "已退款";
|
||||
}
|
||||
},
|
||||
|
||||
getOrderList(){
|
||||
getOrderList() {
|
||||
request(apiArr.orderList, "POST", {
|
||||
user_id: uni.getStorageSync('userId')
|
||||
}).then(res => {
|
||||
user_id: uni.getStorageSync("userId"),
|
||||
}).then((res) => {
|
||||
const orderList = res.order_list || [];
|
||||
let filteredData = orderList;
|
||||
|
||||
|
||||
if (this.selectedTab !== 0) {
|
||||
const statusMap = {
|
||||
1: 1, // 待付款
|
||||
2: 3, // 待发货
|
||||
3: 4, // 配送中
|
||||
4: 5 // 已完成
|
||||
1: 1, // 待付款
|
||||
2: 3, // 待发货
|
||||
3: 4, // 配送中
|
||||
4: 5, // 已完成
|
||||
};
|
||||
const targetStatus = statusMap[this.selectedTab];
|
||||
if (targetStatus) {
|
||||
filteredData = orderList.filter(item => item.order_status === targetStatus);
|
||||
filteredData = orderList.filter(
|
||||
(item) => item.order_status === targetStatus
|
||||
);
|
||||
}
|
||||
}
|
||||
this.orderData = filteredData;
|
||||
})
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
|
||||
onLoad(options) {
|
||||
this.getOrderList();
|
||||
},
|
||||
this.getOrderList();
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
|
||||
133
packages/myOrders/index/rated.css
Normal file
133
packages/myOrders/index/rated.css
Normal file
@ -0,0 +1,133 @@
|
||||
.evaluation-container {
|
||||
padding: 20rpx;
|
||||
background-color: #f5f7fb;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.order-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 15rpx 0;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.order-name {
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.order-number {
|
||||
font-size: 30rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.order-date {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.evaluation-content {
|
||||
background: #fff;
|
||||
border-radius: 10rpx;
|
||||
padding: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.evaluation-area {
|
||||
background: #f5f7fb;
|
||||
padding: 20rpx 20rpx 50rpx 20rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.evaluation-text {
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
line-height: 40rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.image-list {
|
||||
display: flex;
|
||||
gap: 15rpx;
|
||||
padding: 10rpx 0;
|
||||
}
|
||||
|
||||
.image-item {
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
border: 1rpx dashed #ddd;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.image-item image {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
}
|
||||
|
||||
.image-text {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.product-info {
|
||||
background: #fff;
|
||||
border-radius: 10rpx;
|
||||
padding: 20rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.product-img {
|
||||
position: relative;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.product-img image {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
|
||||
.tag {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background-color: #ff7d00;
|
||||
color: white;
|
||||
font-size: 22rpx;
|
||||
padding: 5rpx 10rpx;
|
||||
border-radius: 20rpx 0 20rpx 20rpx;
|
||||
}
|
||||
|
||||
.product-details {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.product-name {
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
font-weight: bold;
|
||||
margin-bottom: 10rpx;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.product-spec {
|
||||
font-size: 22rpx;
|
||||
color: #666;
|
||||
margin-bottom: 10rpx;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.product-unit {
|
||||
font-size: 26rpx;
|
||||
color: red;
|
||||
margin-bottom: 10rpx;
|
||||
display: block;
|
||||
}
|
||||
79
packages/myOrders/index/rated.vue
Normal file
79
packages/myOrders/index/rated.vue
Normal file
@ -0,0 +1,79 @@
|
||||
<template>
|
||||
<view class="evaluation-container">
|
||||
<!-- 评价内容区域 -->
|
||||
<view class="evaluation-content">
|
||||
<!-- 订单头部信息 -->
|
||||
<view class="order-header">
|
||||
<text class="order-name">{{ orderInfo.orderName }}</text>
|
||||
<text class="order-number">{{ orderInfo.orderNumber }}</text>
|
||||
</view>
|
||||
|
||||
<view class="evaluation-area">
|
||||
<text class="evaluation-text">{{ evaluationInfo.content }}</text>
|
||||
<!-- 评价图片区域 -->
|
||||
<view class="image-list">
|
||||
<view
|
||||
class="image-item"
|
||||
v-for="(img, index) in evaluationInfo.images"
|
||||
:key="index"
|
||||
>
|
||||
<image :src="img.url" mode="aspectFill"></image>
|
||||
<text class="image-text">{{ img.text }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<text class="order-date">{{ orderInfo.date }}</text>
|
||||
</view>
|
||||
|
||||
<!-- 商品信息区域 -->
|
||||
<view class="product-info">
|
||||
<view class="product-img">
|
||||
<image :src="productInfo.imageUrl" mode="aspectFit"></image>
|
||||
<view
|
||||
class="tag"
|
||||
v-for="(tag, index) in productInfo.tags"
|
||||
:key="index"
|
||||
>{{ tag }}</view
|
||||
>
|
||||
</view>
|
||||
<view class="product-details">
|
||||
<text class="product-name">{{ productInfo.name }}</text>
|
||||
<text class="product-spec">{{ productInfo.spec }}</text>
|
||||
<text class="product-unit">{{ productInfo.unit }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
orderInfo: {
|
||||
orderName: "衡水商贸国际公司",
|
||||
orderNumber: "4534534255",
|
||||
date: "2025-07-21",
|
||||
},
|
||||
evaluationInfo: {
|
||||
content: "评价文字内容",
|
||||
images: [
|
||||
{ url: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/eval1.png", text: "评价图片" },
|
||||
{ url: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/eval2.png", text: "评价图片" },
|
||||
{ url: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/eval3.png", text: "评价图片" },
|
||||
],
|
||||
},
|
||||
productInfo: {
|
||||
imageUrl: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/product.png",
|
||||
tags: ["当日达", "当日达"],
|
||||
name: "货品名称",
|
||||
spec: "货品规格",
|
||||
unit: "货品单位",
|
||||
},
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./rated.css");
|
||||
</style>
|
||||
@ -23,7 +23,7 @@
|
||||
<img
|
||||
class="copy-btn"
|
||||
@click="copyNumber"
|
||||
src="http://localhost:8080/copy.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/copy.png"
|
||||
alt="复制"
|
||||
/>
|
||||
</view>
|
||||
|
||||
@ -16,7 +16,7 @@
|
||||
<view class="countdown">预计到货时间: 2025-09-09 9:59:59</view>
|
||||
<view class="tips">
|
||||
配送司机:15901518415
|
||||
<img class="phone" src="http://localhost:8080/phone.png" />
|
||||
<img class="phone" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/phone.png" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="status-bar" v-if="status === '已完成' || status === '退款中'">
|
||||
@ -190,21 +190,21 @@ export default {
|
||||
remark: "明天9点之前送到",
|
||||
goodsList: [
|
||||
{
|
||||
image: "http://localhost:8080/order_details.png",
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_details.png",
|
||||
name: "泰国金枕榴莲",
|
||||
desc: "泰国金枕榴莲 软糯 香甜",
|
||||
price: "125.9",
|
||||
quantity: 1,
|
||||
},
|
||||
{
|
||||
image: "http://localhost:8080/order_details.png",
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_details.png",
|
||||
name: "泰国金枕榴莲",
|
||||
desc: "泰国金枕榴莲 软糯 香甜",
|
||||
price: "125.9",
|
||||
quantity: 1,
|
||||
},
|
||||
{
|
||||
image: "http://localhost:8080/order_details.png",
|
||||
image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_details.png",
|
||||
name: "泰国金枕榴莲",
|
||||
desc: "泰国金枕榴莲 软糯 香甜",
|
||||
price: "125.9",
|
||||
|
||||
@ -87,7 +87,7 @@
|
||||
v-if="imageList.length < 3"
|
||||
>
|
||||
<image
|
||||
src="http://localhost:8080/upload.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/upload.png"
|
||||
class="upload-icon"
|
||||
></image>
|
||||
<view class="upload-text">上传图片</view>
|
||||
@ -108,16 +108,16 @@ export default {
|
||||
return {
|
||||
// 商品列表
|
||||
goods: [
|
||||
{ image: "http://localhost:8080/order_index1.png" },
|
||||
{ image: "http://localhost:8080/order_index2.png" },
|
||||
{ image: "http://localhost:8080/order_index3.png" },
|
||||
{ image: "http://localhost:8080/order_index4.png" },
|
||||
{ image: "http://localhost:8080/order_index5.png" },
|
||||
{ image: "http://localhost:8080/order_index1.png" },
|
||||
{ image: "http://localhost:8080/order_index2.png" },
|
||||
{ image: "http://localhost:8080/order_index3.png" },
|
||||
{ image: "http://localhost:8080/order_index4.png" },
|
||||
{ image: "http://localhost:8080/order_index5.png" },
|
||||
{ image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_index1.png" },
|
||||
{ image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_index2.png" },
|
||||
{ image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_index3.png" },
|
||||
{ image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_index4.png" },
|
||||
{ image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_index5.png" },
|
||||
{ image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_index1.png" },
|
||||
{ image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_index2.png" },
|
||||
{ image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_index3.png" },
|
||||
{ image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_index4.png" },
|
||||
{ image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/myOrder/order_index5.png" },
|
||||
],
|
||||
// 评分数据
|
||||
qualityRating: 5,
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
page {
|
||||
background-color: #fff;
|
||||
padding-bottom: 0;
|
||||
padding-bottom: 20rpx;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
@ -28,9 +28,6 @@ image {
|
||||
padding-left: 20rpx;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.swiper {
|
||||
height: 750rpx;
|
||||
width: 750rpx;
|
||||
@ -107,6 +104,45 @@ image {
|
||||
margin-right: 40rpx;
|
||||
}
|
||||
|
||||
/* 促销信息样式 */
|
||||
.promotions-container {
|
||||
padding: 15rpx;
|
||||
background-color: #FFF;
|
||||
border-radius: 10rpx;
|
||||
margin: 15rpx 0;
|
||||
}
|
||||
|
||||
.promotion-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.promotion-tag {
|
||||
width: 80rpx;
|
||||
text-align: center;
|
||||
background-color: #ffe8e5;
|
||||
color: #ff5029;
|
||||
padding: 5rpx 15rpx;
|
||||
border-radius: 10rpx;
|
||||
font-size: 26rpx;
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
|
||||
.promotion-content {
|
||||
font-size: 26rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.promotion-content1 {
|
||||
width: auto;
|
||||
padding: 5rpx 10rpx;
|
||||
text-align: center;
|
||||
background-color: #ff6749;
|
||||
color: white;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.GG_Item {
|
||||
font-size: 26rpx;
|
||||
color: #999999;
|
||||
@ -133,7 +169,7 @@ image {
|
||||
}
|
||||
|
||||
.GoodsMsg {
|
||||
font-size: 33rpx;
|
||||
/* font-size: 30rpx; */
|
||||
color: #222222;
|
||||
margin: 0 20rpx;
|
||||
margin-top: 55rpx;
|
||||
@ -151,14 +187,14 @@ image {
|
||||
.Msg_ItemTit {
|
||||
width: 120rpx;
|
||||
margin-right: 100rpx;
|
||||
font-size: 28rpx;
|
||||
font-size: 26rpx;
|
||||
color: #999999;
|
||||
margin: 0 20rpx;
|
||||
padding: 30rpx 0;
|
||||
}
|
||||
|
||||
.Msg_ItemCon {
|
||||
font-size: 28rpx;
|
||||
font-size: 26rpx;
|
||||
color: #222222;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -273,7 +309,7 @@ image {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 28rpx;
|
||||
font-size: 26rpx;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
@ -365,7 +401,215 @@ image {
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.active{
|
||||
.active {
|
||||
background: #FF370B;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.priceInfo {
|
||||
height: 450rpx;
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.priceInfo-title {
|
||||
/* font-size: 30rpx; */
|
||||
font-weight: bolder;
|
||||
margin: 15rpx 0 20rpx 0;
|
||||
}
|
||||
|
||||
.priceInfo-content {
|
||||
font-size: 26rpx;
|
||||
color: #9c9c9c;
|
||||
line-height: 1.7;
|
||||
}
|
||||
|
||||
.priceInfo-content-title {
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.fenge {
|
||||
width: 100%;
|
||||
height: 15rpx;
|
||||
background-color: #f5f7fb;
|
||||
}
|
||||
|
||||
/* 评价部分样式 */
|
||||
.reviews-section {
|
||||
padding: 20rpx;
|
||||
background-color: #fff;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.reviews-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.reviews-header h3 {
|
||||
/* font-size: 32rpx; */
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.view-all {
|
||||
color: #999;
|
||||
font-size: 26rpx;
|
||||
background: none;
|
||||
border: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.reviews-list {
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.review-item {
|
||||
padding: 20rpx 0;
|
||||
border-bottom: 1rpx solid #f5f5f5;
|
||||
}
|
||||
|
||||
.review-user {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 15rpx;
|
||||
}
|
||||
|
||||
.user-avatar {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
border-radius: 50%;
|
||||
margin-right: 15rpx;
|
||||
}
|
||||
|
||||
.user-info {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.user-name {
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.user-purchase {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
margin: 10rpx 0;
|
||||
}
|
||||
|
||||
.review-content {
|
||||
font-size: 27rpx;
|
||||
line-height: 1.5;
|
||||
margin-bottom: 15rpx;
|
||||
}
|
||||
|
||||
.review-images {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 10rpx;
|
||||
margin-bottom: 15rpx;
|
||||
}
|
||||
|
||||
.review-img {
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
|
||||
.review-time {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.popup-header {
|
||||
display: flex;
|
||||
width: 90%;
|
||||
padding-left: 80rpx;
|
||||
margin: 20rpx 0;
|
||||
}
|
||||
|
||||
.popup-header-h3 {
|
||||
font-weight: bold;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.popup-header-view {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
|
||||
.temp {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.temp1 {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
font-size: 24rpx;
|
||||
color: #959595;
|
||||
margin: 20rpx 0 5rpx 0;
|
||||
}
|
||||
|
||||
.temp_img {
|
||||
width: 35rpx;
|
||||
height: 35rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.temp_img1 {
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
margin: 5rpx 5rpx 0 5rpx;
|
||||
}
|
||||
|
||||
.itemSize {
|
||||
width: 30%;
|
||||
font-size: 26rpx;
|
||||
color: #333;
|
||||
background: #F6F7FB;
|
||||
border-radius: 40rpx;
|
||||
padding: 10rpx 15rpx;
|
||||
white-space: nowrap;
|
||||
margin:20rpx 30rpx;
|
||||
}
|
||||
|
||||
.itemSize_active {
|
||||
background: #FF370B;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.itemSize-img{
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
margin-right: 30rpx;
|
||||
border-radius: 20rpx;
|
||||
border:1rpx solid red;
|
||||
}
|
||||
|
||||
.itemSize_top{
|
||||
display: flex;
|
||||
margin-left: 30rpx;
|
||||
}
|
||||
|
||||
.itemSize_info {
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.itemSize_name {
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.itemSize_price {
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
margin-top: 10rpx;
|
||||
color: red;
|
||||
}
|
||||
@ -1,16 +1,16 @@
|
||||
<template>
|
||||
<view>
|
||||
<div class="header">
|
||||
<div
|
||||
<view class="header">
|
||||
<view
|
||||
class="searchBox"
|
||||
:style="{ height: localHeight + 'px', paddingTop: top + 'px' }"
|
||||
>
|
||||
<div class="searchBox_left" @click="back">
|
||||
<view class="searchBox_left" @click="back">
|
||||
<u-icon name="arrow-left" size="20px" color="#000"></u-icon>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="swiper">
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="swiper">
|
||||
<swiper
|
||||
:indicator-dots="false"
|
||||
:autoplay="true"
|
||||
@ -26,24 +26,24 @@
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
|
||||
<div class="NumDot">
|
||||
<view class="NumDot">
|
||||
{{ currentIndex }} /{{ currentGG.goods_carousel.length }}
|
||||
</div>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<div class="Money">
|
||||
<div class="MoneyMark">¥</div>
|
||||
<view class="Money">
|
||||
<view class="MoneyMark">¥</view>
|
||||
{{ currentGG.sales_price }}
|
||||
<div class="MoneyUnit">/{{ currentGG.goods_unit }}</div>
|
||||
<view class="MoneyUnit">/{{ currentGG.goods_unit }}</view>
|
||||
|
||||
<div class="oldMoney">¥{{ currentGG.market_price }}</div>
|
||||
</div>
|
||||
<view class="oldMoney">¥{{ currentGG.market_price }}</view>
|
||||
</view>
|
||||
|
||||
<!-- 规格 -->
|
||||
<!-- @click="changeGG2(item, index)" :class="index == currentGGIndex ? 'active' : ''"> -->
|
||||
<div class="GGBox">
|
||||
<div class="GG_left">
|
||||
<div
|
||||
<view class="GGBox">
|
||||
<view class="GG_left">
|
||||
<view
|
||||
class="GG_Item"
|
||||
v-for="(item, index) in info.commodity_goods_info_list"
|
||||
:key="item.id"
|
||||
@ -51,57 +51,150 @@
|
||||
:class="index == currentGGIndex ? 'active' : ''"
|
||||
>
|
||||
{{ item.goods_spec }} / {{ item.goods_unit }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="GG_rigth">
|
||||
</view>
|
||||
</view>
|
||||
<view class="GG_rigth">
|
||||
共{{ info.commodity_goods_info_list.length }}款<u-icon
|
||||
size="26rpx"
|
||||
name="arrow-right"
|
||||
></u-icon>
|
||||
</div>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<div class="Tit">{{ currentGG.goods_name }}</div>
|
||||
<div class="Msg">{{ currentGG.commodity_brief }}</div>
|
||||
<div class="GoodsMsg">商品详情</div>
|
||||
<view class="Tit">{{ currentGG.goods_name }}</view>
|
||||
<view class="Msg">{{ currentGG.commodity_brief }}</view>
|
||||
|
||||
<div class="Msg_Item">
|
||||
<div class="Msg_ItemTit">商品编号</div>
|
||||
<div class="Msg_ItemCon" @click="copys(currentGG.goods_no)">
|
||||
<view class="fenge"></view>
|
||||
|
||||
<!-- 促销信息区域 -->
|
||||
<view class="promotions-container">
|
||||
<view class="promotion-item">
|
||||
<view class="promotion-tag">优惠</view>
|
||||
<view class="promotion-content promotion-content1">满100减10</view>
|
||||
</view>
|
||||
<view class="promotion-item">
|
||||
<view class="promotion-tag">限购</view>
|
||||
<view class="promotion-content">限购5件</view>
|
||||
</view>
|
||||
<view class="promotion-item">
|
||||
<view class="promotion-tag">阶梯价</view>
|
||||
<view class="promotion-content">1~9件 9.5元/件;>10件 8.0元/件</view>
|
||||
</view>
|
||||
<view class="promotion-item">
|
||||
<view class="promotion-tag">满赠</view>
|
||||
<view class="promotion-content">满5赠1,满10赠3</view>
|
||||
</view>
|
||||
<view class="promotion-item">
|
||||
<view class="promotion-tag">满减</view>
|
||||
<view class="promotion-content">满100减5,满200减20</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="fenge"></view>
|
||||
|
||||
<view class="Msg_Item">
|
||||
<view class="Msg_ItemTit">质检</view>
|
||||
<view class="Msg_ItemCon">质检报告</view>
|
||||
</view>
|
||||
<view class="Msg_Item">
|
||||
<view class="Msg_ItemTit">押金</view>
|
||||
<view class="Msg_ItemCon">需另付押金:¥30.00(30天可退)</view>
|
||||
</view>
|
||||
<view class="Msg_Item">
|
||||
<view class="Msg_ItemTit">配送</view>
|
||||
<view class="Msg_ItemCon"> 12:00前下单,预计8月21日送达; </view>
|
||||
</view>
|
||||
<view class="fenge"></view>
|
||||
|
||||
<!-- 评价部分 -->
|
||||
<view class="reviews-section">
|
||||
<view class="reviews-header">
|
||||
<h3>评价({{ comments.length }})</h3>
|
||||
<view class="view-all" @click="showPopup">查看全部 ></view>
|
||||
</view>
|
||||
<view class="reviews-list" v-if="comments.length > 0">
|
||||
<view
|
||||
class="review-item"
|
||||
v-for="(comment, index) in comments"
|
||||
:key="index"
|
||||
>
|
||||
<view class="review-user">
|
||||
<image :src="comment.avatar" class="user-avatar"></image>
|
||||
<view class="user-info">
|
||||
<view class="user-name">{{ comment.username }}</view>
|
||||
</view>
|
||||
<view class="review-time">{{ comment.time }}</view>
|
||||
</view>
|
||||
<view class="user-purchase">已购 {{ comment.product }}</view>
|
||||
<view class="review-content">{{ comment.content }}</view>
|
||||
<view class="review-images" v-if="comment.images.length > 0">
|
||||
<image
|
||||
:src="img"
|
||||
class="review-img"
|
||||
v-for="(img, idx) in comment.images"
|
||||
:key="idx"
|
||||
></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="fenge"></view>
|
||||
|
||||
<h3 class="GoodsMsg">商品详情</h3>
|
||||
|
||||
<view class="Msg_Item">
|
||||
<view class="Msg_ItemTit">商品编号</view>
|
||||
<view class="Msg_ItemCon" @click="copys(currentGG.goods_no)">
|
||||
{{ currentGG.goods_no }}
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_copy.png"
|
||||
></image>
|
||||
</div>
|
||||
</div>
|
||||
<div class="Msg_Item">
|
||||
<div class="Msg_ItemTit">规格说明</div>
|
||||
<div class="Msg_ItemCon">{{ currentGG.goods_spec }}</div>
|
||||
</div>
|
||||
<div class="Msg_Item">
|
||||
<div class="Msg_ItemTit">售卖单位</div>
|
||||
<div class="Msg_ItemCon">{{ currentGG.goods_unit }}</div>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
<view class="Msg_Item">
|
||||
<view class="Msg_ItemTit">规格说明</view>
|
||||
<view class="Msg_ItemCon">{{ currentGG.goods_spec }}</view>
|
||||
</view>
|
||||
<view class="Msg_Item">
|
||||
<view class="Msg_ItemTit">售卖单位</view>
|
||||
<view class="Msg_ItemCon">{{ currentGG.goods_unit }}</view>
|
||||
</view>
|
||||
|
||||
<div class="GoosMsg">
|
||||
<view class="GoosMsg">
|
||||
<image
|
||||
v-for="item in currentGG.goods_detail_pic"
|
||||
:src="picUrl + item"
|
||||
:key="item"
|
||||
mode="widthFix"
|
||||
></image>
|
||||
</div>
|
||||
</view>
|
||||
|
||||
<view class="priceInfo">
|
||||
<h3 class="priceInfo-title">价格说明</h3>
|
||||
<view class="priceInfo-content">
|
||||
<view>
|
||||
<text class="priceInfo-content-title">划线价格:</text>
|
||||
指商品的厂商指导价、正品零售价、市面常见价或该商品曾经展示过的销售价等,并非原价。仅供参考。
|
||||
</view>
|
||||
<view>
|
||||
<text class="priceInfo-content-title">未划线价格:</text>
|
||||
指商品的实时价格,不因表述的差异改变性质,具体成交价格根据商品参加活动,或使用优惠券等发生变化最终以订单结算价格为准。
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 底部购物车 -->
|
||||
<div class="Car">
|
||||
<div class="car_left">
|
||||
<div class="share" @click="share">
|
||||
<view class="Car">
|
||||
<view class="car_left">
|
||||
<view class="share" @click="share">
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_share.png"
|
||||
mode="widthFix"
|
||||
></image>
|
||||
分享
|
||||
</div>
|
||||
<div class="cars" @click="car">
|
||||
</view>
|
||||
<view class="cars" @click="car">
|
||||
<u-badge
|
||||
numberType="limit"
|
||||
:type="type"
|
||||
@ -114,10 +207,10 @@
|
||||
mode="widthFix"
|
||||
></image>
|
||||
购物车
|
||||
</div>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<div
|
||||
<view
|
||||
class="car_right"
|
||||
v-if="
|
||||
!info.commodity_goods_info_list[currentGGIndex].cart_count ||
|
||||
@ -126,9 +219,9 @@
|
||||
@click="addCar"
|
||||
>
|
||||
加入购物车
|
||||
</div>
|
||||
</view>
|
||||
|
||||
<div
|
||||
<view
|
||||
class="car_right"
|
||||
v-if="
|
||||
info.commodity_goods_info_list[currentGGIndex].cart_count.count > 0
|
||||
@ -157,54 +250,136 @@
|
||||
<u-icon name="plus" color="#FFFFFF" size="36" bold></u-icon>
|
||||
</view>
|
||||
</u-number-box>
|
||||
</div>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 分享 -->
|
||||
<div class="shadow" @click.stop="changeShadow" v-if="boxshadow1">
|
||||
<div class="shadowBox1">
|
||||
<div class="shadowBox1Item" @click="shareFriend">
|
||||
<view class="shadow" @click.stop="changeShadow" v-if="boxshadow1">
|
||||
<view class="shadowBox1">
|
||||
<view class="shadowBox1Item" @click="shareFriend">
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_WX.png"
|
||||
mode="aspectFill"
|
||||
></image>
|
||||
微信好友
|
||||
</div>
|
||||
<div class="shadowBox1Item" @click="openSave">
|
||||
</view>
|
||||
<view class="shadowBox1Item" @click="openSave">
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_saveImg.png"
|
||||
mode="aspectFill"
|
||||
></image>
|
||||
生成海报
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 海报 -->
|
||||
<div class="shadow" @click="changeShadow2" v-if="boxshadow2">
|
||||
<div class="shadowBox2">
|
||||
<div class="shadowBox_img">
|
||||
<div class="boxshadow_tit">今日商品推荐</div>
|
||||
<div class="boxshadow_img">
|
||||
<view class="shadow" @click="changeShadow2" v-if="boxshadow2">
|
||||
<view class="shadowBox2">
|
||||
<view class="shadowBox_img">
|
||||
<view class="boxshadow_tit">今日商品推荐</view>
|
||||
<view class="boxshadow_img">
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_share_img.png"
|
||||
>
|
||||
</image>
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
<div class="shadowBoxInfo">
|
||||
<div class="shadowboxInfo_left">二维码</div>
|
||||
<div class="shadowboxInfo_right">
|
||||
<div class="shadowboxInfo_right_1">正鲜生</div>
|
||||
<div class="shadowboxInfo_right_2">
|
||||
</view>
|
||||
<view class="line"></view>
|
||||
<view class="shadowBoxInfo">
|
||||
<view class="shadowboxInfo_left">二维码</view>
|
||||
<view class="shadowboxInfo_right">
|
||||
<view class="shadowboxInfo_right_1">正鲜生</view>
|
||||
<view class="shadowboxInfo_right_2">
|
||||
长按识别小程序 <br />
|
||||
数量有限马上抢购
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="shadowBox_btn" @click.stop="saveImg">保存海报</div>
|
||||
</div>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="shadowBox_btn" @click.stop="saveImg">保存海报</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 评价 查看详情 -->
|
||||
<u-popup
|
||||
:show="show"
|
||||
round="20rpx"
|
||||
mode="bottom"
|
||||
@close="close"
|
||||
@open="open"
|
||||
:z-index="10070"
|
||||
>
|
||||
<view class="reviews-section">
|
||||
<view class="popup-header">
|
||||
<h3 class="popup-header-h3">评价</h3>
|
||||
<view class="popup-header-view" @click="close">取消</view>
|
||||
</view>
|
||||
<view class="temp">
|
||||
<view class="temp1">
|
||||
<img class="temp_img" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/pingjia.png" />
|
||||
为你展示真实评价
|
||||
</view>
|
||||
<view class="temp1" @click="showSizePopup">
|
||||
款式
|
||||
<img class="temp_img1" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/kuanshi.png" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="reviews-list" v-if="comments.length > 0">
|
||||
<view
|
||||
class="review-item"
|
||||
v-for="(comment, index) in comments"
|
||||
:key="index"
|
||||
>
|
||||
<view class="review-user">
|
||||
<image :src="comment.avatar" class="user-avatar"></image>
|
||||
<view class="user-info">
|
||||
<view class="user-name">{{ comment.username }}</view>
|
||||
</view>
|
||||
<view class="review-time">{{ comment.time }}</view>
|
||||
</view>
|
||||
<view class="user-purchase">已购 {{ comment.product }}</view>
|
||||
<view class="review-content">{{ comment.content }}</view>
|
||||
<view class="review-images" v-if="comment.images.length > 0">
|
||||
<image
|
||||
:src="img"
|
||||
class="review-img"
|
||||
v-for="(img, idx) in comment.images"
|
||||
:key="idx"
|
||||
></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
|
||||
<!-- 选择款式 -->
|
||||
<u-popup
|
||||
:show="showSize"
|
||||
round="20rpx"
|
||||
mode="bottom"
|
||||
@close="closeSize"
|
||||
@open="open"
|
||||
>
|
||||
<view class="popup-header">
|
||||
<h3 class="popup-header-h3">选择款式</h3>
|
||||
<view class="popup-header-view" @click="closeSize">取消</view>
|
||||
</view>
|
||||
<view class="itemSize_top">
|
||||
<image :src="changeImg" class="itemSize-img"></image>
|
||||
<view class="itemSize_info">
|
||||
<view class="itemSize_name">{{ changeName }}</view>
|
||||
<view class="itemSize_price">¥{{ changePrice }}/袋</view>
|
||||
</view>
|
||||
</view>
|
||||
<view
|
||||
class="itemSize"
|
||||
v-for="(item, index) in info.commodity_goods_info_list"
|
||||
:key="item.id"
|
||||
@click="changeGG(item, index)"
|
||||
:class="index == currentGGIndex ? 'itemSize_active' : ''"
|
||||
>
|
||||
{{ item.goods_name }} {{ item.goods_spec }} / {{ item.goods_unit }}
|
||||
</view>
|
||||
</u-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@ -231,6 +406,38 @@ export default {
|
||||
currentGGIndex: "", //当前规格index
|
||||
|
||||
carOrderList: [],
|
||||
// 新增评论数据
|
||||
showReviewPopup: false,
|
||||
comments: [
|
||||
{
|
||||
avatar: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
username: "TP",
|
||||
product: "库尔勒香梨 10kg/箱",
|
||||
content:
|
||||
"踏入这家位于街角的餐厅,木质门框与暖黄灯光交织出温馨氛围,墙面上手绘的食材插画画透着文艺气息,开放式厨房的设计让食客能看见厨师处理食材的全过程,第一印象便给人以干净与安心。",
|
||||
images: ["https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png"],
|
||||
time: "2025-03-01 11:24:20",
|
||||
},
|
||||
{
|
||||
avatar: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
username: "TP",
|
||||
product: "库尔勒香梨 10kg/箱",
|
||||
content:
|
||||
"踏入这家位于街角的餐厅,木质门框与暖黄灯光交织出温馨氛围,墙面上手绘的食材插_draw着文艺气息,开放式厨房的设计让食客能看见厨师处理食材的全过程,第一印象便给人以干净与安心。",
|
||||
images: [
|
||||
"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
|
||||
],
|
||||
time: "2025-03-01 11:24:20",
|
||||
},
|
||||
],
|
||||
show: false,
|
||||
showSize: false,
|
||||
|
||||
changeImg: "",
|
||||
changeName: "",
|
||||
changePrice: "",
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
@ -340,6 +547,10 @@ export default {
|
||||
this.info = res;
|
||||
this.currentGG = res.commodity_goods_info_list[0];
|
||||
this.currentGGIndex = 0;
|
||||
|
||||
this.changeImg = this.currentGG.commodity_pic[0]
|
||||
this.changeName = this.currentGG.goods_alias
|
||||
this.changePrice = this.currentGG.sales_price
|
||||
});
|
||||
},
|
||||
|
||||
@ -358,6 +569,7 @@ export default {
|
||||
|
||||
// 切换规格
|
||||
changeGG(item, index) {
|
||||
console.log("🚀 ~ changeGG ~ item:", item);
|
||||
this.currentGG = item;
|
||||
this.currentGGIndex = index;
|
||||
if (this.currentGG.cart_count) {
|
||||
@ -365,6 +577,9 @@ export default {
|
||||
} else {
|
||||
this.currentGG.cart_count = { count: 0 };
|
||||
}
|
||||
this.changeImg = item.commodity_pic[0]
|
||||
this.changeName = item.goods_alias
|
||||
this.changePrice = item.sales_price
|
||||
},
|
||||
car() {
|
||||
NavgateTo("../shopCar/index");
|
||||
@ -430,7 +645,8 @@ export default {
|
||||
user_id: uni.getStorageSync("userId"),
|
||||
goods_id_and_count: [
|
||||
{
|
||||
goods_id: this.info.commodity_goods_info_list[this.currentGGIndex].id,
|
||||
goods_id:
|
||||
this.info.commodity_goods_info_list[this.currentGGIndex].id,
|
||||
count: newValue.value,
|
||||
},
|
||||
],
|
||||
@ -444,6 +660,22 @@ export default {
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
showPopup() {
|
||||
this.show = true;
|
||||
},
|
||||
|
||||
showSizePopup() {
|
||||
this.showSize = true;
|
||||
},
|
||||
|
||||
close() {
|
||||
this.show = false;
|
||||
},
|
||||
|
||||
closeSize() {
|
||||
this.showSize = false;
|
||||
},
|
||||
},
|
||||
onLoad(options) {
|
||||
const itemObj = JSON.parse(decodeURIComponent(options.item));
|
||||
@ -472,6 +704,8 @@ export default {
|
||||
|
||||
request(apiArr.updateCar, "POST", {
|
||||
goods_id_and_count,
|
||||
}).then((res) => {
|
||||
console.log("Cart updated on hide");
|
||||
});
|
||||
return;
|
||||
},
|
||||
|
||||
@ -158,6 +158,7 @@ page {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
overflow-y: auto;
|
||||
margin-bottom: 150rpx;
|
||||
}
|
||||
|
||||
.CateInfo_tit {
|
||||
@ -197,7 +198,28 @@ page {
|
||||
height: 140rpx;
|
||||
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||||
overflow: hidden;
|
||||
margin-right: 3rpx;
|
||||
margin-right: 15rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.tag {
|
||||
background-color: #ff7d00;
|
||||
color: white;
|
||||
font-size: 22rpx;
|
||||
padding: 5rpx 10rpx;
|
||||
border-radius: 20rpx 0 20rpx 20rpx;
|
||||
}
|
||||
|
||||
.tag-img {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.tag-text {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
@ -485,8 +507,12 @@ page {
|
||||
.GGItem_Image {
|
||||
width: 120rpx;
|
||||
height: 100rpx;
|
||||
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||||
margin-right: 20rpx;
|
||||
margin: 0 20rpx 20rpx 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.GGItem_Image image{
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.GGItem_Con_Tit {
|
||||
@ -528,16 +554,16 @@ page {
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.shadowBox1{
|
||||
.shadowBox1 {
|
||||
height: 250rpx;
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.shop_car{
|
||||
.shop_car {
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
position: fixed;
|
||||
@ -545,7 +571,8 @@ page {
|
||||
bottom: 180rpx;
|
||||
z-index: 10;
|
||||
}
|
||||
.shop_car image{
|
||||
|
||||
.shop_car image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
@ -139,7 +139,7 @@
|
||||
<!-- 右下阴影 -->
|
||||
<div class="boxshadow2" v-if="cateListShow"></div>
|
||||
|
||||
<div class="CateInfo" v-for="(item, index) in tagList" :key="item.id">
|
||||
<div class="CateInfo" v-for="item in tagList" :key="item.id">
|
||||
<div class="CateInfo_tit">
|
||||
{{ item.tag_name }}
|
||||
</div>
|
||||
@ -150,6 +150,14 @@
|
||||
>
|
||||
<div class="CateInfo_Item_Box">
|
||||
<div class="CateInfo_Item_left" @click="goods(items)">
|
||||
<view
|
||||
class="tag tag-img"
|
||||
v-if="
|
||||
!items.commodity_goods_info_list[1] &&
|
||||
items.commodity_goods_info_list[0].is_same_day
|
||||
"
|
||||
>当日达</view
|
||||
>
|
||||
<image
|
||||
:src="picUrl + items.commodity_pic"
|
||||
mode="aspectFill"
|
||||
@ -157,18 +165,22 @@
|
||||
</div>
|
||||
<div class="CateInfo_Item_right" :class="GGshow ? 'noneBor' : ''">
|
||||
<div class="CateInfo_Item_right_Tit" @click="goods(items)">
|
||||
<view
|
||||
class="tag tag-text"
|
||||
v-if="
|
||||
!items.commodity_goods_info_list[1] &&
|
||||
items.commodity_goods_info_list[0].is_same_day
|
||||
"
|
||||
>当日达</view
|
||||
>
|
||||
{{ items.commodity_name }}
|
||||
</div>
|
||||
<div
|
||||
class="CateInfo_Item_right_subtit"
|
||||
@click="goods(items)"
|
||||
>
|
||||
<div class="CateInfo_Item_right_subtit" @click="goods(items)">
|
||||
{{ items.commodity_intro }}
|
||||
</div>
|
||||
<div class="CateInfo_Item_Money">
|
||||
<div class="CateInfo_Item_Money_left">
|
||||
<span>¥</span
|
||||
>{{ items.commodity_goods_info_list[0].sales_price }}
|
||||
{{ getPriceRange(items.commodity_goods_info_list) }}
|
||||
</div>
|
||||
<div
|
||||
class="CateInfo_Item_Money_right"
|
||||
@ -231,16 +243,23 @@
|
||||
<div
|
||||
class="GGItem"
|
||||
v-for="ite in items.commodity_goods_info_list"
|
||||
:key="ite.id"
|
||||
@click="goods(items)"
|
||||
>
|
||||
<div class="GGItem_Image">
|
||||
<view class="tag tag-img" v-if="ite.is_same_day">当日达</view>
|
||||
<image
|
||||
:src="picUrl + ite.commodity_pic"
|
||||
mode="aspectFill"
|
||||
></image>
|
||||
</div>
|
||||
<div class="GGItem_Con">
|
||||
<div class="GGItem_Con_Tit">{{ ite.goods_name }}</div>
|
||||
<div class="GGItem_Con_Tit">
|
||||
<view class="tag tag-text" v-if="ite.is_same_day"
|
||||
>当日达</view
|
||||
>
|
||||
{{ ite.goods_name }}
|
||||
</div>
|
||||
<div class="GGItem_Con_Msg">
|
||||
<div class="GGItem_Con_Msg_left">
|
||||
<span>¥</span>{{ ite.sales_price }}
|
||||
@ -286,7 +305,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<nav-footer :current="2" />
|
||||
<!-- <nav-footer :current="3" /> -->
|
||||
|
||||
<div class="shop_car" @click="shopCar">
|
||||
<u-badge
|
||||
@ -376,6 +395,8 @@ export default {
|
||||
carNum: "",
|
||||
|
||||
goodsDetail: [],
|
||||
|
||||
showTag: false, //当日达标签
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
@ -459,7 +480,6 @@ export default {
|
||||
});
|
||||
});
|
||||
this.tagList = res.commodity_list;
|
||||
console.log("🚀 ~ getGoodsList ~ this.tagList:", this.tagList)
|
||||
});
|
||||
},
|
||||
|
||||
@ -467,7 +487,9 @@ export default {
|
||||
request(apiArr.getCar, "POST").then((res) => {
|
||||
console.log(res);
|
||||
this.carNum = res.total;
|
||||
this.goodsDetail = res.commodity_cart_list;
|
||||
// 合并当日达和普通商品数据
|
||||
this.goodsDetail = [].concat(res.same_day_cart_list, res.normal_cart_list)
|
||||
.flatMap(supplier => supplier.commodity_cart_and_goods_model);
|
||||
});
|
||||
},
|
||||
|
||||
@ -504,6 +526,13 @@ export default {
|
||||
});
|
||||
});
|
||||
},
|
||||
getPriceRange(goodsList) {
|
||||
if (!goodsList || goodsList.length === 0) return '¥0';
|
||||
const prices = goodsList.map(item => Number(item.sales_price));
|
||||
const minPrice = Math.min(...prices);
|
||||
const maxPrice = Math.max(...prices);
|
||||
return minPrice === maxPrice ? `¥${minPrice}` : `¥${minPrice} ~ ¥${maxPrice}`;
|
||||
},
|
||||
},
|
||||
onLoad(options) {
|
||||
const meun = menuButtonInfo();
|
||||
|
||||
@ -29,11 +29,11 @@
|
||||
<div class="goodsItem_left" @click="changeChecked(item, index)">
|
||||
<image
|
||||
v-if="!item.checked"
|
||||
src="http://192.168.0.172:5500/7.15/shop_checked1.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_check1.png"
|
||||
></image>
|
||||
<image
|
||||
v-if="item.checked"
|
||||
src="http://192.168.0.172:5500/7.15/shop_checked2.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_check2.png"
|
||||
></image>
|
||||
</div>
|
||||
<div class="goodsItem_right">
|
||||
|
||||
@ -73,7 +73,7 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<nav-footer />
|
||||
<nav-footer :current="4"/>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@ -122,6 +122,8 @@ export default {
|
||||
uni.removeStorageSync('is_shop');
|
||||
uni.removeStorageSync('shopId');
|
||||
uni.removeStorageSync('order_dispatch_permission');
|
||||
uni.removeStorageSync('work_order_permission');
|
||||
|
||||
const button = uni.createSelectorQuery().select('#hiddenLoginBtn');
|
||||
button.boundingClientRect().exec();
|
||||
|
||||
@ -230,6 +232,7 @@ export default {
|
||||
if (item) {
|
||||
const { community_worker } = res;
|
||||
uni.setStorageSync('order_dispatch_permission', community_worker && community_worker[0].order_dispatch_permission == 1 || false);
|
||||
uni.setStorageSync('work_order_permission', community_worker && community_worker[0].work_order_permission == 1 || false);
|
||||
uni.setStorageSync('phone', res.account);
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
|
||||
@ -141,9 +141,17 @@ page {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.btn_view > .btn {
|
||||
.btn_view_btn {
|
||||
margin: 40rpx 20rpx;
|
||||
width: 300rpx;
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
text-align: center;
|
||||
background: linear-gradient( 91deg, #FF7658 0%, #FF370B 100%);
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
font-size: 36rpx;
|
||||
color: #FFFFFF;
|
||||
font-weight: 600;
|
||||
}
|
||||
.btn {
|
||||
margin: 40rpx auto 60rpx;
|
||||
|
||||
@ -1,230 +1,204 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<div
|
||||
class="searchBox"
|
||||
:style="{ height: localHeight + 'px', paddingTop: top + 'px' }"
|
||||
>
|
||||
<div class="searchBox_add">
|
||||
<div class="searchBox_left">
|
||||
<u-icon
|
||||
bold
|
||||
color="#000"
|
||||
size="40"
|
||||
name="arrow-left"
|
||||
@click="headerBackClick"
|
||||
></u-icon>
|
||||
</div>
|
||||
<div class="searchBox_mid">工单详情</div>
|
||||
<div class="searchBox_right"></div>
|
||||
</div>
|
||||
</div>
|
||||
<view class="container">
|
||||
<view class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
|
||||
<view class="searchBox_add">
|
||||
<view class="searchBox_left">
|
||||
<u-icon bold color="#000" size="40" name="arrow-left" @click="headerBackClick"></u-icon>
|
||||
</view>
|
||||
<view class="searchBox_mid">工单详情</view>
|
||||
<view class="searchBox_right"></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<div class="repairMsg">
|
||||
<div :class="['orderItemTit', statusType[info.status].style]">
|
||||
<div class="orderItemTit_left">工单编号:{{ info.order_code }}</div>
|
||||
<div class="orderItemTit_right">{{ statusType[info.status].desc }}</div>
|
||||
</div>
|
||||
<view class="repairMsg">
|
||||
<view :class="['orderItemTit', statusType[info.status].style]">
|
||||
<view class="orderItemTit_left">工单编号:{{ info.order_code }}</view>
|
||||
<view class="orderItemTit_right">{{ statusType[info.status].desc }}</view>
|
||||
</view>
|
||||
|
||||
<div class="row">
|
||||
<div class="row_label">小区房源名称</div>
|
||||
<div class="row_con">{{ info.room.name }}</div>
|
||||
</div>
|
||||
<view class="row">
|
||||
<view class="row_label">小区房源名称</view>
|
||||
<view class="row_con">{{ info.room.name }}</view>
|
||||
</view>
|
||||
|
||||
<div class="row">
|
||||
<div class="row_label">报修类型</div>
|
||||
<div class="row_con">{{ info.ac.category_name }}</div>
|
||||
</div>
|
||||
<view class="row">
|
||||
<view class="row_label">报修类型</view>
|
||||
<view class="row_con">{{ info.ac.category_name }}</view>
|
||||
</view>
|
||||
|
||||
<div class="row">
|
||||
<div class="row_label">问题描述</div>
|
||||
<div class="row_con">{{ info.problem_description }}</div>
|
||||
</div>
|
||||
<view class="row">
|
||||
<view class="row_label">问题描述</view>
|
||||
<view class="row_con">{{ info.problem_description }}</view>
|
||||
</view>
|
||||
|
||||
<div class="row">
|
||||
<div class="row_label">联系人</div>
|
||||
<div class="row_con">{{ info.contact_name }}</div>
|
||||
</div>
|
||||
<view class="row">
|
||||
<view class="row_label">联系人</view>
|
||||
<view class="row_con">{{ info.contact_name }}</view>
|
||||
</view>
|
||||
|
||||
<div class="row">
|
||||
<div class="row_label">联系电话</div>
|
||||
<div class="row_con">{{ info.contact_phone }}</div>
|
||||
</div>
|
||||
<view class="row">
|
||||
<view class="row_label">联系电话</view>
|
||||
<view class="row_con">{{ info.contact_phone }}</view>
|
||||
</view>
|
||||
|
||||
<div class="row">
|
||||
<div class="row_label">上门时间</div>
|
||||
<div class="row_con">{{ info.service_time }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<view class="row">
|
||||
<view class="row_label">上门时间</view>
|
||||
<view class="row_con">{{ info.service_time }}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<div class="repairMsg">
|
||||
<div class="row">
|
||||
<div class="row_label df">图片</div>
|
||||
<div class="row_con">
|
||||
<view class="repairMsg">
|
||||
<view class="row">
|
||||
<view class="row_label df">图片</view>
|
||||
<view class="row_con">
|
||||
<view v-if="info.imagesList && info.imagesList.length == 0">暂无图片</view>
|
||||
<image
|
||||
v-else
|
||||
v-for="(item, index) in info.imagesList"
|
||||
:key="index"
|
||||
:src="item"
|
||||
mode=""
|
||||
@click="handlerPreviewImageClick(item)"
|
||||
>
|
||||
<image v-else v-for="(item, index) in info.imagesList" :key="index" :src="item" mode=""
|
||||
@click="handlerPreviewImageClick(item)">
|
||||
</image>
|
||||
</div>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<div class="row">
|
||||
<div class="row_label df">视频</div>
|
||||
<div class="row_con">
|
||||
<view class="row">
|
||||
<view class="row_label df">视频</view>
|
||||
<view class="row_con">
|
||||
<view v-if="info.videosList && info.videosList.length == 0">暂无视频</view>
|
||||
<div v-else v-for="(item, index) in info.videosList" :key="index" class="videoBOX">
|
||||
<video id="myVideo" :src="item" playsinline webkit-playsinline></video>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<view v-else v-for="(item, index) in info.videosList" :key="index" class="videoBOX">
|
||||
<video id="myVideo" :src="item" playsinline webkit-playsinline></video>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<div class="row" v-if="info.assign_time">
|
||||
<div class="row_label">指派时间</div>
|
||||
<div class="row_con noneBor">{{ info.assign_time }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<view class="row" v-if="info.assign_time">
|
||||
<view class="row_label">指派时间</view>
|
||||
<view class="row_con noneBor">{{ info.assign_time }}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 维修状态非带指派 -->
|
||||
<div class="repairMsg" v-if="info.status !== 1">
|
||||
<div class="row">
|
||||
<div class="row_label">维修师傅</div>
|
||||
<div class="row_con">{{ info.repairman_worker.name }}</div>
|
||||
</div>
|
||||
<view class="repairMsg" v-if="info.status !== 1">
|
||||
<view class="row">
|
||||
<view class="row_label">维修师傅</view>
|
||||
<view class="row_con">{{ info.repairman_worker.name }}</view>
|
||||
</view>
|
||||
|
||||
<div class="row">
|
||||
<div class="row_label">师傅手机号</div>
|
||||
<div class="row_con">{{ info.repairman_worker.mobile }}</div>
|
||||
</div>
|
||||
<view class="row">
|
||||
<view class="row_label">师傅手机号</view>
|
||||
<view class="row_con">{{ info.repairman_worker.mobile }}</view>
|
||||
</view>
|
||||
|
||||
<div class="row">
|
||||
<div class="row_label">师傅工号</div>
|
||||
<div class="row_con noneBor">{{ info.repairman_worker.emp_no }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<view class="row">
|
||||
<view class="row_label">师傅工号</view>
|
||||
<view class="row_con noneBor">{{ info.repairman_worker.emp_no }}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 工单状态非带指派或者进行中 -->
|
||||
<div class="repairMsg" v-if="info.status !== 1 && info.status !== 2">
|
||||
<div class="row">
|
||||
<div class="row_label df">维修图片</div>
|
||||
<div class="row_con">
|
||||
<view class="repairMsg" v-if="info.status !== 1 && info.status !== 2">
|
||||
<view class="row">
|
||||
<view class="row_label df">维修图片</view>
|
||||
<view class="row_con">
|
||||
<view v-if="info.repairImagesList && info.repairImagesList.length == 0">暂无图片</view>
|
||||
<image
|
||||
v-for="(item, index) in info.repairImagesList"
|
||||
:key="index"
|
||||
:src="item"
|
||||
mode=""
|
||||
@click="headerRepairImagesClick(item)"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<image v-for="(item, index) in info.repairImagesList" :key="index" :src="item" mode=""
|
||||
@click="headerRepairImagesClick(item)" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<div class="row">
|
||||
<div class="row_label df">维修视频</div>
|
||||
<div class="row_con">
|
||||
<view v-if="info.repairVideosList && info.repairVideosList.length == 0">暂无视频</view>
|
||||
<div v-else v-for="(item, index) in info.repairVideosList" :key="index" class="videoBOX">
|
||||
<video id="myVideo" :src="item" playsinline webkit-playsinline></video>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<view class="row">
|
||||
<view class="row_label df">维修视频</view>
|
||||
<view class="row_con">
|
||||
<view v-if="info.repairVideosList && info.repairVideosList.length == 0">暂无视频</view>
|
||||
<view v-else v-for="(item, index) in info.repairVideosList" :key="index" class="videoBOX">
|
||||
<video id="myVideo" :src="item" playsinline webkit-playsinline></video>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<div class="row">
|
||||
<div class="row_label">维修描述</div>
|
||||
<div class="row_con noneBor">{{ info.repair_description || '暂无描述' }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="repairMsg" v-if="type === 'edit'">
|
||||
<div class="repairMedia">
|
||||
<div class="edit_row df">
|
||||
<div class="row_label">维修图片</div>
|
||||
<div class="row_con2">
|
||||
<view class="row">
|
||||
<view class="row_label">维修描述</view>
|
||||
<view class="row_con noneBor">{{ info.repair_description || '暂无描述' }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="repairMsg" v-if="type === 'edit'">
|
||||
<view class="repairMedia">
|
||||
<view class="edit_row df">
|
||||
<view class="row_label">维修图片</view>
|
||||
<view class="row_con2">
|
||||
<u-upload :fileList="imgList" name="imgList" @afterRead="afterReadImg" @delete="deletePic" multiple
|
||||
:maxCount="10">
|
||||
<div class="imgCon">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_imageImg.png" mode="widthFix"></image>
|
||||
<view class="imgCon">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_imageImg.png"
|
||||
mode="widthFix"></image>
|
||||
上传图片
|
||||
</div>
|
||||
</view>
|
||||
</u-upload>
|
||||
</div>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<div class="edit_row df">
|
||||
<div class="row_label">上传视频</div>
|
||||
<div class="row_con2">
|
||||
<u-upload v-if="!videoList.url" :fileList="videoList" @afterRead="afterReadVideo" @delete="deleteVideo" name="videoList"
|
||||
:maxCount="1" accept="video">
|
||||
<div class="imgCon">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_videoImg.png" mode="widthFix"></image>
|
||||
<view class="edit_row df">
|
||||
<view class="row_label">上传视频</view>
|
||||
<view class="row_con2">
|
||||
<u-upload v-if="!videoList.url" :fileList="videoList" @afterRead="afterReadVideo" @delete="deleteVideo"
|
||||
name="videoList" :maxCount="1" accept="video">
|
||||
<view class="imgCon">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_videoImg.png"
|
||||
mode="widthFix"></image>
|
||||
上传视频
|
||||
</div>
|
||||
</view>
|
||||
</u-upload>
|
||||
|
||||
<div v-if="videoList.url" class="videoBOX">
|
||||
<view v-if="videoList.url" class="videoBOX">
|
||||
<video id="myVideo" :src="videoList.url" playsinline webkit-playsinline></video>
|
||||
<div class="mask" @click="playFullScreenVideo">
|
||||
<!-- <div class="mask_con">
|
||||
<view class="mask" @click="playFullScreenVideo">
|
||||
<!-- <view class="mask_con">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_play.png" mode="widthFix"></image>
|
||||
</div> -->
|
||||
<div class="mask_cancel" @click="cancels">删除</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</view> -->
|
||||
<view class="mask_cancel" @click="cancels">删除</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<div class="edit_row">
|
||||
<div class="row_label">维修描述</div>
|
||||
<textarea placeholder="请输入维修描述" :value="repairRemarks" data-name="repairRemarks" @input="handlerInputClick" auto-height />
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="white_container"
|
||||
v-if="info.status == 2 && type === 'edit'"
|
||||
@click="headerChangeStateClick"
|
||||
>
|
||||
<div style="display: flex; justify-content: space-between">
|
||||
<div style="display: flex">
|
||||
<div class="white_label">工单状态</div>
|
||||
<div class="whit_desc">
|
||||
<view class="edit_row">
|
||||
<view class="row_label">维修描述</view>
|
||||
<textarea placeholder="请输入维修描述" :value="repairRemarks" data-name="repairRemarks" @input="handlerInputClick"
|
||||
auto-height />
|
||||
</view>
|
||||
</view>
|
||||
<view class="white_container" v-if="info.status == 2 && type === 'edit'" @click="headerChangeStateClick">
|
||||
<view style="display: flex; justify-content: space-between">
|
||||
<view style="display: flex">
|
||||
<view class="white_label">工单状态</view>
|
||||
<view class="whit_desc">
|
||||
{{ orderState.desc }}
|
||||
</div>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
<u-icon name="arrow-up" v-if="!orderSelect" />
|
||||
<u-icon name="arrow-down" v-if="orderSelect" />
|
||||
</div>
|
||||
</view>
|
||||
|
||||
<view class="statePupop" v-if="orderSelect">
|
||||
<view
|
||||
class="statePopop_label"
|
||||
v-for="(item, index) in orderStateList"
|
||||
:key="index"
|
||||
@click.stop="headerSelectClick(item)"
|
||||
>{{ item.desc }}</view>
|
||||
<view class="statePopop_label" v-for="(item, index) in orderStateList" :key="index"
|
||||
@click.stop="headerSelectClick(item)">{{ item.desc }}</view>
|
||||
</view>
|
||||
</div>
|
||||
</view>
|
||||
|
||||
<div class="btn_view" v-if="info.status == 1 && order_dispatch_permission">
|
||||
<view class="btn" @click="headerTakeClick">接单</view>
|
||||
<view class="btn" @click="headerSelectMasterClick">派单</view>
|
||||
</div>
|
||||
<view class="btn_view">
|
||||
<view v-if="info.status == 1 && order_dispatch_permission">
|
||||
<view class="btn_view_btn" @click="headerSelectMasterClick">派单</view>
|
||||
</view>
|
||||
<view v-if="info.status == 1 && work_order_permission && allow_grab_order">
|
||||
<view class="btn_view_btn" @click="headerTakeClick">接单</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 待派单状态 无派单权限按钮 -->
|
||||
<div class="btn" v-else-if="info.status == 1" @click="headerTakeClick">接单</div>
|
||||
<!-- <view class="btn" v-else-if="info.status == 1" @click="headerTakeClick">接单</view> -->
|
||||
<!-- 进行中状态编辑维修信息 -->
|
||||
<div class="btn" v-if="info.status == 2" @click="headerEditClick">
|
||||
<view class="btn" v-if="info.status == 2" @click="headerEditClick">
|
||||
{{ type === "edit" ? "确定" : "编辑" }}
|
||||
</div>
|
||||
</view>
|
||||
|
||||
<u-popup
|
||||
:show="show"
|
||||
@close="close"
|
||||
round="50rpx"
|
||||
style="height: 50%; overflow: hidden"
|
||||
>
|
||||
<u-popup :show="show" @close="close" round="50rpx" style="height: 50%; overflow: hidden">
|
||||
<view class="master_popup">
|
||||
<view class="master_popup_title">
|
||||
<view></view>
|
||||
@ -238,20 +212,21 @@
|
||||
<view class="master_popup_tabel_left">
|
||||
<view class="master_popup_label">
|
||||
<view class="label">师傅名称</view>
|
||||
<view>{{item.name}}</view>
|
||||
<view>{{ item.name }}</view>
|
||||
</view>
|
||||
<view class="master_popup_label">
|
||||
<view class="label">师傅手机号</view>
|
||||
<view>{{ item.mobile }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<radio :value="item.worker_id" @click="headerRadioClick" :data-name="item.worker_id" :checked="checked === item.worker_id" />
|
||||
<radio :value="item.worker_id" @click="headerRadioClick" :data-name="item.worker_id"
|
||||
:checked="checked === item.worker_id" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
</div>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@ -312,10 +287,13 @@ export default {
|
||||
},
|
||||
show: false,
|
||||
communityMasterList: [],
|
||||
order_dispatch_permission: false,
|
||||
order_dispatch_permission: false,
|
||||
work_order_permission: false,
|
||||
allow_grab_order: false,
|
||||
|
||||
repairRemarks: '', // 维修备注信息
|
||||
imgList: [],
|
||||
videoList: {},
|
||||
videoList: {},
|
||||
|
||||
};
|
||||
},
|
||||
@ -346,51 +324,51 @@ export default {
|
||||
const res = await request(apiArr.workMasterLick, "POST", {
|
||||
community_id: this.info.community_id,
|
||||
});
|
||||
|
||||
|
||||
this.communityMasterList = res.rows;
|
||||
this.show = true;
|
||||
},
|
||||
|
||||
// 上传图片
|
||||
async afterReadImg(e){
|
||||
const { file} = e;
|
||||
console.log(e);
|
||||
async afterReadImg(e) {
|
||||
const { file } = e;
|
||||
console.log(e);
|
||||
file.forEach(item => {
|
||||
upload(item.url, res => {
|
||||
console.log(res.data.path);
|
||||
this.imgList.push({
|
||||
url: picUrl + res.data.path,
|
||||
picUrl: res.data.path,
|
||||
picUrl: res.data.path,
|
||||
})
|
||||
})
|
||||
})
|
||||
uni.hideLoading();
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
title: '上传成功',
|
||||
icon: 'success'
|
||||
});
|
||||
},
|
||||
deletePic(e) {
|
||||
this.imgList.splice(e.index, 1);
|
||||
},
|
||||
afterReadVideo(e){
|
||||
uploadVideo(e.file.url, res => {
|
||||
this.videoList = {
|
||||
url: picUrl + res.data.url,
|
||||
videos: res.data.url
|
||||
}
|
||||
})
|
||||
},
|
||||
deleteVideo() {
|
||||
this.videoList = {};
|
||||
},
|
||||
title: '上传成功',
|
||||
icon: 'success'
|
||||
});
|
||||
},
|
||||
deletePic(e) {
|
||||
this.imgList.splice(e.index, 1);
|
||||
},
|
||||
afterReadVideo(e) {
|
||||
uploadVideo(e.file.url, res => {
|
||||
this.videoList = {
|
||||
url: picUrl + res.data.url,
|
||||
videos: res.data.url
|
||||
}
|
||||
})
|
||||
},
|
||||
deleteVideo() {
|
||||
this.videoList = {};
|
||||
},
|
||||
playFullScreenVideo() {
|
||||
this.videoContext = this.videoContext || wx.createVideoContext('myVideo')
|
||||
this.videoContext.requestFullScreen() // 请求全屏
|
||||
},
|
||||
cancels(e) {
|
||||
this.videoList = {};
|
||||
},
|
||||
this.videoContext = this.videoContext || wx.createVideoContext('myVideo')
|
||||
this.videoContext.requestFullScreen() // 请求全屏
|
||||
},
|
||||
cancels(e) {
|
||||
this.videoList = {};
|
||||
},
|
||||
|
||||
// 进行中订单 按钮触发方法
|
||||
async headerEditClick() {
|
||||
@ -411,8 +389,8 @@ export default {
|
||||
});
|
||||
setTimeout(() => {
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
})
|
||||
delta: 1
|
||||
})
|
||||
}, 2000)
|
||||
|
||||
} else {
|
||||
@ -421,9 +399,9 @@ export default {
|
||||
},
|
||||
// input 输入公共方法
|
||||
handlerInputClick(e) {
|
||||
const { name} = e.currentTarget.dataset;
|
||||
this[name] = e.detail.value
|
||||
},
|
||||
const { name } = e.currentTarget.dataset;
|
||||
this[name] = e.detail.value
|
||||
},
|
||||
|
||||
// 修改工单状态
|
||||
headerChangeStateClick() {
|
||||
@ -436,51 +414,51 @@ export default {
|
||||
this.orderSelect = false;
|
||||
},
|
||||
// 派单确定按钮
|
||||
async headerConfirmClick() {
|
||||
if (!this.checked) {
|
||||
uni.showToast({
|
||||
title: '请选择维修师傅',
|
||||
icon: 'none'
|
||||
})
|
||||
return;
|
||||
}
|
||||
console.log('this.chec', this.checked);
|
||||
const res = await request(apiArr.workOrderCrudDispatch, 'POST', {
|
||||
worker_id: this.checked,
|
||||
id: this.info.id,
|
||||
})
|
||||
uni.showToast({
|
||||
title: '派单成功',
|
||||
icon: 'success',
|
||||
mask: true
|
||||
})
|
||||
setTimeout(() => {
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
})
|
||||
}, 2000)
|
||||
},
|
||||
async headerConfirmClick() {
|
||||
if (!this.checked) {
|
||||
uni.showToast({
|
||||
title: '请选择维修师傅',
|
||||
icon: 'none'
|
||||
})
|
||||
return;
|
||||
}
|
||||
console.log('this.chec', this.checked);
|
||||
const res = await request(apiArr.workOrderCrudDispatch, 'POST', {
|
||||
worker_id: this.checked,
|
||||
id: this.info.id,
|
||||
})
|
||||
uni.showToast({
|
||||
title: '派单成功',
|
||||
icon: 'success',
|
||||
mask: true
|
||||
})
|
||||
setTimeout(() => {
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
})
|
||||
}, 2000)
|
||||
},
|
||||
|
||||
// 打开图片预览
|
||||
handlerPreviewImageClick(item) {
|
||||
uni.previewImage({
|
||||
urls: this.info.imagesList,
|
||||
current: item,
|
||||
});
|
||||
},
|
||||
uni.previewImage({
|
||||
urls: this.info.imagesList,
|
||||
current: item,
|
||||
});
|
||||
},
|
||||
headerRepairImagesClick(item) {
|
||||
uni.previewImage({
|
||||
urls: this.info.repairImagesList,
|
||||
current: item,
|
||||
});
|
||||
uni.previewImage({
|
||||
urls: this.info.repairImagesList,
|
||||
current: item,
|
||||
});
|
||||
},
|
||||
|
||||
// 师傅选择事件
|
||||
headerRadioClick(e) {
|
||||
console.log('e', e);
|
||||
const { name } = e.currentTarget.dataset;
|
||||
this.checked = name;
|
||||
},
|
||||
headerRadioClick(e) {
|
||||
console.log('e', e);
|
||||
const { name } = e.currentTarget.dataset;
|
||||
this.checked = name;
|
||||
},
|
||||
close() {
|
||||
this.show = false;
|
||||
},
|
||||
@ -502,15 +480,20 @@ export default {
|
||||
|
||||
onLoad(options) {
|
||||
console.log("1111", options);
|
||||
const order_dispatch_permission = uni.getStorageSync('order_dispatch_permission');
|
||||
const order_dispatch_permission = uni.getStorageSync('order_dispatch_permission');
|
||||
this.order_dispatch_permission = order_dispatch_permission;
|
||||
const work_order_permission = uni.getStorageSync('work_order_permission');
|
||||
this.work_order_permission = work_order_permission;
|
||||
const allow_grab_order = uni.getStorageSync('allow_grab_order');
|
||||
this.allow_grab_order = allow_grab_order;
|
||||
|
||||
const meun = menuButtonInfo();
|
||||
this.top = meun.top;
|
||||
this.localHeight = meun.height;
|
||||
this.init(options.id);
|
||||
},
|
||||
|
||||
onShow() {},
|
||||
onShow() { },
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
115
packages/workOrderDashboard/guide/index.css
Normal file
115
packages/workOrderDashboard/guide/index.css
Normal file
@ -0,0 +1,115 @@
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
/* min-height: 100vh; */
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.searchBox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
/* position: absolute; */
|
||||
left: 0;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.searchBox_add {
|
||||
margin: 10rpx 20rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.top-image{
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
}
|
||||
|
||||
.emptyCommunity {
|
||||
font-size: 28rpx;
|
||||
color: #222222;
|
||||
width: auto;
|
||||
height: 44rpx;
|
||||
padding: 5rpx 15rpx;
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/* 背景图片区域 */
|
||||
.bg-image-container {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 500rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.bg-image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.search-box {
|
||||
position: absolute;
|
||||
bottom: 50rpx;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 80%;
|
||||
height: 70rpx;
|
||||
background-color: rgba(255, 255, 255, 0.9);
|
||||
border-radius: 10rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.search-placeholder {
|
||||
font-size: 26rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
/* 工单台区域 */
|
||||
.work-order-section {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
/* 创建3列等宽的网格 */
|
||||
}
|
||||
|
||||
.work-order-card {
|
||||
width: 246rpx;
|
||||
height: 200rpx;
|
||||
background-color: #ffffff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: 1rpx solid #f7f7f7;
|
||||
}
|
||||
|
||||
.work-order-icon {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.work-order-icon .iconfont {
|
||||
color: #ffffff;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.work-order-text {
|
||||
font-size: 26rpx;
|
||||
color: #333333;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* 适配不同屏幕尺寸 */
|
||||
@media screen and (min-width: 768px) {
|
||||
.container {
|
||||
max-width: 768px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
82
packages/workOrderDashboard/guide/index.vue
Normal file
82
packages/workOrderDashboard/guide/index.vue
Normal file
@ -0,0 +1,82 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
|
||||
<view class="searchBox_add" @click="addCommunity">
|
||||
<image class="top-image" src="http://localhost:8080/workOrder_community.png" mode="aspectFill"></image>
|
||||
<view class="emptyCommunity">
|
||||
{{ communityVal }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 背景图片区域 -->
|
||||
<view class="bg-image-container">
|
||||
<image class="bg-image" src="http://localhost:8080/test.png" mode="aspectFill"></image>
|
||||
<!-- <input class="search-box" placeholder='输入工单号进入工单' confirm-type='search' @input="searchInput"
|
||||
@confirm="searchInput" :value="selectKeyWord" /> -->
|
||||
<!-- <view class="search-box">
|
||||
<text class="search-placeholder">输入工单号进入工单</text>
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="work-order-section">
|
||||
<view v-for="(item, index) in 9" :key="index">
|
||||
<view class="work-order-card" v-if="index == 0 && showWorkOrderSection"
|
||||
@click="navigateToWorkOrderDashboard">
|
||||
<image class="work-order-icon" src="http://localhost:8080/workOrder.png" mode="aspectFill" />
|
||||
<text class="work-order-text">工单台</text>
|
||||
</view>
|
||||
<view class="work-order-card" v-else></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
request,
|
||||
picUrl,
|
||||
uniqueByField,
|
||||
menuButtonInfo,
|
||||
NavgateTo,
|
||||
} from "../../../utils";
|
||||
|
||||
import { apiArr } from "../../../api/community";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
communityVal: "添加我的房产",
|
||||
showWorkOrderSection: false
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
const workOrderPermission = uni.getStorageSync('work_order_permission');
|
||||
const orderDispatchPermission = uni.getStorageSync('order_dispatch_permission');
|
||||
this.showWorkOrderSection = !(workOrderPermission === false && orderDispatchPermission === false);
|
||||
},
|
||||
async onShow() {
|
||||
this.communityVal = uni.getStorageSync('changeCommData').name;
|
||||
const params = {
|
||||
community_id: uni.getStorageSync('changeCommData').id,
|
||||
}
|
||||
const res = await request(apiArr.communityInfo, "POST", params);
|
||||
uni.setStorageSync('allow_grab_order', res.allow_grab_order == 1 ? true : false);
|
||||
},
|
||||
methods: {
|
||||
addCommunity() {
|
||||
NavgateTo("/packages/workOrderDashboard/myCommunity/index");
|
||||
},
|
||||
|
||||
// 跳转到工单台
|
||||
navigateToWorkOrderDashboard() {
|
||||
uni.navigateTo({
|
||||
url: '/packages/workOrderDashboard/index/index'
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 引入外部CSS文件 */
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
@ -1,85 +1,85 @@
|
||||
<template>
|
||||
<view class="box">
|
||||
<div class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
|
||||
<div class="searchBox_add">
|
||||
<div class="searchBox_left">
|
||||
<view class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
|
||||
<view class="searchBox_add">
|
||||
<view class="searchBox_left">
|
||||
<u-icon bold color="#000" size="40" name="arrow-left" @click="headerBackClick"></u-icon>
|
||||
</div>
|
||||
<div class="searchBox_mid">工作台</div>
|
||||
<div class="searchBox_right"></div>
|
||||
</div>
|
||||
</div>
|
||||
</view>
|
||||
<view class="searchBox_mid">工单台</view>
|
||||
<view class="searchBox_right"></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<div class="tabList">
|
||||
<div
|
||||
<view class="tabList">
|
||||
<view
|
||||
:class="active == 1 ? 'tab active' : 'tab'"
|
||||
@click="headerTabsClick(1)"
|
||||
>
|
||||
待指派 <span>({{awaitingNumb}})</span>
|
||||
</div>
|
||||
<div
|
||||
</view>
|
||||
<view
|
||||
:class="active == 2 ? 'tab active' : 'tab'"
|
||||
@click="headerTabsClick(2)"
|
||||
>
|
||||
进行中 <span>({{ underwayNum }})</span>
|
||||
</div>
|
||||
<div
|
||||
</view>
|
||||
<view
|
||||
:class="active == 4 ? 'tab active' : 'tab'"
|
||||
@click="headerTabsClick(4)"
|
||||
>
|
||||
已作废 <span>({{ discardNum }})</span>
|
||||
</div>
|
||||
<div
|
||||
</view>
|
||||
<view
|
||||
:class="active == 3 ? 'tab active' : 'tab'"
|
||||
@click="headerTabsClick(3)"
|
||||
>
|
||||
已完成 <span>({{ doneNum }})</span>
|
||||
</div>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<div class="orderList" v-for="(item, index) in list" :key="index">
|
||||
<div class="orderItem" @click="handlerDetailClick(item.id)">
|
||||
<div :class="['orderItemTit', statusType[item.status].style]">
|
||||
<div class="orderItemTit_left">工单编号:{{ item.order_code }}</div>
|
||||
<div class="orderItemTit_right">{{ item.create_time }}</div>
|
||||
</div>
|
||||
<div class="orderItem_row">
|
||||
<div class="df">
|
||||
<div class="orderItem_row_label">小区房源名称</div>
|
||||
<div class="orderItem_row_con">{{ item.room.name }}</div>
|
||||
</div>
|
||||
<view class="orderList" v-for="(item, index) in list" :key="index">
|
||||
<view class="orderItem" @click="handlerDetailClick(item.id)">
|
||||
<view :class="['orderItemTit', statusType[item.status].style]">
|
||||
<view class="orderItemTit_left">工单编号:{{ item.order_code }}</view>
|
||||
<view class="orderItemTit_right">{{ item.create_time }}</view>
|
||||
</view>
|
||||
<view class="orderItem_row">
|
||||
<view class="df">
|
||||
<view class="orderItem_row_label">小区房源名称</view>
|
||||
<view class="orderItem_row_con">{{ item.room.name }}</view>
|
||||
</view>
|
||||
|
||||
<div :class="['orderItem_row_state', statusType[item.status].color]">
|
||||
<view :class="['orderItem_row_state', statusType[item.status].color]">
|
||||
{{ statusType[item.status].desc }}
|
||||
</div>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<div class="orderItem_row">
|
||||
<div class="orderItem_row_label">报修类型</div>
|
||||
<div class="orderItem_row_con">{{ item.ac.category_name }}</div>
|
||||
</div>
|
||||
<view class="orderItem_row">
|
||||
<view class="orderItem_row_label">报修类型</view>
|
||||
<view class="orderItem_row_con">{{ item.ac.category_name }}</view>
|
||||
</view>
|
||||
|
||||
<div class="orderItem_row">
|
||||
<div class="orderItem_row_label">问题描述</div>
|
||||
<div class="orderItem_row_con">{{ item.problem_description }}</div>
|
||||
</div>
|
||||
<view class="orderItem_row">
|
||||
<view class="orderItem_row_label">问题描述</view>
|
||||
<view class="orderItem_row_con">{{ item.problem_description }}</view>
|
||||
</view>
|
||||
|
||||
<div class="orderItem_row">
|
||||
<div class="orderItem_row_label">上门时间</div>
|
||||
<div class="orderItem_row_con">{{ item.service_time }}</div>
|
||||
</div>
|
||||
<view class="orderItem_row">
|
||||
<view class="orderItem_row_label">上门时间</view>
|
||||
<view class="orderItem_row_con">{{ item.service_time }}</view>
|
||||
</view>
|
||||
|
||||
<div class="orderItem_row">
|
||||
<div class="orderItem_row_label">联系人</div>
|
||||
<div class="orderItem_row_con">{{ item.contact_name }}</div>
|
||||
</div>
|
||||
<view class="orderItem_row">
|
||||
<view class="orderItem_row_label">联系人</view>
|
||||
<view class="orderItem_row_con">{{ item.contact_name }}</view>
|
||||
</view>
|
||||
|
||||
<div class="orderItem_row">
|
||||
<div class="orderItem_row_label">联系人手机号</div>
|
||||
<div class="orderItem_row_con">{{ item.contact_phone }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<view class="orderItem_row">
|
||||
<view class="orderItem_row_label">联系人手机号</view>
|
||||
<view class="orderItem_row_con">{{ item.contact_phone }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
98
packages/workOrderDashboard/myCommunity/index.css
Normal file
98
packages/workOrderDashboard/myCommunity/index.css
Normal file
@ -0,0 +1,98 @@
|
||||
page {
|
||||
background-color: #f6f7fb;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.container {
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.empty {
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-top: 180rpx;
|
||||
}
|
||||
|
||||
.empty image {
|
||||
width: 340rpx;
|
||||
height: 240rpx;
|
||||
}
|
||||
|
||||
.addBtn {
|
||||
width: 600rpx;
|
||||
height: 90rpx;
|
||||
background: linear-gradient(91deg, #FF7658 0%, #FF370B 100%);
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
font-size: 36rpx;
|
||||
color: #FFFFFF;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 100rpx;
|
||||
}
|
||||
|
||||
|
||||
.communityList {
|
||||
padding: 0 20rpx;
|
||||
background-color: #fff;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.communityItem {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1rpx solid #EBEBEB;
|
||||
padding: 30rpx 0;
|
||||
}
|
||||
.communityItem_left{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
.communityItem_left_img {
|
||||
width: 160rpx;
|
||||
height: 140rpx;
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
.communityItem_left_msg{
|
||||
flex: 1;
|
||||
}
|
||||
.communityItem_left_msg_tit {
|
||||
font-size: 30rpx;
|
||||
color: #222222;
|
||||
}
|
||||
|
||||
.communityItem_left_msg_tit span {
|
||||
color: #FF370B;
|
||||
}
|
||||
|
||||
.communityItem_left_msg_msg {
|
||||
font-size: 26rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.communityItem_right{
|
||||
width: 34rpx;
|
||||
height: 34rpx;
|
||||
margin-left: 80rpx;
|
||||
}
|
||||
|
||||
/* 最后一个 communityItem */
|
||||
.communityItem:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
100
packages/workOrderDashboard/myCommunity/index.vue
Normal file
100
packages/workOrderDashboard/myCommunity/index.vue
Normal file
@ -0,0 +1,100 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="empty" v-if="communityList.length == 0">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_newEmpty.png"
|
||||
alt="" />
|
||||
没有添加任何房产
|
||||
|
||||
</view>
|
||||
|
||||
<div class="communityList">
|
||||
<div class="communityItem" v-for="item in communityList" :key="item.community_id"
|
||||
@click="choseCommunity(item)">
|
||||
<div class="communityItem_left">
|
||||
<div class="communityItem_left_img">
|
||||
<image :src="item.pic" mode="aspectFill"></image>
|
||||
</div>
|
||||
<div class="communityItem_left_msg">
|
||||
<div class="communityItem_left_msg_tit">{{ item.name }}<span>( {{ item.room_owner_list.length }}
|
||||
)</span></div>
|
||||
<div class="communityItem_left_msg_msg">{{ item.addr }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="communityItem_right">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_check1.png"
|
||||
v-if="item.community_id != currentCommunity.id"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_check2.png"
|
||||
v-if="item.community_id == currentCommunity.id"></image>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- <div class="addBtn" @click="addCommunity">添加我的房产</div> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
request,
|
||||
NavgateTo,
|
||||
isPhone,
|
||||
picUrl
|
||||
} from '../../../utils';
|
||||
import {
|
||||
apiArr
|
||||
} from '../../../api/community';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
communityList: [],
|
||||
page_num: 1,
|
||||
page_size: 10,
|
||||
currentCommunity: {}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
addCommunity() {
|
||||
NavgateTo("/packages/community/addCommunity/index")
|
||||
},
|
||||
async getList() {
|
||||
await request(apiArr.commInfo, "POST", {
|
||||
user_id: uni.getStorageSync('userId'),
|
||||
longitude: uni.getStorageSync('location').lng,
|
||||
latitude: uni.getStorageSync('location').lat,
|
||||
page_num: this.page_num,
|
||||
page_size: this.page_size
|
||||
}).then(res => {
|
||||
res.rows.forEach(item => {
|
||||
item.pic = item.pic.startsWith('http') ? item.pic : picUrl + item.pic
|
||||
});
|
||||
this.communityList = res.rows.filter(item => item.front_end_display !== 1)
|
||||
})
|
||||
},
|
||||
// toUpview(item) {
|
||||
// uni.setStorageSync('changeCommData', { id: item.community_id, name: item.name });
|
||||
// NavgateTo("/packages/community/index/index")
|
||||
// },
|
||||
|
||||
choseCommunity(e) {
|
||||
this.currentCommunity = e
|
||||
uni.setStorageSync('changeCommData', { id: e.community_id, name: e.name });
|
||||
uni.setStorageSync('currentCommunityAddr',e.addr);
|
||||
uni.setStorageSync("isShowNav", e.room_owner_list[0].type)
|
||||
NavgateTo("1")
|
||||
},
|
||||
},
|
||||
|
||||
onLoad(options) {
|
||||
this.currentCommunity = uni.getStorageSync('changeCommData')
|
||||
console.log(this.currentCommunity, 'currentCommunity');
|
||||
this.getList();
|
||||
|
||||
},
|
||||
|
||||
onReachBottom() { },
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
31
pages.json
31
pages.json
@ -95,6 +95,20 @@
|
||||
"navigationBarTitleText": "",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "guide/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "",
|
||||
"navigationBarBackgroundColor": "#fff"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "myCommunity/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "选择小区",
|
||||
"navigationBarBackgroundColor": "#fff"
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
@ -477,7 +491,7 @@
|
||||
{
|
||||
"path": "index/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "本地生活",
|
||||
"navigationBarTitleText": "",
|
||||
"navigationBarBackgroundColor": "#fff"
|
||||
}
|
||||
},
|
||||
@ -714,7 +728,14 @@
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "noticeDetials/index",
|
||||
"path": "noticeManage/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "公告管理",
|
||||
"navigationBarBackgroundColor": "#fff"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "noticeDetails/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "公告详情",
|
||||
"navigationBarBackgroundColor": "#fff"
|
||||
@ -779,6 +800,12 @@
|
||||
"style": {
|
||||
"navigationBarTitleText": "选择自提点"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "evaluate/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "评价"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
@ -1,13 +1,46 @@
|
||||
.container {
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
|
||||
.hot-word-container {
|
||||
width: auto;
|
||||
height: 50rpx;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
/* flex: 1; */
|
||||
border-radius: 50rpx;
|
||||
/* margin: 0 20rpx; */
|
||||
}
|
||||
|
||||
.hot-word-scroll {
|
||||
transition: transform 0.5s ease;
|
||||
}
|
||||
|
||||
.hot-word-item {
|
||||
height: 50rpx;
|
||||
line-height: 50rpx;
|
||||
padding: 0 15rpx;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.hot-word-item:active {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.searchBox2 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.white_container {
|
||||
background: #FFFFFF;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
|
||||
page {
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
|
||||
.grid_Pic {
|
||||
width: 61.5rpx;
|
||||
height: 63.14rpx;
|
||||
@ -35,16 +68,79 @@ page {
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.search2 {
|
||||
padding: 20rpx 0;
|
||||
}
|
||||
|
||||
.function-nav {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
padding: 20rpx 0;
|
||||
margin: 20rpx -20rpx 0 -20rpx;
|
||||
background-color: #f7f6fb;
|
||||
}
|
||||
|
||||
.function-item {
|
||||
width: 200rpx;
|
||||
height: 180rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
border-radius: 20rpx;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.icon-box {
|
||||
width: 120rpx;
|
||||
height: 100rpx;
|
||||
border-radius: 10rpx;
|
||||
margin-top: 15rpx;
|
||||
margin-bottom: 10rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.icon-box image {
|
||||
width: 90rpx;
|
||||
height: 90rpx;
|
||||
}
|
||||
|
||||
.function-item text {
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.searchBox2 {
|
||||
width: 100%;
|
||||
height: 60rpx;
|
||||
background-color: #f6f7fb;
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
margin-right: 170rpx;
|
||||
display: flex;
|
||||
box-sizing: border-box;
|
||||
align-items: center;
|
||||
padding: 0 30rpx;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.searchBox2 image {
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
|
||||
.swiper {
|
||||
width: 710rpx;
|
||||
height: 300rpx;
|
||||
margin: 0 auto;
|
||||
margin-top: 30rpx;
|
||||
margin-top: 10rpx;
|
||||
position: relative;
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
.swiper swiper{
|
||||
|
||||
.swiper swiper {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
@ -108,6 +204,57 @@ page {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* 广告横幅 */
|
||||
.serverList1 {
|
||||
width: 100%;
|
||||
height: 450rpx;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background-color: #fff;
|
||||
margin-top: 20rpx;
|
||||
padding: 15rpx;
|
||||
}
|
||||
|
||||
.serverList1_left {
|
||||
display: block;
|
||||
width: 330rpx;
|
||||
height: 450rpx;
|
||||
margin-right: 17rpx;
|
||||
}
|
||||
|
||||
.serverList1_left image {
|
||||
height: 450rpx;
|
||||
width: 330rpx;
|
||||
object-fit: cover;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.serverList1_right {
|
||||
width: 400rpx;
|
||||
height: 450rpx;
|
||||
}
|
||||
|
||||
.serverItemRight1 {
|
||||
width: 365rpx;
|
||||
height: 220rpx;
|
||||
}
|
||||
|
||||
.serverItemRight1 image {
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.serverItemRight2 {
|
||||
width: 365rpx;
|
||||
height: 220rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.serverItemRight2 image {
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.Tit {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -117,21 +264,24 @@ page {
|
||||
font-size: 36rpx;
|
||||
color: #222222;
|
||||
}
|
||||
|
||||
.local {
|
||||
max-width: 414rpx;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.Tit_desc {
|
||||
padding: 0 12rpx;
|
||||
height: 36rpx;
|
||||
background: linear-gradient( 90deg, #FFA100 0%, #FF6A00 100%);
|
||||
background: linear-gradient(90deg, #FFA100 0%, #FF6A00 100%);
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
font-weight: normal;
|
||||
font-size: 26rpx;
|
||||
color: #FFFFFF;
|
||||
margin-left: 15rpx;
|
||||
}
|
||||
|
||||
.serverList {
|
||||
@ -154,6 +304,7 @@ page {
|
||||
position: relative;
|
||||
margin-bottom: 12rpx;
|
||||
}
|
||||
|
||||
.serverList_left {
|
||||
display: block;
|
||||
width: 260rpx;
|
||||
@ -161,7 +312,7 @@ page {
|
||||
margin-right: 17rpx;
|
||||
}
|
||||
|
||||
.serverList_left swiper{
|
||||
.serverList_left swiper {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
@ -171,6 +322,15 @@ page {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.serverList_right1 {
|
||||
width: 48%;
|
||||
}
|
||||
|
||||
.serverList_right2 {
|
||||
width: 48%;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
|
||||
.serverItem1 {
|
||||
background: linear-gradient(139deg, #FEF4F4 0%, #FEDCD2 100%);
|
||||
margin-right: 12rpx;
|
||||
@ -182,66 +342,68 @@ page {
|
||||
|
||||
.serverItem3 {
|
||||
background: #F1FFEC;
|
||||
margin-right: 12rpx;
|
||||
margin-right: 12rpx;
|
||||
}
|
||||
|
||||
.serverItem4 {
|
||||
background: #F0FDFF;
|
||||
}
|
||||
|
||||
.serverItem5 {
|
||||
background: #EFF7FF;
|
||||
margin-right: 12rpx;
|
||||
background: #EFF7FF;
|
||||
margin-right: 12rpx;
|
||||
}
|
||||
|
||||
.serverItem6 {
|
||||
background: linear-gradient( 180deg, #FFFFFF 0%, #FFEDF2 100%);
|
||||
background: linear-gradient(180deg, #FFFFFF 0%, #FFEDF2 100%);
|
||||
}
|
||||
|
||||
.serverItem1 image {
|
||||
position: absolute;
|
||||
right: 12rpx;
|
||||
top: 14rpx;
|
||||
width: 103rpx;
|
||||
height: 100rpx;
|
||||
right: 0rpx;
|
||||
bottom: 0rpx;
|
||||
width: 120rpx;
|
||||
height: 70rpx;
|
||||
}
|
||||
|
||||
.serverItem2 image {
|
||||
position: absolute;
|
||||
right: 6rpx;
|
||||
top: 8rpx;
|
||||
width: 108rpx;
|
||||
height: 108rpx;
|
||||
right: 0rpx;
|
||||
bottom: 0rpx;
|
||||
width: 120rpx;
|
||||
height: 70rpx;
|
||||
}
|
||||
|
||||
.serverItem3 image {
|
||||
width: 116rpx;
|
||||
height: 83rpx;
|
||||
position: absolute;
|
||||
right: 0rpx;
|
||||
top: 30rpx;
|
||||
bottom: 0rpx;
|
||||
width: 120rpx;
|
||||
height: 70rpx;
|
||||
}
|
||||
|
||||
.serverItem4 image {
|
||||
width: 130rpx;
|
||||
height: 86rpx;
|
||||
position: absolute;
|
||||
top: 30rpx;
|
||||
right: 11rpx;
|
||||
}
|
||||
.serverItem5 image {
|
||||
width: 162rpx;
|
||||
height: 93rpx;
|
||||
position: absolute;
|
||||
right: 0rpx;
|
||||
top: 23rpx;
|
||||
bottom: 0rpx;
|
||||
width: 120rpx;
|
||||
height: 70rpx;
|
||||
}
|
||||
|
||||
.serverItem5 image {
|
||||
position: absolute;
|
||||
right: 0rpx;
|
||||
bottom: 0rpx;
|
||||
width: 120rpx;
|
||||
height: 70rpx;
|
||||
}
|
||||
|
||||
.serverItem6 image {
|
||||
width: 72rpx;
|
||||
height: 72rpx;
|
||||
position: absolute;
|
||||
top: 30rpx;
|
||||
right: 20rpx;
|
||||
right: 0rpx;
|
||||
bottom: 0rpx;
|
||||
height: 70rpx;
|
||||
width: 120rpx;
|
||||
}
|
||||
|
||||
.merchant {
|
||||
@ -250,7 +412,7 @@ background: linear-gradient( 180deg, #FFFFFF 0%, #FFEDF2 100%);
|
||||
text-align: center;
|
||||
width: 710rpx;
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
background: linear-gradient( 91deg, #FF7658 0%, #FF370B 100%);
|
||||
background: linear-gradient(91deg, #FF7658 0%, #FF370B 100%);
|
||||
font-weight: normal;
|
||||
font-size: 36rpx;
|
||||
color: #FFFFFF;
|
||||
@ -260,16 +422,19 @@ background: linear-gradient( 180deg, #FFFFFF 0%, #FFEDF2 100%);
|
||||
.padding_bottom32 {
|
||||
padding-bottom: 32rpx;
|
||||
}
|
||||
|
||||
.main {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.list_pic {
|
||||
width: 345rpx;
|
||||
height: 345rpx;
|
||||
margin-right: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.list_pic:nth-child(2n) {
|
||||
margin-right: 0;
|
||||
}
|
||||
@ -280,4 +445,375 @@ background: linear-gradient( 180deg, #FFFFFF 0%, #FFEDF2 100%);
|
||||
color: #999999;
|
||||
margin: 65rpx auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 分类标签栏样式 */
|
||||
.category-tabs {
|
||||
background-color: #fff;
|
||||
border-radius: 10rpx;
|
||||
margin-top: 20rpx;
|
||||
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.tabs-container {
|
||||
display: flex;
|
||||
padding: 0 20rpx;
|
||||
position: relative;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.tabs-scroll {
|
||||
height: 50rpx;
|
||||
display: flex;
|
||||
overflow-x: auto;
|
||||
padding: 20rpx 0;
|
||||
scrollbar-width: none;
|
||||
-ms-overflow-style: none;
|
||||
}
|
||||
|
||||
.tabs-scroll::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.tab-item {
|
||||
padding: 0 20rpx;
|
||||
margin-right: 20rpx;
|
||||
font-size: 20rpx;
|
||||
color: #333;
|
||||
background-color: #ededed;
|
||||
height: 50rpx;
|
||||
line-height: 50rpx;
|
||||
white-space: nowrap;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.tab-item.activeTab {
|
||||
color: #ff6700;
|
||||
background-color: #fff3e0;
|
||||
}
|
||||
|
||||
.dropdown-btn {
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
|
||||
.dropdown-icon {
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
align-items: center;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.dropdown-icon.active {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
/* 下拉分类列表样式 */
|
||||
.category-dropdown {
|
||||
background-color: #fff;
|
||||
border-radius: 0 0 10rpx 10rpx;
|
||||
box-shadow: 0 5rpx 15rpx rgba(0, 0, 0, 0.1);
|
||||
padding: 20rpx;
|
||||
position: relative;
|
||||
z-index: 99;
|
||||
width: 95%;
|
||||
left: 0;
|
||||
/* top: 88rpx; */
|
||||
}
|
||||
|
||||
.dropdown-title {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
margin-bottom: 20rpx;
|
||||
padding-bottom: 15rpx;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
}
|
||||
|
||||
.review-btn {
|
||||
width: 80rpx;
|
||||
height: 50rpx;
|
||||
background-color: #ff6700;
|
||||
color: #fff;
|
||||
font-size: 26rpx;
|
||||
text-align: center;
|
||||
line-height: 50rpx;
|
||||
border-radius: 8rpx;
|
||||
margin-right: 10rpx;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.category-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 20rpx;
|
||||
}
|
||||
|
||||
.category-grid-item {
|
||||
padding: 20rpx;
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
color: #666;
|
||||
background-color: #f5f5f5;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
|
||||
.category-grid-item.activeTab {
|
||||
color: #ff6700;
|
||||
background-color: #fff3e0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* 店铺列表样式 */
|
||||
.store-list-container {
|
||||
background-color: #fff;
|
||||
border-radius: 10rpx;
|
||||
padding: 20rpx;
|
||||
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.overlay {
|
||||
position: absolute;
|
||||
top: 90rpx;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
z-index: 98;
|
||||
}
|
||||
|
||||
|
||||
.store-item {
|
||||
display: flex;
|
||||
padding: 20rpx 0;
|
||||
border-bottom: 1rpx solid #f0f0f0;
|
||||
}
|
||||
|
||||
.store-item:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.store-image {
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
border-radius: 10rpx;
|
||||
margin-right: 20rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.store-image image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.store-info {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.store-name {
|
||||
font-size: 32rpx;
|
||||
color: #333;
|
||||
font-weight: bold;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.store-rating {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 10rpx 0;
|
||||
}
|
||||
|
||||
.star-icon {
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
margin-right: 5rpx;
|
||||
}
|
||||
|
||||
.rating-text {
|
||||
font-size: 26rpx;
|
||||
color: #ffb400;
|
||||
margin-left: 5rpx;
|
||||
}
|
||||
|
||||
.store-tags {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.tag {
|
||||
background-color: #f5f5f5;
|
||||
color: #666;
|
||||
font-size: 24rpx;
|
||||
padding: 5rpx 15rpx;
|
||||
border-radius: 15rpx;
|
||||
margin-right: 10rpx;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.store-address {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.address-icon {
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
margin-right: 5rpx;
|
||||
}
|
||||
|
||||
.store-distance {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
margin-top: 5rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.distance-icon {
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
margin-right: 5rpx;
|
||||
}
|
||||
|
||||
.merchantList {
|
||||
padding: 0 20rpx;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.merchantList2 {}
|
||||
|
||||
.merchantItem {
|
||||
display: flex;
|
||||
padding-top: 30px;
|
||||
padding-bottom: 30rpx;
|
||||
border-bottom: 1rpx solid #EBEBEB;
|
||||
;
|
||||
}
|
||||
|
||||
.merchantItem_left {
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||||
overflow: hidden;
|
||||
margin-right: 24rpx;
|
||||
}
|
||||
|
||||
.merchantItem_left image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.merchantItem_right {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.merchantItem_right_tit {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.merchantItem_right_tit_left {
|
||||
font-size: 30rpx;
|
||||
color: #222222;
|
||||
}
|
||||
|
||||
.merchantItem_right_tit_right {
|
||||
font-size: 24rpx;
|
||||
color: #555555;
|
||||
}
|
||||
|
||||
.merchantItem_right_con {
|
||||
margin-top: 14rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.merchangtItem_tag {
|
||||
font-size: 22rpx;
|
||||
color: #555555;
|
||||
padding: 5rpx 12rpx;
|
||||
white-space: nowrap;
|
||||
background: rgba(255, 81, 42, 0.1);
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
display: inline-block;
|
||||
margin-top: 20rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.startList {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.startList image {
|
||||
width: 22rpx;
|
||||
height: 22rpx;
|
||||
margin-right: 3rpx;
|
||||
}
|
||||
|
||||
.merchantItem_right_con_right {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 26rpx;
|
||||
color: #000000;
|
||||
|
||||
}
|
||||
|
||||
.merchantItem_right_con_right image {
|
||||
width: 32rpx;
|
||||
height: 28.59rpx;
|
||||
margin-bottom: 6rpx;
|
||||
}
|
||||
|
||||
.merchantItem_right_add {
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
margin-top: 14rpx;
|
||||
}
|
||||
|
||||
/* 加载更多样式 */
|
||||
.loading {
|
||||
display: inline-block;
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
border: 3rpx solid #f3f3f3;
|
||||
border-top: 3rpx solid #3498db;
|
||||
border-radius: 50%;
|
||||
animation: spin 1s linear infinite;
|
||||
margin-right: 10rpx;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@ -147,6 +147,8 @@ export default {
|
||||
uni.removeStorageSync('is_shop');
|
||||
uni.removeStorageSync('shopId');
|
||||
uni.removeStorageSync('order_dispatch_permission');
|
||||
uni.removeStorageSync('work_order_permission');
|
||||
|
||||
uni.removeStorageSync('nickName');
|
||||
uni.removeStorageSync('changeCommData');
|
||||
console.error('用户拒绝授权:', event.detail.errMsg);
|
||||
@ -159,6 +161,7 @@ export default {
|
||||
}, { silent: false }).then(res => {
|
||||
const { community_worker } = res;
|
||||
uni.setStorageSync('order_dispatch_permission', community_worker && community_worker[0].order_dispatch_permission == 1 || false);
|
||||
uni.setStorageSync('work_order_permission', community_worker && community_worker[0].work_order_permission == 1 || false);
|
||||
uni.setStorageSync('nickName', res.nick_name);
|
||||
console.log(res)
|
||||
})
|
||||
|
||||
@ -215,7 +215,9 @@ export default {
|
||||
mask: true
|
||||
})
|
||||
request(apiArr.getRegionList, 'POST', {
|
||||
short_name: keyword
|
||||
short_name: keyword,
|
||||
ad_level: 2,
|
||||
|
||||
}, { silent: false }).then((res) => {
|
||||
console.log('搜索结果', res);
|
||||
this.searchValue = keyword;
|
||||
@ -263,7 +265,10 @@ export default {
|
||||
title: '加载中',
|
||||
mask: true
|
||||
})
|
||||
const res = await request(apiArr.getRegionList, 'POST', {}, { silent: false });
|
||||
const params = {
|
||||
ad_level:2
|
||||
}
|
||||
const res = await request(apiArr.getRegionList, 'POST', params, { silent: false });
|
||||
// TODO: 数据量返回过于庞大,只获取所需信息,其他内容舍弃
|
||||
const newRes = res.rows.map((item) => {
|
||||
return {
|
||||
|
||||
@ -27,7 +27,7 @@
|
||||
</view>
|
||||
<view class="section section1">
|
||||
<view class="section_label">
|
||||
<view>10010</view>
|
||||
<view>{{ userInfo.balance }}</view>
|
||||
<view>积分</view>
|
||||
</view>
|
||||
<view class="section_label">
|
||||
@ -232,6 +232,8 @@
|
||||
uni.removeStorageSync('is_shop');
|
||||
uni.removeStorageSync('shopId');
|
||||
uni.removeStorageSync('order_dispatch_permission');
|
||||
uni.removeStorageSync('work_order_permission');
|
||||
|
||||
const button = uni.createSelectorQuery().select('#hiddenLoginBtn');
|
||||
button.boundingClientRect().exec();
|
||||
|
||||
@ -372,6 +374,7 @@
|
||||
if (item) {
|
||||
const { community_worker } = res;
|
||||
uni.setStorageSync('order_dispatch_permission', community_worker && community_worker[0].order_dispatch_permission == 1 || false);
|
||||
uni.setStorageSync('work_order_permission', community_worker && community_worker[0].work_order_permission == 1 || false);
|
||||
uni.setStorageSync('phone', res.account);
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user