|
|
|
@ -1,50 +1,50 @@ |
|
|
|
<template> |
|
|
|
<view style="height: 100vh;background: #fff;"> |
|
|
|
<loading-state ref="pageView" @request="request"> |
|
|
|
<view style="height: 85vh;overflow: hidden;overflow-y: auto;"> |
|
|
|
<image :src="data.picUrl" style="width: 100vw;height: 80vw;"></image> |
|
|
|
<view style="height: 100vh;background: #fff;"> |
|
|
|
<loading-state ref="pageView" @request="request"> |
|
|
|
<view style="height: 85vh;overflow: hidden;overflow-y: auto;"> |
|
|
|
<image :src="data.picUrl" style="width: 100vw;height: 80vw;"></image> |
|
|
|
|
|
|
|
<view style="display: flex;flex-direction: column;background: #fff;padding: 20px 20px 0px 20px;margin-top: 10px; |
|
|
|
<view style="display: flex;flex-direction: column;background: #fff;padding: 20px 20px 0px 20px;margin-top: 10px; |
|
|
|
border-top-left-radius: 20px;border-top-right-radius: 20px;height: 100%;"> |
|
|
|
|
|
|
|
<view style="display: flex;flex-direction: row;justify-content: space-between;align-items: center;"> |
|
|
|
<text |
|
|
|
style="font-size: 18px;font-weight: 600;font-family: sans-serif;color: #333;">{{data.name}}</text> |
|
|
|
<text style="font-size: 13px;color: #FF5006;">￥{{data.mefenPrice}}</text> |
|
|
|
</view> |
|
|
|
<view style="display: flex;flex-direction: row;justify-content: space-between;align-items: center;"> |
|
|
|
<text |
|
|
|
style="font-size: 18px;font-weight: 600;font-family: sans-serif;color: #333;">{{data.name}}</text> |
|
|
|
<text style="font-size: 13px;color: #FF5006;">￥{{data.mefenPrice}}</text> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view style="display: flex;flex-direction: row;justify-content: space-between;margin-top: 10px;"> |
|
|
|
<text style="font-size: 13px;color: #666;">规    格</text> |
|
|
|
<text style="font-size: 13px;color: #999;">{{data.weight}}</text> |
|
|
|
</view> |
|
|
|
<view style="display: flex;flex-direction: row;justify-content: space-between;margin-top: 10px;"> |
|
|
|
<text style="font-size: 13px;color: #666;">包    装</text> |
|
|
|
<text |
|
|
|
style="font-size: 13px;color: #999;">{{data.quantityOfPackage}}{{data.unitName}}/{{data.packUnit}}</text> |
|
|
|
</view> |
|
|
|
<view style="display: flex;flex-direction: row;justify-content: space-between;margin-top: 10px;"> |
|
|
|
<text style="font-size: 13px;color: #666;">规    格</text> |
|
|
|
<text style="font-size: 13px;color: #999;">{{data.weight}}</text> |
|
|
|
</view> |
|
|
|
<view style="display: flex;flex-direction: row;justify-content: space-between;margin-top: 10px;"> |
|
|
|
<text style="font-size: 13px;color: #666;">包    装</text> |
|
|
|
<text |
|
|
|
style="font-size: 13px;color: #999;">{{data.quantityOfPackage}}{{data.unitName}}/{{data.packUnit}}</text> |
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 20px;"> |
|
|
|
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 20px;"> |
|
|
|
|
|
|
|
<view style="width: 2px;height: 15px;background: #FF7A11;margin-right: 10px;"></view> |
|
|
|
<text style="font-size: 14px;font-weight: 600;font-family: sans-serif;color: #333;">商品详情</text> |
|
|
|
<view style="width: 2px;height: 15px;background: #FF7A11;margin-right: 10px;"></view> |
|
|
|
<text style="font-size: 14px;font-weight: 600;font-family: sans-serif;color: #333;">商品详情</text> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view style="margin-top: 10px;" v-show="!data.appContent==''"> |
|
|
|
<rich-text :nodes="data.appContent | formatRichText"></rich-text> |
|
|
|
</view> |
|
|
|
<view style="margin-top: 10px;" v-show="!data.appContent==''"> |
|
|
|
<rich-text :nodes="data.appContent | formatRichText"></rich-text> |
|
|
|
</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
</loading-state> |
|
|
|
</view> |
|
|
|
</loading-state> |
|
|
|
|
|
|
|
<!-- <view |
|
|
|
<!-- <view |
|
|
|
style="position: absolute; bottom: 0px; display: flex;flex-direction: column;width: 100%; |
|
|
|
box-sizing: border-box; padding-left: 16px;padding-right: 16px;background: #fff; height: 12vh;border-top: 1px solid #EFEFEF;"> --> |
|
|
|
|
|
|
|
<!-- <view |
|
|
|
<!-- <view |
|
|
|
style="display: flex;flex-direction: row;align-items: center; justify-content: center; margin-top:10px;"> |
|
|
|
|
|
|
|
<view id="bomView" style="display: flex;flex-direction: row;align-items: center;"> |
|
|
|
@ -69,13 +69,13 @@ |
|
|
|
</view> |
|
|
|
</view> --> |
|
|
|
|
|
|
|
<!-- <view |
|
|
|
<!-- <view |
|
|
|
style="display: flex;flex-direction: row; justify-content: center;align-items: center;margin-top: 10px;padding: 0px 10px;margin-bottom: 20px;"> |
|
|
|
|
|
|
|
<text style="background: #FF9900; color: #fff;font-size: 14px; padding: 0px 15px;height: 50px;line-height:50px;flex: 1;text-align: center; |
|
|
|
border: 1px #FF9900 solid; border-radius: 25px;" @click="showDialog()">加入购物车</text> --> |
|
|
|
|
|
|
|
<!-- <view style="border: 1px #FF9900 solid;border-top-right-radius: 25px; border-bottom-right-radius: 25px;padding: 0px 5px;height: 50px;line-height:50px;flex: 1; |
|
|
|
<!-- <view style="border: 1px #FF9900 solid;border-top-right-radius: 25px; border-bottom-right-radius: 25px;padding: 0px 5px;height: 50px;line-height:50px;flex: 1; |
|
|
|
display: flex;flex-direction: row;align-items: center;box-sizing: border-box;justify-content: center;" |
|
|
|
@click="gotoCart()"> |
|
|
|
<image src="../../static/shoppCart_icon.png" mode="aspectFill" |
|
|
|
@ -89,76 +89,76 @@ |
|
|
|
</view> |
|
|
|
</view> --> |
|
|
|
|
|
|
|
<!-- </view> |
|
|
|
<!-- </view> |
|
|
|
</view> --> |
|
|
|
|
|
|
|
|
|
|
|
<!-- 弹窗蒙版 --> |
|
|
|
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal'></view> |
|
|
|
<view class="modalDlg" catchtouchmove='preventTouchMove' v-if='showModal'> |
|
|
|
<!-- 弹窗蒙版 --> |
|
|
|
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal'></view> |
|
|
|
<view class="modalDlg" catchtouchmove='preventTouchMove' v-if='showModal'> |
|
|
|
|
|
|
|
<view style="display: flex;flex-direction: row;padding: 16px 20px;margin-top: 10px;"> |
|
|
|
<view style="display: flex;flex-direction: row;padding: 16px 20px;margin-top: 10px;"> |
|
|
|
|
|
|
|
<image :src="data.picUrl" style="width: 90px;height: 90px;border-radius: 10px;" mode="scaleToFill"> |
|
|
|
</image> |
|
|
|
<image :src="data.picUrl" style="width: 90px;height: 90px;border-radius: 10px;" mode="scaleToFill"> |
|
|
|
</image> |
|
|
|
|
|
|
|
<view style="display: flex;flex-direction: column;flex: 1;margin-left: 15px;"> |
|
|
|
<view style="display: flex;flex-direction: column;flex: 1;margin-left: 15px;"> |
|
|
|
|
|
|
|
<view style="display: flex;flex-direction: row;"> |
|
|
|
<text style="flex: 1;margin-right: 10px;">{{data.name}}</text> |
|
|
|
<image src="../../static/close2.png" style="width: 22px;height: 22px;" @click="colseDialog()"> |
|
|
|
</image> |
|
|
|
</view> |
|
|
|
<view style="display: flex;flex-direction: row;"> |
|
|
|
<text style="flex: 1;margin-right: 10px;">{{data.name}}</text> |
|
|
|
<image src="../../static/close2.png" style="width: 22px;height: 22px;" @click="colseDialog()"> |
|
|
|
</image> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view style="display: flex;flex-direction: row;margin-top: 8px;"> |
|
|
|
<view style="display: flex;flex-direction: row;margin-top: 8px;"> |
|
|
|
|
|
|
|
<text |
|
|
|
style="color: #EE752F;border: 1px #EE752F solid; |
|
|
|
<text |
|
|
|
style="color: #EE752F;border: 1px #EE752F solid; |
|
|
|
border-radius: 8px;padding: 1px 10px;font-size: 10px;">{{data.weight}}{{data.specificationUnit}}/{{data.unitName}}</text> |
|
|
|
|
|
|
|
<text style="margin-left: 10px;color: #EE752F;border: 1px #EE752F solid; |
|
|
|
<text style="margin-left: 10px;color: #EE752F;border: 1px #EE752F solid; |
|
|
|
border-radius: 8px;padding: 1px 10px;font-size: 10px;">{{data.remarks}}</text> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- <text style="font-size: 12px;color: #E36443;margin-top: 8px;">提货截止日：{{data.periodValidity}}</text> --> |
|
|
|
<!-- <text style="font-size: 12px;color: #E36443;margin-top: 8px;">提货截止日：{{data.periodValidity}}</text> --> |
|
|
|
|
|
|
|
<text style="font-size: 12px;color: #E36443;margin-top: 8px;">￥{{data.price}}元</text> |
|
|
|
<text style="font-size: 12px;color: #E36443;margin-top: 8px;">￥{{data.price}}元</text> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
<view |
|
|
|
style="display: flex;flex-direction: row;margin-top:10px;justify-content: space-between;padding: 16px 20px;"> |
|
|
|
<view |
|
|
|
style="display: flex;flex-direction: row;margin-top:10px;justify-content: space-between;padding: 16px 20px;"> |
|
|
|
|
|
|
|
<text style="font-size: 16px;font-weight: 600;font-family: sans-serif;">数量</text> |
|
|
|
<text style="font-size: 16px;font-weight: 600;font-family: sans-serif;">数量</text> |
|
|
|
|
|
|
|
<view style="display: flex;flex-direction: row;align-items: center;"> |
|
|
|
<view style="display: flex;flex-direction: row;align-items: center;"> |
|
|
|
|
|
|
|
<image src="../../static/jian_icon.png" mode="aspectFill" style="width: 25px;height: 25px;" |
|
|
|
@click.stop="jian(data)"> |
|
|
|
</image> |
|
|
|
<image src="../../static/jian_icon.png" mode="aspectFill" style="width: 25px;height: 25px;" |
|
|
|
@click.stop="jian(data)"> |
|
|
|
</image> |
|
|
|
|
|
|
|
<text style="font-size: 16px;padding:5px; margin-left: 8px;margin-right: 8px;" |
|
|
|
@click.stop="numberClick(data)">{{data.goodsNumber}}</text> |
|
|
|
<text style="font-size: 16px;padding:5px; margin-left: 8px;margin-right: 8px;" |
|
|
|
@click.stop="numberClick(data)">{{data.goodsNumber}}</text> |
|
|
|
|
|
|
|
<image src="../../static/jia_icon.png" mode="aspectFill" style="width: 25px;height: 25px;" |
|
|
|
@click.stop="jia(data)"> |
|
|
|
</image> |
|
|
|
<image src="../../static/jia_icon.png" mode="aspectFill" style="width: 25px;height: 25px;" |
|
|
|
@click.stop="jia(data)"> |
|
|
|
</image> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<view style="position: absolute; bottom: 0px; display: flex;flex-direction: column;width: 100%; |
|
|
|
<view style="position: absolute; bottom: 0px; display: flex;flex-direction: column;width: 100%; |
|
|
|
box-sizing: border-box; padding-left: 16px;padding-right: 16px;background: #fff; height: 12vh; |
|
|
|
border-top: 1px solid #EFEFEF;"> |
|
|
|
|
|
|
|
<!-- <view |
|
|
|
<!-- <view |
|
|
|
style="display: flex;flex-direction: row;align-items: center; justify-content: center; margin-top:10px;"> |
|
|
|
|
|
|
|
<view id="bomView" style="display: flex;flex-direction: row;align-items: center;"> |
|
|
|
@ -183,384 +183,387 @@ |
|
|
|
</view> |
|
|
|
</view> --> |
|
|
|
|
|
|
|
<view |
|
|
|
style="display: flex;flex-direction: row; justify-content: center;align-items: center;margin-top: 10px;padding: 0px 10px;margin-bottom: 20px;"> |
|
|
|
<view |
|
|
|
style="display: flex;flex-direction: row; justify-content: center;align-items: center;margin-top: 10px;padding: 0px 10px;margin-bottom: 20px;"> |
|
|
|
|
|
|
|
<text style="background: #FF9900; color: #fff;font-size: 14px; padding: 0px 15px;height: 50px;line-height:50px;flex: 1;text-align: center; |
|
|
|
<text style="background: #FF9900; color: #fff;font-size: 14px; padding: 0px 15px;height: 50px;line-height:50px;flex: 1;text-align: center; |
|
|
|
border: 1px #FF9900 solid; border-radius: 25px;" @click="upDateShoppCart()">加入购物车</text> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- 输入数量 --> |
|
|
|
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal1'></view> |
|
|
|
<view class="modalDlg4" catchtouchmove='preventTouchMove' v-if='showModal1'> |
|
|
|
<!-- 输入数量 --> |
|
|
|
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal1'></view> |
|
|
|
<view class="modalDlg4" catchtouchmove='preventTouchMove' v-if='showModal1'> |
|
|
|
|
|
|
|
<view |
|
|
|
style="display: flex;flex-direction: column;background: #fff; width: 80%; border-radius: 20px;box-sizing: border-box;"> |
|
|
|
<view |
|
|
|
style="display: flex;flex-direction: column;background: #fff; width: 80%; border-radius: 20px;box-sizing: border-box;"> |
|
|
|
|
|
|
|
<input type="number" placeholder="请输入数量" v-model="data.goodsNumber" |
|
|
|
style="margin: 20px;border: 1px #bbb solid; padding: 5px;line-height: 30px;height: 30px;border-radius: 6px;" /> |
|
|
|
<view |
|
|
|
style="flex-shrink: 0;display: flex;flex-direction: row;align-items: center;justify-content: center;"> |
|
|
|
<button class="button1" @click="colseDialog1()">取消</button> |
|
|
|
<button class="button2" @click="saveNum()">确定</button> |
|
|
|
</view> |
|
|
|
<input type="number" placeholder="请输入数量" v-model="data.goodsNumber" |
|
|
|
style="margin: 20px;border: 1px #bbb solid; padding: 5px;line-height: 30px;height: 30px;border-radius: 6px;" /> |
|
|
|
<view |
|
|
|
style="flex-shrink: 0;display: flex;flex-direction: row;align-items: center;justify-content: center;"> |
|
|
|
<button class="button1" @click="colseDialog1()">取消</button> |
|
|
|
<button class="button2" @click="saveNum()">确定</button> |
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
<uni-popup ref="inputDialog2" type="dialog"> |
|
|
|
<uni-popup-dialog ref="inputClose" mode="more" title="起订说明" :showConfirm="true" |
|
|
|
:beforeClose="dialogBeforeClose2" @confirm="dialogInputConfirm2" |
|
|
|
:content="data.qdxy"></uni-popup-dialog> |
|
|
|
</uni-popup> |
|
|
|
<uni-popup ref="inputDialog2" type="dialog"> |
|
|
|
<uni-popup-dialog ref="inputClose" mode="more" title="起订说明" :showConfirm="true" |
|
|
|
:beforeClose="dialogBeforeClose2" @confirm="dialogInputConfirm2" |
|
|
|
:content="data.qdxy"></uni-popup-dialog> |
|
|
|
</uni-popup> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
export default { |
|
|
|
data() { |
|
|
|
return { |
|
|
|
showModal: false, |
|
|
|
showModal1: false, |
|
|
|
page: { |
|
|
|
sid: '', |
|
|
|
weight: "", |
|
|
|
remarks: "", |
|
|
|
price: "" |
|
|
|
}, |
|
|
|
data: { |
|
|
|
picUrl: '', |
|
|
|
name: '', |
|
|
|
price: '', |
|
|
|
remarks: '', |
|
|
|
appContent: "" |
|
|
|
}, |
|
|
|
|
|
|
|
dialogContent: "这里是协议内容，这里是协议内容,这里是协议内容，这里是协议内容,这里是协议内容，这里是协议内容,这里是协议内容，这里是协议内容这里是协议内容，这里是协议内容", |
|
|
|
confirmText: "我知道了（5s）", |
|
|
|
dialogBeforeClose: false, |
|
|
|
dialogBeforeClose2: false, |
|
|
|
countdown: 5, |
|
|
|
|
|
|
|
} |
|
|
|
}, |
|
|
|
onLoad(options) { |
|
|
|
this.page.sid = options.sid |
|
|
|
}, |
|
|
|
onShow() { |
|
|
|
this.request() |
|
|
|
}, |
|
|
|
filters: { |
|
|
|
/** |
|
|
|
* 处理富文本里的图片宽度自适应 |
|
|
|
* 1.去掉img标签里的style、width、height属性 |
|
|
|
* 2.img标签添加style属性：max-width:100%;height:auto |
|
|
|
* 3.修改所有style里的width属性为max-width:100% |
|
|
|
* 4.去掉<br/>标签 |
|
|
|
* @param html |
|
|
|
* @returns {void|string|*} |
|
|
|
*/ |
|
|
|
formatRichText(html) { |
|
|
|
//控制小程序中图片大小 |
|
|
|
if (html) { |
|
|
|
let newContent = html.replace(/<img[^>]*>/gi, function(match, capture) { |
|
|
|
match = match.replace(/style="[^"]+"/gi, '').replace(/style='[^']+'/gi, ''); |
|
|
|
match = match.replace(/width="[^"]+"/gi, '').replace(/width='[^']+'/gi, ''); |
|
|
|
match = match.replace(/height="[^"]+"/gi, '').replace(/height='[^']+'/gi, ''); |
|
|
|
return match; |
|
|
|
}); |
|
|
|
newContent = newContent.replace(/style="[^"]+"/gi, function(match, capture) { |
|
|
|
match = match.replace(/width:[^;]+;/gi, 'max-width:100%;').replace(/width:[^;]+;/gi, |
|
|
|
'max-width:100%;'); |
|
|
|
return match; |
|
|
|
}); |
|
|
|
newContent = newContent.replace(/<br[^>]*\/>/gi, ''); |
|
|
|
newContent = newContent.replace(/\<img/gi, |
|
|
|
'<img style="max-width:100%;height:auto;display:block;margin:10rpx auto;"'); |
|
|
|
return newContent; |
|
|
|
} else { |
|
|
|
return '暂无商品详情'; |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
showDialog() { |
|
|
|
this.showModal = true |
|
|
|
}, |
|
|
|
colseDialog() { |
|
|
|
this.showModal = false |
|
|
|
}, |
|
|
|
colseDialog1() { |
|
|
|
this.showModal1 = false |
|
|
|
}, |
|
|
|
saveNum() { |
|
|
|
this.showModal1 = false |
|
|
|
}, |
|
|
|
jian(item) { |
|
|
|
if (Number(item.goodsNumber) > 0) { |
|
|
|
item.goodsNumber = Number(item.goodsNumber) - 1 |
|
|
|
} |
|
|
|
}, |
|
|
|
jia(item) { |
|
|
|
item.goodsNumber = Number(item.goodsNumber) + 1 |
|
|
|
}, |
|
|
|
numberClick(item) { |
|
|
|
this.showModal1 = true |
|
|
|
}, |
|
|
|
|
|
|
|
request() { |
|
|
|
|
|
|
|
var params = { |
|
|
|
customerSid: getApp().globalData.sid, |
|
|
|
sid: this.page.sid, |
|
|
|
} |
|
|
|
|
|
|
|
console.log("request", params); |
|
|
|
|
|
|
|
|
|
|
|
let _this = this |
|
|
|
|
|
|
|
_this.$api.goodsDetail(params).then((resp) => { |
|
|
|
// console.log(resp); |
|
|
|
_this.data = resp |
|
|
|
|
|
|
|
// _this.getAllPriceOrWeight() |
|
|
|
|
|
|
|
_this.$nextTick(() => { |
|
|
|
_this.$refs.pageView.setLoadState(2) |
|
|
|
}) |
|
|
|
}).catch(e => { |
|
|
|
_this.$nextTick(() => { |
|
|
|
_this.$refs.pageView.setLoadState(1) |
|
|
|
}) |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
getAllPriceOrWeight() { |
|
|
|
// let _this = this |
|
|
|
|
|
|
|
// var params = { |
|
|
|
// customerSid: getApp().globalData.sid, |
|
|
|
// brandId: _this.data.brandId, |
|
|
|
// } |
|
|
|
|
|
|
|
// console.log("getGoodsWeight", params); |
|
|
|
|
|
|
|
// _this.$api.getGoodsWeight(params).then((resp) => { |
|
|
|
|
|
|
|
// console.log("getGoodsWeight", resp); |
|
|
|
|
|
|
|
// _this.page.price = resp.totalPrice |
|
|
|
// _this.page.weight = resp.totalWeight |
|
|
|
// _this.page.remarks = resp.remarks |
|
|
|
|
|
|
|
|
|
|
|
// _this.$nextTick(() => { |
|
|
|
// _this.$refs.pageView.setLoadState(2) |
|
|
|
// }) |
|
|
|
|
|
|
|
// }).catch(e => { |
|
|
|
// _this.$nextTick(() => { |
|
|
|
// _this.$refs.pageView.setLoadState(1) |
|
|
|
// }) |
|
|
|
// }) |
|
|
|
}, |
|
|
|
|
|
|
|
inCart() { |
|
|
|
|
|
|
|
// this.data.goodsNumber = Number(this.data.goodsNumber) + 1 |
|
|
|
|
|
|
|
this.upDateShoppCart() |
|
|
|
}, |
|
|
|
upDateShoppCart() { |
|
|
|
var good = { |
|
|
|
goodsSid: this.data.sid, |
|
|
|
goodsName: this.data.name, |
|
|
|
goodsNumber: this.data.goodsNumber, |
|
|
|
affiliation: this.data.brandId, |
|
|
|
price: this.data.mefenPrice, |
|
|
|
weight: this.data.weight, |
|
|
|
customerSid: getApp().globalData.sid |
|
|
|
} |
|
|
|
|
|
|
|
let _this = this |
|
|
|
|
|
|
|
console.log("upDateShoppCart", good); |
|
|
|
|
|
|
|
_this.$api.addShoppingCart(good).then((resp) => { |
|
|
|
_this.shortToast('已加入购物车。') |
|
|
|
_this.getAllPriceOrWeight() |
|
|
|
_this.showModal = false |
|
|
|
uni.navigateBack() |
|
|
|
}).catch(e => { |
|
|
|
_this.showModal = false |
|
|
|
}) |
|
|
|
}, |
|
|
|
settlement() { |
|
|
|
// 支付 |
|
|
|
|
|
|
|
if (this.page.weight < parseInt(this.data.qssl)) { |
|
|
|
this.shortToast('满' + this.data.qssl + '斤才可定制云菜窖哦，请继续选菜吧。') |
|
|
|
return |
|
|
|
} |
|
|
|
export default { |
|
|
|
data() { |
|
|
|
return { |
|
|
|
showModal: false, |
|
|
|
showModal1: false, |
|
|
|
page: { |
|
|
|
sid: '', |
|
|
|
weight: "", |
|
|
|
remarks: "", |
|
|
|
price: "" |
|
|
|
}, |
|
|
|
data: { |
|
|
|
picUrl: '', |
|
|
|
name: '', |
|
|
|
price: '', |
|
|
|
remarks: '', |
|
|
|
appContent: "" |
|
|
|
}, |
|
|
|
|
|
|
|
dialogContent: "这里是协议内容，这里是协议内容,这里是协议内容，这里是协议内容,这里是协议内容，这里是协议内容,这里是协议内容，这里是协议内容这里是协议内容，这里是协议内容", |
|
|
|
confirmText: "我知道了（5s）", |
|
|
|
dialogBeforeClose: false, |
|
|
|
dialogBeforeClose2: false, |
|
|
|
countdown: 5, |
|
|
|
|
|
|
|
} |
|
|
|
}, |
|
|
|
onLoad(options) { |
|
|
|
this.page.sid = options.sid |
|
|
|
}, |
|
|
|
onShow() { |
|
|
|
this.request() |
|
|
|
}, |
|
|
|
filters: { |
|
|
|
/** |
|
|
|
* 处理富文本里的图片宽度自适应 |
|
|
|
* 1.去掉img标签里的style、width、height属性 |
|
|
|
* 2.img标签添加style属性：max-width:100%;height:auto |
|
|
|
* 3.修改所有style里的width属性为max-width:100% |
|
|
|
* 4.去掉<br/>标签 |
|
|
|
* @param html |
|
|
|
* @returns {void|string|*} |
|
|
|
*/ |
|
|
|
formatRichText(html) { |
|
|
|
//控制小程序中图片大小 |
|
|
|
if (html) { |
|
|
|
let newContent = html.replace(/<img[^>]*>/gi, function(match, capture) { |
|
|
|
match = match.replace(/style="[^"]+"/gi, '').replace(/style='[^']+'/gi, ''); |
|
|
|
match = match.replace(/width="[^"]+"/gi, '').replace(/width='[^']+'/gi, ''); |
|
|
|
match = match.replace(/height="[^"]+"/gi, '').replace(/height='[^']+'/gi, ''); |
|
|
|
return match; |
|
|
|
}); |
|
|
|
newContent = newContent.replace(/style="[^"]+"/gi, function(match, capture) { |
|
|
|
match = match.replace(/width:[^;]+;/gi, 'max-width:100%;').replace(/width:[^;]+;/gi, |
|
|
|
'max-width:100%;'); |
|
|
|
return match; |
|
|
|
}); |
|
|
|
newContent = newContent.replace(/<br[^>]*\/>/gi, ''); |
|
|
|
newContent = newContent.replace(/\<img/gi, |
|
|
|
'<img style="max-width:100%;height:auto;display:block;margin:10rpx auto;"'); |
|
|
|
return newContent; |
|
|
|
} else { |
|
|
|
return '暂无商品详情'; |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
showDialog() { |
|
|
|
this.showModal = true |
|
|
|
}, |
|
|
|
colseDialog() { |
|
|
|
this.showModal = false |
|
|
|
}, |
|
|
|
colseDialog1() { |
|
|
|
this.showModal1 = false |
|
|
|
}, |
|
|
|
saveNum() { |
|
|
|
this.showModal1 = false |
|
|
|
}, |
|
|
|
jian(item) { |
|
|
|
if (Number(item.goodsNumber) > 0) { |
|
|
|
item.goodsNumber = Number(item.goodsNumber) - 1 |
|
|
|
} |
|
|
|
}, |
|
|
|
jia(item) { |
|
|
|
item.goodsNumber = Number(item.goodsNumber) + 1 |
|
|
|
}, |
|
|
|
numberClick(item) { |
|
|
|
this.showModal1 = true |
|
|
|
}, |
|
|
|
|
|
|
|
request() { |
|
|
|
|
|
|
|
var params = { |
|
|
|
customerSid: getApp().globalData.sid, |
|
|
|
sid: this.page.sid, |
|
|
|
} |
|
|
|
|
|
|
|
console.log("request", params); |
|
|
|
|
|
|
|
|
|
|
|
let _this = this |
|
|
|
|
|
|
|
_this.$api.goodsDetail(params).then((resp) => { |
|
|
|
// console.log(resp); |
|
|
|
_this.data = resp |
|
|
|
|
|
|
|
// _this.getAllPriceOrWeight() |
|
|
|
|
|
|
|
_this.$nextTick(() => { |
|
|
|
_this.$refs.pageView.setLoadState(2) |
|
|
|
}) |
|
|
|
}).catch(e => { |
|
|
|
_this.$nextTick(() => { |
|
|
|
_this.$refs.pageView.setLoadState(1) |
|
|
|
}) |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
getAllPriceOrWeight() { |
|
|
|
// let _this = this |
|
|
|
|
|
|
|
// var params = { |
|
|
|
// customerSid: getApp().globalData.sid, |
|
|
|
// brandId: _this.data.brandId, |
|
|
|
// } |
|
|
|
|
|
|
|
// console.log("getGoodsWeight", params); |
|
|
|
|
|
|
|
// _this.$api.getGoodsWeight(params).then((resp) => { |
|
|
|
|
|
|
|
// console.log("getGoodsWeight", resp); |
|
|
|
|
|
|
|
// _this.page.price = resp.totalPrice |
|
|
|
// _this.page.weight = resp.totalWeight |
|
|
|
// _this.page.remarks = resp.remarks |
|
|
|
|
|
|
|
|
|
|
|
// _this.$nextTick(() => { |
|
|
|
// _this.$refs.pageView.setLoadState(2) |
|
|
|
// }) |
|
|
|
|
|
|
|
// }).catch(e => { |
|
|
|
// _this.$nextTick(() => { |
|
|
|
// _this.$refs.pageView.setLoadState(1) |
|
|
|
// }) |
|
|
|
// }) |
|
|
|
}, |
|
|
|
|
|
|
|
inCart() { |
|
|
|
|
|
|
|
// this.data.goodsNumber = Number(this.data.goodsNumber) + 1 |
|
|
|
|
|
|
|
this.upDateShoppCart() |
|
|
|
}, |
|
|
|
upDateShoppCart() { |
|
|
|
var good = { |
|
|
|
goodsSid: this.data.sid, |
|
|
|
goodsName: this.data.name, |
|
|
|
goodsNumber: this.data.goodsNumber, |
|
|
|
affiliation: this.data.brandId, |
|
|
|
price: this.data.mefenPrice, |
|
|
|
weight: this.data.weight, |
|
|
|
customerSid: getApp().globalData.sid |
|
|
|
} |
|
|
|
|
|
|
|
let _this = this |
|
|
|
|
|
|
|
console.log("upDateShoppCart", good); |
|
|
|
|
|
|
|
_this.$api.addShoppingCart(good).then((resp) => { |
|
|
|
_this.shortToast('已加入购物车。') |
|
|
|
_this.getAllPriceOrWeight() |
|
|
|
_this.showModal = false |
|
|
|
uni.navigateBack() |
|
|
|
}).catch(e => { |
|
|
|
_this.showModal = false |
|
|
|
}) |
|
|
|
}, |
|
|
|
settlement() { |
|
|
|
// 支付 |
|
|
|
|
|
|
|
if (this.page.weight < parseInt(this.data.qssl)) { |
|
|
|
this.shortToast('满' + this.data.qssl + '斤才可定制订单商城哦，请继续选菜吧。') |
|
|
|
return |
|
|
|
} |
|
|
|
|
|
|
|
this.showPop() |
|
|
|
|
|
|
|
}, |
|
|
|
showPop() { |
|
|
|
|
|
|
|
this.$refs.inputDialog.open() |
|
|
|
|
|
|
|
this.showPop() |
|
|
|
let timeOut = setInterval(() => { |
|
|
|
|
|
|
|
}, |
|
|
|
showPop() { |
|
|
|
if (this.countdown == 1) { |
|
|
|
this.confirmText = "确定" |
|
|
|
this.countdown = 5 |
|
|
|
this.dialogBeforeClose = false |
|
|
|
clearInterval(timeOut) |
|
|
|
|
|
|
|
this.$refs.inputDialog.open() |
|
|
|
} else { |
|
|
|
this.dialogBeforeClose = true |
|
|
|
this.countdown = this.countdown - 1; |
|
|
|
this.confirmText = "我知道了" + "（" + this.countdown + "s）" |
|
|
|
} |
|
|
|
}, 1000) |
|
|
|
}, |
|
|
|
saveGoods() { |
|
|
|
|
|
|
|
|
|
|
|
var params = { |
|
|
|
customerSid: getApp().globalData.sid, |
|
|
|
// cardNumber: 1, |
|
|
|
brandId: this.data.brandId, |
|
|
|
totalTee: this.page.price, |
|
|
|
|
|
|
|
let timeOut = setInterval(() => { |
|
|
|
// ordOrderDetailsVoList: list |
|
|
|
} |
|
|
|
console.log("params", params); |
|
|
|
|
|
|
|
if (this.countdown == 1) { |
|
|
|
this.confirmText = "确定" |
|
|
|
this.countdown = 5 |
|
|
|
this.dialogBeforeClose = false |
|
|
|
clearInterval(timeOut) |
|
|
|
|
|
|
|
} else { |
|
|
|
this.dialogBeforeClose = true |
|
|
|
this.countdown = this.countdown - 1; |
|
|
|
this.confirmText = "我知道了" + "（" + this.countdown + "s）" |
|
|
|
} |
|
|
|
}, 1000) |
|
|
|
}, |
|
|
|
saveGoods() { |
|
|
|
|
|
|
|
|
|
|
|
var params = { |
|
|
|
customerSid: getApp().globalData.sid, |
|
|
|
// cardNumber: 1, |
|
|
|
brandId: this.data.brandId, |
|
|
|
totalTee: this.page.price, |
|
|
|
let _this = this |
|
|
|
_this.$api.createVegeOrder(params).then((resp) => { |
|
|
|
|
|
|
|
// ordOrderDetailsVoList: list |
|
|
|
} |
|
|
|
console.log("params", params); |
|
|
|
// console.log("resp", resp); |
|
|
|
this.$pay(resp) |
|
|
|
}).catch(e => {}) |
|
|
|
|
|
|
|
let _this = this |
|
|
|
_this.$api.createVegeOrder(params).then((resp) => { |
|
|
|
|
|
|
|
// console.log("resp", resp); |
|
|
|
this.$pay(resp) |
|
|
|
}).catch(e => {}) |
|
|
|
}, |
|
|
|
|
|
|
|
gotoCart() { |
|
|
|
uni.navigateTo({ |
|
|
|
url: 'shoppCart?affiliation=' + this.data.brandId + "&weight=" + this.data.qssl + "&qdxy=" + |
|
|
|
this.data.qdxy |
|
|
|
}) |
|
|
|
}, |
|
|
|
showPop2() { |
|
|
|
|
|
|
|
this.$refs.inputDialog2.open() |
|
|
|
|
|
|
|
}, |
|
|
|
dialogInputConfirm(val) { |
|
|
|
if (this.confirmText == "确定") { |
|
|
|
this.confirmText = "我知道了（5s）", |
|
|
|
this.dialogBeforeClose = true, |
|
|
|
this.countdown = 5 |
|
|
|
this.saveGoods() |
|
|
|
} |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
dialogInputConfirm2(val) { |
|
|
|
console.log(">>>>>>>>>>>", this.dialogBeforeClose2); |
|
|
|
this.dialogBeforeClose2 = false |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
|
onShareAppMessage() { |
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
gotoCart() { |
|
|
|
uni.navigateTo({ |
|
|
|
url: 'shoppCart?affiliation=' + this.data.brandId + "&weight=" + this.data.qssl + "&qdxy=" + |
|
|
|
this.data.qdxy |
|
|
|
}) |
|
|
|
}, |
|
|
|
showPop2() { |
|
|
|
|
|
|
|
this.$refs.inputDialog2.open() |
|
|
|
|
|
|
|
}, |
|
|
|
dialogInputConfirm(val) { |
|
|
|
if (this.confirmText == "确定") { |
|
|
|
this.confirmText = "我知道了（5s）", |
|
|
|
this.dialogBeforeClose = true, |
|
|
|
this.countdown = 5 |
|
|
|
this.saveGoods() |
|
|
|
} |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
dialogInputConfirm2(val) { |
|
|
|
console.log(">>>>>>>>>>>", this.dialogBeforeClose2); |
|
|
|
this.dialogBeforeClose2 = false |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
|
|
|
|
|
|
|
<style> |
|
|
|
uni-page-body, |
|
|
|
page { |
|
|
|
background: #f3f4f6; |
|
|
|
} |
|
|
|
|
|
|
|
/* 弹窗样式 */ |
|
|
|
.model { |
|
|
|
position: absolute; |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
background: #000; |
|
|
|
z-index: 1; |
|
|
|
opacity: 0.5; |
|
|
|
top: 0; |
|
|
|
left: 0; |
|
|
|
} |
|
|
|
|
|
|
|
.modalDlg { |
|
|
|
/* 设置超出滚动 */ |
|
|
|
overflow: auto; |
|
|
|
width: 100%; |
|
|
|
position: fixed; |
|
|
|
top: 70vw; |
|
|
|
left: 0; |
|
|
|
right: 0; |
|
|
|
bottom: 0; |
|
|
|
z-index: 1; |
|
|
|
background-color: #fff; |
|
|
|
border-top-right-radius: 20px; |
|
|
|
border-top-left-radius: 20px; |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
} |
|
|
|
|
|
|
|
.modalDlg4 { |
|
|
|
/* 设置超出滚动 */ |
|
|
|
overflow: auto; |
|
|
|
position: fixed; |
|
|
|
z-index: 2; |
|
|
|
display: flex; |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
top: 0; |
|
|
|
left: 0; |
|
|
|
flex-direction: column; |
|
|
|
justify-content: center; |
|
|
|
align-items: center; |
|
|
|
} |
|
|
|
|
|
|
|
button::after { |
|
|
|
border: 0; |
|
|
|
} |
|
|
|
|
|
|
|
.button1 { |
|
|
|
|
|
|
|
background: #fff; |
|
|
|
color: #666; |
|
|
|
flex: 1; |
|
|
|
border-radius: 0px; |
|
|
|
border-bottom-left-radius: 20px; |
|
|
|
border: 1px solid #eee; |
|
|
|
} |
|
|
|
|
|
|
|
.button2 { |
|
|
|
background: #fff; |
|
|
|
color: #FF9900; |
|
|
|
border-radius: 0px; |
|
|
|
border-bottom-right-radius: 20px; |
|
|
|
flex: 1; |
|
|
|
border: 1px solid #eee; |
|
|
|
} |
|
|
|
uni-page-body, |
|
|
|
page { |
|
|
|
background: #f3f4f6; |
|
|
|
} |
|
|
|
|
|
|
|
/* 弹窗样式 */ |
|
|
|
.model { |
|
|
|
position: absolute; |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
background: #000; |
|
|
|
z-index: 1; |
|
|
|
opacity: 0.5; |
|
|
|
top: 0; |
|
|
|
left: 0; |
|
|
|
} |
|
|
|
|
|
|
|
.modalDlg { |
|
|
|
/* 设置超出滚动 */ |
|
|
|
overflow: auto; |
|
|
|
width: 100%; |
|
|
|
position: fixed; |
|
|
|
top: 70vw; |
|
|
|
left: 0; |
|
|
|
right: 0; |
|
|
|
bottom: 0; |
|
|
|
z-index: 1; |
|
|
|
background-color: #fff; |
|
|
|
border-top-right-radius: 20px; |
|
|
|
border-top-left-radius: 20px; |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
} |
|
|
|
|
|
|
|
.modalDlg4 { |
|
|
|
/* 设置超出滚动 */ |
|
|
|
overflow: auto; |
|
|
|
position: fixed; |
|
|
|
z-index: 2; |
|
|
|
display: flex; |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
top: 0; |
|
|
|
left: 0; |
|
|
|
flex-direction: column; |
|
|
|
justify-content: center; |
|
|
|
align-items: center; |
|
|
|
} |
|
|
|
|
|
|
|
button::after { |
|
|
|
border: 0; |
|
|
|
} |
|
|
|
|
|
|
|
.button1 { |
|
|
|
|
|
|
|
background: #fff; |
|
|
|
color: #666; |
|
|
|
flex: 1; |
|
|
|
border-radius: 0px; |
|
|
|
border-bottom-left-radius: 20px; |
|
|
|
border: 1px solid #eee; |
|
|
|
} |
|
|
|
|
|
|
|
.button2 { |
|
|
|
background: #fff; |
|
|
|
color: #FF9900; |
|
|
|
border-radius: 0px; |
|
|
|
border-bottom-right-radius: 20px; |
|
|
|
flex: 1; |
|
|
|
border: 1px solid #eee; |
|
|
|
} |
|
|
|
</style> |
Mr-Wong-Git
7 days ago