|
|
@@ -3,10 +3,13 @@ |
|
|
|
<div class="detial-container" v-loading="pageLoading" element-loading-text="数据加载中..."> |
|
|
|
<div class="ditial-banner"> |
|
|
|
<div class="main-img"> |
|
|
|
<img :src="formatImg(mainImg)" alt="main-img"> |
|
|
|
<img :src="formatImg(mainImg)" alt="main-img" /> |
|
|
|
</div> |
|
|
|
<div class="main-item"> |
|
|
|
<div class="main-title" :title="productDetail.productName">{{ productDetail.productName }}</div> |
|
|
|
<div |
|
|
|
class="main-title" |
|
|
|
:title="productDetail.productName" |
|
|
|
>{{ productDetail.productName }}</div> |
|
|
|
<div class="main-price"> |
|
|
|
<span class="price-label">价格:</span> |
|
|
|
<span class="price-value">¥{{ productDetail.showPrice }}</span> |
|
|
@@ -15,7 +18,7 @@ |
|
|
|
<span class="mian-detail-span">详情:</span> |
|
|
|
{{ productDetail.productDescription }} |
|
|
|
</div> |
|
|
|
<div class="main-btn"> |
|
|
|
<div class="main-btn" @click="linkCustomerService"> |
|
|
|
<img |
|
|
|
src="~@assets/image/product/consult-icon.png" |
|
|
|
class="consult-icon" |
|
|
@@ -37,13 +40,24 @@ |
|
|
|
<script> |
|
|
|
import "./ProductDetail.scss"; |
|
|
|
import { getByIdServiceProduct } from "@api/index.js"; |
|
|
|
import { parseMarkdown,formatImg } from "@/utils/common"; |
|
|
|
import { parseMarkdown, formatImg } from "@/utils/common"; |
|
|
|
import { mapGetters } from "vuex"; |
|
|
|
export default { |
|
|
|
...mapGetters({ |
|
|
|
currentAccount: "currentAccount", |
|
|
|
}), |
|
|
|
data() { |
|
|
|
return { |
|
|
|
pageLoading: false, |
|
|
|
productDetail:{}, |
|
|
|
mainImg:"", |
|
|
|
productDetail: {}, |
|
|
|
mainImg: "", |
|
|
|
queryParams: { |
|
|
|
token: "50aa11de78ee5cb27381df1679f24e15", // 与后台交互的凭证 |
|
|
|
noCanClose: 0, // PC端是否显示广告 |
|
|
|
uid: "", // 用户ID |
|
|
|
nickName: "", //用户昵称 |
|
|
|
phone: "", //用户手机号 |
|
|
|
}, |
|
|
|
}; |
|
|
|
}, |
|
|
|
mounted() { |
|
|
@@ -64,7 +78,9 @@ export default { |
|
|
|
if (data.status == 0) { |
|
|
|
this.productDetail = data.data; |
|
|
|
let { productMasterImg } = this.productDetail; |
|
|
|
this.mainImg = productMasterImg ? productMasterImg[0] : ""; |
|
|
|
this.mainImg = productMasterImg |
|
|
|
? productMasterImg[0] |
|
|
|
: ""; |
|
|
|
} else if (data.status == 101) { |
|
|
|
} else { |
|
|
|
this.$message.error(data.msg); |
|
|
@@ -77,15 +93,35 @@ export default { |
|
|
|
this.pageLoading = false; |
|
|
|
}); |
|
|
|
}, |
|
|
|
linkCustomerService() { |
|
|
|
console.log(1); |
|
|
|
// 是否登录 |
|
|
|
if (this.currentAccount) { |
|
|
|
this.queryParams.uid = this.currentAccount.accountId; |
|
|
|
this.queryParams.nickName = this.currentAccount.accountName; |
|
|
|
this.queryParams.phone = this.currentAccount.mobilePhone; |
|
|
|
} |
|
|
|
let url = `http://www.parkkf.com/chat/index?`; |
|
|
|
for (let key in this.queryParams) { |
|
|
|
if ( |
|
|
|
this.queryParams[key] !== "" && |
|
|
|
this.queryParams[key] !== undefined && |
|
|
|
this.queryParams[key] !== null |
|
|
|
) { |
|
|
|
url += `&${key}=${this.queryParams[key]}`; |
|
|
|
} |
|
|
|
} |
|
|
|
window.open(url); |
|
|
|
}, |
|
|
|
toPath(path) { |
|
|
|
this.$router.push(path); |
|
|
|
}, |
|
|
|
parseMarkdown(str) { |
|
|
|
return str ? parseMarkdown(str) : ""; |
|
|
|
}, |
|
|
|
formatImg(url){ |
|
|
|
formatImg(url) { |
|
|
|
return formatImg(url); |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
}; |
|
|
|
</script> |