|
@@ -1,59 +1,68 @@
|
|
|
<template>
|
|
|
- <view class="workark-detail">
|
|
|
- <uv-swiper :list="rotatingImages" indicator indicatorMode="line" circular height="520rpx"></uv-swiper>
|
|
|
- <view class="workark-title">
|
|
|
- <view class="workark-price">
|
|
|
- <text class="price-unit">¥</text>
|
|
|
- <uv-text type="error" :text="detail.price" size="60" :customStyle="{
|
|
|
- fontWeight:'bold'
|
|
|
- }"></uv-text>
|
|
|
- </view>
|
|
|
- <uv-text :text="detail.name" size="40" :customStyle="{
|
|
|
- fontWeight:'bold',
|
|
|
- marginBottom:'10rpx'
|
|
|
- }" :lines="2">
|
|
|
- </uv-text>
|
|
|
- <uv-text :lines="2" :text="detail.subtitle" type="tips" size="26"></uv-text>
|
|
|
- <view class="workark-specifications">
|
|
|
- <uv-text text="规格" type="tips" size="28"></uv-text>
|
|
|
- <view class="specifications-list">
|
|
|
- <view class="coupon-card" v-for="(item,index) in productList" :key="index" @tap="initDetail(index)">
|
|
|
- <view class="coupon-card-box" :class="{active:detail.id === item.id}">
|
|
|
- <uv-text :text="item.name" :type="detail.id === item.id?'primary':''" size="28"></uv-text>
|
|
|
- <view class="icon-check">
|
|
|
- <uv-icon name="checkmark" color="#fff" size="24rpx"></uv-icon>
|
|
|
+ <view>
|
|
|
+ <view class="workark-empty" v-if="productList.length === 0">
|
|
|
+ <uv-empty icon="https://file-node.oss-cn-shanghai.aliyuncs.com/youji/fa57e25b38c442ebb0ba023cace796bb"
|
|
|
+ :isImg="true" textSize="28" width="360" text="暂无产品">
|
|
|
+ </uv-empty>
|
|
|
+ </view>
|
|
|
+ <view class="workark-detail" v-else>
|
|
|
+ <uv-swiper :list="rotatingImages" indicator indicatorMode="line" circular height="520rpx"></uv-swiper>
|
|
|
+ <view class="workark-title">
|
|
|
+ <view class="workark-price">
|
|
|
+ <text class="price-unit">¥</text>
|
|
|
+ <uv-text type="error" :text="detail.price" size="60" :customStyle="{
|
|
|
+ fontWeight:'bold'
|
|
|
+ }"></uv-text>
|
|
|
+ </view>
|
|
|
+ <uv-text :text="detail.name" size="40" :customStyle="{
|
|
|
+ fontWeight:'bold',
|
|
|
+ marginBottom:'10rpx'
|
|
|
+ }" :lines="2">
|
|
|
+ </uv-text>
|
|
|
+ <uv-text :lines="2" :text="detail.subtitle" type="tips" size="26"></uv-text>
|
|
|
+ <view class="workark-specifications">
|
|
|
+ <uv-text text="规格" type="tips" size="28"></uv-text>
|
|
|
+ <view class="specifications-list">
|
|
|
+ <view class="coupon-card" v-for="(item,index) in productList" :key="index"
|
|
|
+ @tap="initDetail(index)">
|
|
|
+ <view class="coupon-card-box" :class="{active:detail.id === item.id}">
|
|
|
+ <uv-text :text="item.name" :type="detail.id === item.id?'primary':''"
|
|
|
+ size="28"></uv-text>
|
|
|
+ <view class="icon-check">
|
|
|
+ <uv-icon name="checkmark" color="#fff" size="24rpx"></uv-icon>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- </view>
|
|
|
- <uv-divider text="产品详情" :hairline="true" textSize="28"></uv-divider>
|
|
|
- <view class="workark-detail-list">
|
|
|
- <view class="home-detail-img" v-for="(item,index) in detailedImage" :key="item.id">
|
|
|
- <uv-image :src="item.url || ''" width="100%" mode="widthFix"></uv-image>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="hui-button-box">
|
|
|
- <view class="icon-kefu" @tap="lookContract" v-if="detail.contract">
|
|
|
- <uv-icon name="order" color="primary" size="50" label="合同" labelPos="bottom" labelSize="20">
|
|
|
- </uv-icon>
|
|
|
+ <uv-divider text="产品详情" :hairline="true" textSize="28"></uv-divider>
|
|
|
+ <view class="workark-detail-list">
|
|
|
+ <view class="home-detail-img" v-for="(item,index) in detailedImage" :key="item.id">
|
|
|
+ <uv-image :src="item.url || ''" width="100%" mode="widthFix"></uv-image>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
- <view class="icon-kefu" @tap="openChat">
|
|
|
- <uv-icon name="server-man" color="primary" size="50" label="客服" labelPos="bottom" labelSize="20">
|
|
|
- </uv-icon>
|
|
|
+ <view class="hui-button-box">
|
|
|
+ <view class="icon-kefu" @tap="lookContract" v-if="detail.contract">
|
|
|
+ <uv-icon name="order" color="primary" size="50" label="合同" labelPos="bottom" labelSize="20">
|
|
|
+ </uv-icon>
|
|
|
+ </view>
|
|
|
+ <view class="icon-kefu" @tap="openChat">
|
|
|
+ <uv-icon name="server-man" color="primary" size="50" label="客服" labelPos="bottom" labelSize="20">
|
|
|
+ </uv-icon>
|
|
|
+ </view>
|
|
|
+ <uv-button type="primary" text="立即购买" @tap="$refs.popup.open()">
|
|
|
+ </uv-button>
|
|
|
</view>
|
|
|
- <uv-button type="primary" text="立即购买" @tap="$refs.popup.open()">
|
|
|
- </uv-button>
|
|
|
+ <uv-popup ref="popup" mode="bottom" :round="16" @change="popupChange" :custom-style="{
|
|
|
+ height: popupHeight
|
|
|
+ }">
|
|
|
+ <view class="popup-title">确认订单</view>
|
|
|
+ <view class="popup-content">
|
|
|
+ <sure-order v-if="popupShow" :orderId="detail.id" @closePopup="closePopup"></sure-order>
|
|
|
+ </view>
|
|
|
+ </uv-popup>
|
|
|
</view>
|
|
|
- <uv-popup ref="popup" mode="bottom" :round="16" @change="popupChange" :custom-style="{
|
|
|
- height: popupHeight
|
|
|
- }">
|
|
|
- <view class="popup-title">确认订单</view>
|
|
|
- <view class="popup-content">
|
|
|
- <sure-order v-if="popupShow" :orderId="detail.id" @closePopup="closePopup"></sure-order>
|
|
|
- </view>
|
|
|
- </uv-popup>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
@@ -92,6 +101,7 @@
|
|
|
});
|
|
|
if (serveData.state) {
|
|
|
this.productList = serveData.data;
|
|
|
+ if (this.productList.length === 0) return;
|
|
|
this.initDetail(this.productList.length - 1);
|
|
|
}
|
|
|
},
|
|
@@ -127,6 +137,10 @@
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
+ .workark-empty {
|
|
|
+ padding-top: 80rpx;
|
|
|
+ }
|
|
|
+
|
|
|
.workark-detail {
|
|
|
padding-bottom: 160rpx;
|
|
|
}
|