feat : 修改到家服务的师傅资料弹窗
This commit is contained in:
赵毅
parent
ad7818ce2d
commit
01aa983ec7
@ -448,9 +448,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;
|
||||
@ -502,3 +502,113 @@ page {
|
||||
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;
|
||||
}
|
||||
@ -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>
|
||||
@ -313,7 +321,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>
|
||||
@ -336,7 +346,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 +359,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 +370,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="http://localhost:8080/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 +418,7 @@ export default {
|
||||
return {
|
||||
top: "",
|
||||
localHeight: "",
|
||||
boxshadow2: false,
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
@ -390,6 +431,13 @@ export default {
|
||||
back() {
|
||||
NavgateTo("1");
|
||||
},
|
||||
|
||||
openSave() {
|
||||
this.boxshadow2 = true;
|
||||
},
|
||||
changeShadow2() {
|
||||
this.boxshadow2 = false;
|
||||
},
|
||||
},
|
||||
onReady() {},
|
||||
|
||||
|
||||
@ -39,11 +39,6 @@
|
||||
<text class="product-name">{{ productInfo.name }}</text>
|
||||
<text class="product-spec">{{ productInfo.spec }}</text>
|
||||
<text class="product-unit">{{ productInfo.unit }}</text>
|
||||
<!-- <text class="product-name">{{ productInfo.name }}</text>
|
||||
<view class="product-specs">
|
||||
<text class="spec-item">{{ productInfo.spec }}</text>
|
||||
<text class="spec-item">{{ productInfo.unit }}</text>
|
||||
</view> -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user