<template>
|
<div class="infoBox">
|
<div class="contentBox">
|
<div class="crumbs">
|
<el-breadcrumb separator-class="el-icon-arrow-right">
|
<el-breadcrumb-item :to="{ name: 'bookStore' }"
|
>数字教材</el-breadcrumb-item
|
>
|
<el-breadcrumb-item>详情</el-breadcrumb-item>
|
</el-breadcrumb>
|
</div>
|
<div class="infoTag" v-if="bookInfo.caupress_projectTitle">
|
<el-tooltip
|
class="item"
|
effect="dark"
|
:content="bookInfo.caupress_projectTitle"
|
placement="top-start"
|
>
|
<div class="tagText">
|
{{ bookInfo.caupress_projectTitle }}
|
</div>
|
</el-tooltip>
|
</div>
|
<div class="bookDetail">
|
<div class="bookImg">
|
<img class="autoImg" :src="bookInfo.icon" alt="" />
|
</div>
|
<span class="iconfont icon-tubiaozhizuo"></span>
|
|
<div class="detailBox">
|
<div class="bookTitle">
|
<div class="bookName" :title="bookInfo.name">
|
{{ bookInfo.name }}
|
</div>
|
<div class="bookTag" :title="bookInfo.caupress_seriesName">
|
{{ bookInfo.caupress_seriesName }}
|
</div>
|
<div class="collectBox">
|
<img
|
@click="collectBook"
|
v-if="bookInfo.isFavourite"
|
class="buyIcon"
|
src="@/assets/images/bookStore/shoucang.svg"
|
style="margin-right: 10px"
|
/>
|
<span
|
@click="collectBook"
|
v-else
|
class="iconfont icon-shoucang"
|
style="margin-right: 10px"
|
>
|
</span>
|
<div
|
class="collectText"
|
@click="collectBook"
|
v-if="bookInfo.isFavourite"
|
>
|
已收藏
|
</div>
|
<div class="collectText" @click="collectBook" v-else>收藏</div>
|
</div>
|
</div>
|
<div class="authorBox">
|
<div class="titleBox1">
|
<div>作者：</div>
|
<div>出版时间：</div>
|
</div>
|
<div class="valueBox">
|
<div>
|
{{ bookInfo.caupress_author ? bookInfo.caupress_author : "-" }}
|
</div>
|
<div>
|
{{
|
bookInfo.caupress_publicationDate
|
? moment(bookInfo.caupress_publicationDate).format(
|
"YYYY-MM-DD"
|
)
|
: "-"
|
}}
|
</div>
|
</div>
|
<div class="titleBox1" style="margin-left: 30px">
|
<div>ISBN：</div>
|
<div>版次：</div>
|
</div>
|
<div class="valueBox">
|
<div>
|
{{ bookInfo.caupress_ISBN ? bookInfo.caupress_ISBN : "-" }}
|
</div>
|
<div>
|
{{
|
bookInfo.caupress_pubNumber
|
? bookInfo.caupress_pubNumber
|
: "-"
|
}}
|
</div>
|
</div>
|
</div>
|
<div class="authorBox" style="box-sizing: border-box">
|
<div class="titleBox1">
|
<div>一级分类：</div>
|
<div>二级分类：</div>
|
</div>
|
<div class="valueBox">
|
<div>全国高等职业教育预防医学专业规划教材</div>
|
<div>二级分类：高等职业教育</div>
|
</div>
|
</div>
|
<div class="purchaseBox">
|
<div class="priceBox">
|
<span v-if="bookInfo.price && bookInfo.price > 0">
|
<span>定价：</span><span>￥</span>
|
<span>{{ this.tool.toDecimal2(bookInfo.price) || "-" }}</span
|
><span v-if="bookInfo.VirtualPrice"
|
>原价：￥{{ bookInfo.VirtualPrice }}</span
|
>
|
</span>
|
|
<span class="price" v-else>
|
<span class="freePrice">免费</span>
|
</span>
|
</div>
|
<div
|
class="buyInfo"
|
v-if="
|
(currentRoute !== 'teachingServices' &&
|
bookInfo.caupress_paperBookDD) ||
|
bookInfo.caupress_paperBookJD ||
|
bookInfo.caupress_paperBookTmall
|
"
|
>
|
纸质书其他购买渠道：
|
<span @click="toJDLink" v-if="bookInfo.caupress_paperBookJD">
|
<img
|
class="buyIcon"
|
src="@/assets/images/bookStore/京东icon-01.svg"
|
/>京东</span
|
>
|
<span @click="toDDLink" v-if="bookInfo.caupress_paperBookDD"
|
><img
|
class="buyIcon"
|
src="@/assets/images/bookStore/当当网.svg"
|
/>当当</span
|
>
|
<span @click="toTmLink" v-if="bookInfo.caupress_paperBookTmall"
|
><img
|
class="buyIcon"
|
src="@/assets/images/bookStore/tianmaologo2.svg"
|
/>天猫</span
|
>
|
</div>
|
</div>
|
<div class="btnBox">
|
<el-button
|
v-if="
|
currentRoute !== 'teachingServices' &&
|
!this.bookInfo.alreadyBuy &&
|
this.bookInfo.caupress_isSell &&
|
this.bookInfo.caupress_isSell == '1'
|
"
|
type="primary"
|
:disabled="this.bookInfo.alreadyBuy"
|
@click="gotoOrder"
|
>电子书购买</el-button
|
>
|
<el-button
|
v-if="bookInfo.caupress_pdfFreeFile && !this.bookInfo.alreadyBuy"
|
type="primary"
|
plain
|
style="min-width: 98px"
|
@click="previewBook"
|
>试读</el-button
|
>
|
<el-button
|
v-else-if="bookInfo.caupress_pdfFile && this.bookInfo.alreadyBuy"
|
type="primary"
|
plain
|
style="min-width: 98px"
|
@click="previewBook"
|
>立即阅读</el-button
|
>
|
<el-button
|
v-if="
|
currentRoute == 'teachingServices' && !this.bookInfo.alreadyBuy
|
"
|
plain
|
@click="addEbook"
|
>电子样书</el-button
|
>
|
<el-button
|
v-if="currentRoute == 'teachingServices'"
|
plain
|
@click="addPaperBook"
|
>纸质样书</el-button
|
>
|
</div>
|
</div>
|
</div>
|
<el-dialog
|
title="联系编辑"
|
:visible.sync="contactVisible"
|
width="30%"
|
:lock-scroll="false"
|
>
|
<div class="contactBox" v-if="this.bookInfo.caupress_editor">
|
<div class="contacItem">
|
<i class="iconfont icon-renwu-ren contacIcon"></i>
|
{{ this.bookInfo.caupress_editor.name }}
|
</div>
|
<div class="contacItem">
|
<i class="iconfont icon-QQ contacIcon"></i>
|
{{ this.bookInfo.caupress_editor.qq }}
|
</div>
|
<div class="contacItem">
|
<i class="iconfont icon-tongxunlu contacIcon"></i>
|
{{ this.bookInfo.caupress_editor.phone }}
|
</div>
|
<div class="contacItem">
|
<i class="iconfont icon-dianhua contacIcon"></i>
|
{{ this.bookInfo.caupress_editor.telephone }}
|
</div>
|
</div>
|
<el-empty
|
v-else
|
description="暂无数据"
|
class="empty"
|
:image-size="100"
|
></el-empty>
|
</el-dialog>
|
<el-dialog
|
title="信息反馈"
|
:visible.sync="dialogVisible"
|
width="50%"
|
:lock-scroll="false"
|
>
|
<div class="infoDialog">
|
<el-input
|
type="textarea"
|
:rows="8"
|
placeholder="详细描述您所遇到的问题，有助于快速给您反馈！"
|
v-model="textarea"
|
>
|
</el-input>
|
<div class="subBtn">
|
<el-button type="primary" @click="sendDiscuss">提交</el-button>
|
</div>
|
<div class="infoList">
|
<div
|
class="infoItem"
|
v-for="(item, index) in commentList"
|
:key="index"
|
>
|
<div class="infoImg">
|
<img v-if="item.icon" class="autoImg" :src="item.icon" alt="" />
|
<i v-else class="el-icon-user-solid"></i>
|
</div>
|
<div class="infoContent">
|
<div class="infoTitle">
|
<div class="userNameBox">{{ item.content.name }}</div>
|
<div class="userNameBox">
|
{{ moment(item.createDate).format("YYYY-MM-DD") }}
|
</div>
|
</div>
|
<div class="infoText">
|
{{ item.content.content }}
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</el-dialog>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import { mapState } from "vuex";
|
|
export default {
|
data() {
|
return {
|
tagText: "普通高等教育十一五规划教材，全国高等教育旅游规划教材",
|
price: 29,
|
dialogVisible: false,
|
contactVisible: false,
|
textarea: "",
|
// bookInfo: {},
|
currentRoute: this.$route,
|
discussAreaId: "", //评论ID
|
|
commentList: [],
|
editor: {
|
qq: "",
|
telephone: "",
|
mobilePhone: "",
|
name: "",
|
},
|
paginationData: {
|
page: 1,
|
limit: 10,
|
totalCount: 0,
|
totalPage: 0,
|
},
|
commentText: "",
|
requestedEBookList: [], // 已申请的电子书
|
requestedPBookList: [], // 已申请的纸质书
|
ebookTotalCount: 0,
|
pbookTotalCount: 0,
|
};
|
},
|
props: {
|
bookInfo: {
|
type: Object,
|
default: () => {},
|
},
|
},
|
created() {
|
console.log(this.userInfo, "userInfo");
|
this.currentRoute = this.currentRoute.fullPath.split("/")[1];
|
this.getCommentTopic();
|
this.getRequestedEBookList();
|
this.getRequestedPBookList();
|
let roleId = this.userInfo ? this.userInfo.roleId : null;
|
if (roleId) {
|
this.getEbookTicketRes();
|
this.getPbookTicketRes();
|
}
|
},
|
computed: {
|
...mapState(["userInfo"]),
|
},
|
mounted() {},
|
methods: {
|
//获取电子书剩余申请次数
|
getEbookTicketRes() {
|
this.MG.app
|
.getTicketResult({
|
ticketRefCodeOrGuid: "electronicSampleBookapplyNum",
|
roleId: this.userInfo.roleId,
|
})
|
.then((res) => {
|
this.ebookTotalCount = res.totalCount - res.usedCount;
|
});
|
},
|
//获取纸质剩余申请次数
|
getPbookTicketRes() {
|
this.MG.app
|
.getTicketResult({
|
ticketRefCodeOrGuid: "paperSampleBookapplyNum",
|
roleId: this.userInfo.roleId,
|
})
|
.then((res) => {
|
this.pbookTotalCount = res.totalCount - res.usedCount;
|
});
|
},
|
//跳转至京东链接
|
toJDLink() {
|
window.open(this.bookInfo.caupress_paperBookJD);
|
},
|
|
//跳转至当当链接
|
toDDLink() {
|
window.open(this.bookInfo.caupress_paperBookDD);
|
},
|
toTmLink() {
|
window.open(this.bookInfo.caupress_paperBookTmall);
|
},
|
//获取评论ID
|
getCommentTopic() {
|
this.MG.ugc
|
.getProductCommentTopic({
|
productId: this.$route.query.id,
|
appRefCode: this.config.appRefCode,
|
})
|
.then((res) => {
|
this.discussAreaId = res.id;
|
this.sysType = res.sysType;
|
this.getCommentList();
|
});
|
},
|
|
//获取评论列表
|
getCommentList() {
|
this.MG.ugc
|
.getTopicMessageList({
|
sort: {
|
type: "Desc",
|
field: "CreateDate",
|
},
|
size: this.paginationData.limit,
|
start: (this.paginationData.page - 1) * this.paginationData.limit,
|
appRefCode: this.config.appRefCode,
|
topicIdOrRefCode: JSON.stringify(this.discussAreaId),
|
})
|
.then((res) => {
|
this.commentList = res.datas;
|
this.commentList.forEach((item) => {
|
if (item.content) {
|
item.content = JSON.parse(item.content);
|
}
|
});
|
console.log(this.commentList, "this.commentList");
|
});
|
},
|
|
//发表评论
|
sendDiscuss() {
|
if (this.textarea == "") {
|
this.$message({
|
showClose: true,
|
message: "评论不能为空",
|
type: "error",
|
});
|
} else {
|
let content = {
|
content: this.textarea,
|
name: this.userInfo.name,
|
};
|
const data = {
|
topicIdOrRefCode: JSON.stringify(this.discussAreaId),
|
name: this.bookInfo.name,
|
icon: this.userInfo.icon,
|
content: JSON.stringify(content),
|
type: "ProductComment",
|
cmsTypeRefCode: "",
|
newDataListRequest: [],
|
};
|
this.MG.ugc.newTopicMessage(data).then((res) => {
|
this.$message({
|
showClose: true,
|
message: "评论成功",
|
type: "success",
|
});
|
this.textarea = "";
|
this.getCommentList();
|
});
|
}
|
},
|
relation() {
|
this.contactVisible = true;
|
},
|
setInfo() {
|
if (this.userInfo == null) {
|
this.$router.push({
|
path: "/login",
|
query: {
|
redirectPath: this.$route.fullPath,
|
},
|
});
|
return;
|
}
|
this.dialogVisible = true;
|
},
|
//加入纸质样书
|
addPaperBook() {
|
if (!this.$store.state.token) {
|
this.$router.push({
|
path: "/login",
|
query: {
|
redirectPath: this.$route.fullPath,
|
},
|
});
|
} else {
|
if (this.$store.state.userInfo.role !== "Teacher") {
|
this.$message({
|
showClose: true,
|
message: "请先进行教师认证",
|
type: "warning",
|
});
|
return;
|
} else {
|
if (this.pbookTotalCount == 0) {
|
this.$message({
|
showClose: true,
|
message: "纸质书申请次数不足！",
|
type: "warning",
|
});
|
return;
|
}
|
let isHave = this.requestedPBookList.find(
|
(e) => e.state == "WaitAudit" && e.id == this.bookInfo.id
|
);
|
if (isHave) {
|
this.$message.warning("您已申请该样书，等待审核中!");
|
return false;
|
}
|
if (this.$store.state.paperCopiesList.length >= 3) {
|
this.$message.warning("添加书籍不能超过三本");
|
return;
|
}
|
if (this.$store.state.paperCopiesList.length > 0) {
|
let currentBook = this.$store.state.paperCopiesList.filter(
|
(item) => item.id == this.bookInfo.id
|
);
|
if (currentBook.length > 0) {
|
this.$message.warning("请勿重复添加书籍");
|
return;
|
} else {
|
this.$store.commit("addPbookList", this.bookInfo);
|
this.$message.success("添加成功！");
|
}
|
} else {
|
this.$store.commit("addPbookList", this.bookInfo);
|
this.$message.success("添加成功！");
|
}
|
}
|
}
|
},
|
// 获取已申请的电子书
|
getRequestedEBookList() {
|
const data = {
|
start: 0,
|
size: 99999999,
|
appRefCode: this.config.appRefCode,
|
topicIdOrRefCode: this.config.refCodes.applyBook,
|
};
|
this.MG.ugc.getTopicMessageList(data).then((res) => {
|
try {
|
if (res && res.datas.length > 0) {
|
let list = [];
|
for (let i = 0; i < res.datas.length; i++) {
|
const ele = res.datas[i];
|
if (ele.content) {
|
ele.content = JSON.parse(ele.content);
|
ele.content.map((item) => (item.state = ele.state));
|
}
|
if (ele.feedBack) {
|
ele.isRead = false;
|
ele.feedBack = JSON.parse(ele.feedBack);
|
const readDate = new Date(
|
ele.feedBack.endDate + " 23:59:59"
|
).getTime();
|
const currentDate = Number(sessionStorage.currentDate);
|
if (readDate > currentDate) {
|
ele.isRead = true;
|
}
|
}
|
list.push(...ele.content);
|
}
|
this.requestedEBookList = list;
|
}
|
} catch (error) {
|
this.requestedEBookList = [];
|
}
|
});
|
},
|
// 获取已申请的纸质书
|
getRequestedPBookList() {
|
const data = {
|
start: 0,
|
size: 99999999,
|
appRefCode: this.config.appRefCode,
|
topicIdOrRefCode: this.config.refCodes.applyEntityBook,
|
};
|
this.MG.ugc.getTopicMessageList(data).then((res) => {
|
try {
|
if (res && res.datas.length > 0) {
|
let list = [];
|
for (let i = 0; i < res.datas.length; i++) {
|
const ele = res.datas[i];
|
if (ele.content) {
|
ele.content = JSON.parse(ele.content);
|
ele.content.map((item) => (item.state = ele.state));
|
}
|
list.push(...ele.content);
|
}
|
this.requestedPBookList = list;
|
}
|
} catch (error) {
|
this.requestedPBookList = [];
|
}
|
});
|
},
|
//加入电子样书
|
addEbook() {
|
if (!this.$store.state.token) {
|
this.$router.push({
|
path: "/login",
|
query: {
|
redirectPath: this.$route.fullPath,
|
},
|
});
|
} else {
|
console.log(this.ebookTotalCount, "this.ebookTotalCount");
|
console.log(this.pbookTotalCount, "this.pookTotalCount");
|
if (this.$store.state.userInfo.role !== "Teacher") {
|
this.$message({
|
showClose: true,
|
message: "请先进行教师认证",
|
type: "warning",
|
});
|
|
return;
|
}
|
if (this.ebookTotalCount == 0) {
|
this.$message({
|
showClose: true,
|
message: "电子书申请次数不足！",
|
type: "warning",
|
});
|
return;
|
} else {
|
if (this.bookInfo.alreadyBuy) {
|
this.$message.warning("本书已在有效期内，请勿重复申请");
|
return;
|
}
|
let isHave = this.requestedEBookList.find(
|
(e) => e.state == "WaitAudit" && e.id == this.bookInfo.id
|
);
|
if (isHave) {
|
this.$message.warning("您已申请该样书，等待审核中!");
|
return false;
|
}
|
if (this.$store.state.electronicBookList.length >= 3) {
|
this.$message.warning("添加书籍不能超过三本");
|
return;
|
}
|
if (this.$store.state.electronicBookList.length > 0) {
|
let currentBook = this.$store.state.electronicBookList.filter(
|
(item) => item.id == this.bookInfo.id
|
);
|
if (currentBook.length > 0) {
|
this.$message.warning("请勿重复添加书籍");
|
return;
|
} else {
|
this.$store.commit("addEbookList", this.bookInfo);
|
this.$message.success("添加成功！");
|
}
|
} else {
|
this.$store.commit("addEbookList", this.bookInfo);
|
this.$message.success("添加成功！");
|
}
|
}
|
}
|
},
|
gotoOrder() {
|
if (this.$store.state.token) {
|
let saleMethod = this.bookInfo.saleMethod.find(
|
(item) => item.Type == "defaultSaleMethod"
|
);
|
if (saleMethod) {
|
console.log(saleMethod, "saleMethod");
|
this.MG.store
|
.initOrder({
|
requests: [
|
{
|
saleMethodId: saleMethod.Id,
|
count: 1,
|
},
|
],
|
})
|
.then((res) => {
|
console.log(res, "res");
|
if (res.orderNumber) {
|
this.$router.push({
|
name: "bookStore-order",
|
query: {
|
orderNum: res.orderNumber,
|
},
|
});
|
} else {
|
this.$message.warning("当前书籍销售方式过期，请联系管理员！");
|
}
|
});
|
} else {
|
this.$message({
|
message: "未获取到可售卖的规格，请联系管理员！",
|
type: "error",
|
});
|
}
|
} else {
|
this.$router.push({
|
path: "/login",
|
query: {
|
redirectPath: this.$route.fullPath,
|
},
|
});
|
}
|
},
|
collectBook() {
|
if (this.tool.getCookie(this.config.tokenKey)) {
|
if (this.bookInfo.isFavourite) {
|
this.MG.store
|
.delProductLink({
|
productIds: [this.$route.query.id],
|
linkType: "Favorite",
|
})
|
.then((res) => {
|
this.$parent.getData();
|
});
|
} else {
|
let params = {
|
productIds: [this.$route.query.id],
|
linkType: "Favorite",
|
};
|
if (this.$route.path == "/bookStore/detail") {
|
params.LinkTag = "bookStore";
|
} else {
|
params.LinkTag = "teachingServices";
|
}
|
this.MG.store.productLink(params).then((res) => {
|
this.$parent.getData();
|
});
|
}
|
} else {
|
this.$router.push({
|
path: "/login",
|
query: {
|
redirectPath: this.$route.fullPath,
|
},
|
});
|
}
|
},
|
previewBook() {
|
let routeUrl = this.$router.resolve({
|
name: "preview-pdf",
|
query: {
|
md5: this.bookInfo.alreadyBuy
|
? this.bookInfo.caupress_pdfFile
|
: this.bookInfo.caupress_pdfFreeFile,
|
titleName: this.bookInfo.name,
|
productLinkPath: this.bookInfo.productLinkPath,
|
},
|
});
|
window.open(routeUrl.href, "_blank");
|
},
|
},
|
};
|
</script>
|
|
<style scoped>
|
.infoBox {
|
width: 100%;
|
height: 530px;
|
padding-top: 10px;
|
background-color: #fff;
|
background-image: url("@/assets/images/xiehe/detail/details_bg.png");
|
}
|
.infoTag {
|
position: relative;
|
width: 0px;
|
height: 0px;
|
border-right: 20px solid #fff;
|
border-left: 503px solid #e50021;
|
border-top: 19px solid #e50021;
|
border-bottom: 19px solid #e50021;
|
}
|
.tagText {
|
position: absolute;
|
left: -480px;
|
top: -9.5px;
|
max-width: 480px;
|
text-overflow: ellipsis;
|
color: #fff;
|
font-size: 18px;
|
overflow: hidden;
|
white-space: nowrap;
|
}
|
.bookDetail {
|
display: flex;
|
overflow: hidden;
|
margin-top: 30px;
|
}
|
.bookImg {
|
position: relative;
|
width: 338px;
|
height: 400px;
|
box-shadow: 2px 2px 10px #f2f2f2;
|
}
|
.detailBox {
|
flex: 1;
|
height: 450px;
|
position: relative;
|
margin-top: 20px;
|
overflow: hidden;
|
}
|
.collectBox {
|
position: absolute;
|
right: 80px;
|
font-size: 14px;
|
color: #999999;
|
cursor: pointer;
|
}
|
|
.collectBox span:nth-child(1) {
|
margin-right: 10px;
|
font-size: 16px;
|
}
|
.collectBox span:nth-child(2) {
|
margin-left: 10px;
|
margin-right: 10px;
|
|
font-size: 16px;
|
}
|
.iconfont {
|
font-size: 25px !important;
|
vertical-align: middle;
|
}
|
.bookTitle {
|
width: 100%;
|
height: 40px;
|
line-height: 40px;
|
padding-left: 100px;
|
display: flex;
|
padding-right: 240px;
|
box-sizing: border-box;
|
}
|
.collectText {
|
font-size: 16px;
|
line-height: 25px;
|
display: inline-block;
|
}
|
.bookName {
|
flex: 1;
|
font-size: 26px;
|
color: #333;
|
text-overflow: ellipsis;
|
white-space: nowrap;
|
overflow: hidden;
|
}
|
.bookTag {
|
max-width: 200px;
|
font-size: 16px;
|
color: #333;
|
line-height: 36px;
|
margin-left: 15px;
|
text-overflow: ellipsis;
|
white-space: nowrap;
|
overflow: hidden;
|
}
|
.authorBox {
|
width: 80%;
|
display: flex;
|
padding: 20px;
|
padding-left: 100px;
|
position: relative;
|
}
|
.valueBox {
|
margin-left: 20px;
|
}
|
.valueBox div {
|
height: 30px;
|
}
|
.titleBox1 div {
|
height: 30px;
|
}
|
.relationBox {
|
position: absolute;
|
right: 50px;
|
color: #999;
|
cursor: pointer;
|
font-size: 14px;
|
}
|
.purchaseBox {
|
margin-left: 100px;
|
padding-top: 20px;
|
}
|
.priceBox {
|
border-bottom: 1px dashed #ececec;
|
background-color: #B2D9C8;
|
height: 50px;
|
line-height: 50px;
|
padding-left: 20px;
|
}
|
.priceBox span:nth-child(1) {
|
color: #000;
|
font-weight: 700;
|
font-size: 16px;
|
padding-right: 20px;
|
}
|
.priceBox span:nth-child(2) {
|
color: #e50021;
|
font-size: 16px;
|
}
|
.priceBox span:nth-child(3) {
|
color: #e50021;
|
font-size: 22px;
|
font-weight: 700;
|
padding-right: 20px;
|
}
|
.priceBox span:nth-child(4) {
|
color: #333;
|
font-size: 16px;
|
padding-right: 20px;
|
text-decoration: line-through;
|
}
|
.buyInfo {
|
padding: 20px 0px;
|
border-bottom: 1px dashed #ececec;
|
cursor: pointer;
|
}
|
.buyInfo img {
|
margin-left: 10px;
|
}
|
.btnBox {
|
margin-left: 100px;
|
margin-top: 30px;
|
}
|
.infoItem {
|
display: flex;
|
margin-top: 40px;
|
}
|
.infoImg {
|
width: 50px;
|
height: 50px;
|
border-radius: 50%;
|
border: 1px solid #ccc;
|
background: #efefef;
|
text-align: center;
|
line-height: 60px;
|
position: relative;
|
}
|
.infoImg i {
|
font-size: 28px;
|
}
|
.infoList {
|
margin-top: 20px;
|
overflow: auto;
|
}
|
.infoContent {
|
flex: 1;
|
overflow: hidden;
|
padding: 0 20px 0 10px;
|
}
|
.infoDialog {
|
padding: 20px;
|
}
|
.infoTitle {
|
width: 100%;
|
display: flex;
|
justify-content: space-between;
|
}
|
.infoText {
|
margin-top: 24px;
|
line-height: 20px;
|
}
|
.contactBox {
|
padding: 0px 40px;
|
}
|
.contacItem {
|
margin-top: 20px;
|
}
|
.contacIcon {
|
padding-right: 20px;
|
}
|
.subBtn {
|
margin-top: 20px;
|
text-align: right;
|
}
|
.buyIcon {
|
width: 24px;
|
height: 24px;
|
vertical-align: middle;
|
}
|
.crumbs {
|
margin-top: 10px;
|
border-bottom: 1px solid rgba(20, 73, 65, 0.26);
|
padding-bottom: 20px;
|
}
|
</style>
|
