Files
sociology_app/pages/goods/index/index.vue
2024-10-09 10:38:59 +08:00

2184 lines
58 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<view class="container commonPageBox commonDetailPage">
<!-- 公共组件-每个页面必须引入 -->
<public-module></public-module>
<z-nav-bar title="商品详情" bgColor="#3AB3AE" fontColor="#fff"></z-nav-bar>
<view
class="contentBox commonPageContentBox"
v-if="!this.$store.state.loadingShow"
>
<!-- :indicator-dots="true" -->
<swiper
:autoplay="true"
:interval="3000"
:duration="1000"
style="width: 100%; height: 750rpx; background-color: #f5f5f5"
>
<swiper-item
v-for="(item, index) in swiperList"
:key="index"
style="width: 100%; height: 100%"
>
<!-- <image :src="curriculumData.explainsImg" mode="widthFix" class="headImage"></image> -->
<image
:src="item"
mode="aspectFit"
style="width: 100%; height: 100%"
@click="previewImage(item)"
>
</image>
</swiper-item>
</swiper>
<view class="goods_box">
<view class="curriulum_title_box">
<view v-if="this.options.isMiaosha == 1" class="miaosha_box">
<view class="price_box">
<view class="price_left">
<template
v-if="
curriculumData.activityPrice &&
curriculumData.activityPrice > 0
"
>
<text class="aui-text-danger price">
¥{{ curriculumData.activityPrice }}
</text>
<text class="price original_price"
>原价:¥{{ curriculumData.price }}
</text>
</template>
<template v-else>
<text class="aui-text-danger price">
¥{{ curriculumData.price }}
</text>
</template>
<view class="price original_price sales_number"
>已售 {{ curriculumData.sumSales }}件
</view>
</view>
<view class="xianshimaiosha_box">
<text class="xianshimaiosha">秒杀商品</text>
<!-- <view class="countdown">
<text style="margin-right: 8rpx;">距结束</text>
<uni-countdown :day="1" :hour="2" :minute="30" :second="0" color="#FFFFFF"
:font-size="12" backgroundColor="#000" />
</view> -->
</view>
</view>
<view class="curriulum_title"
>{{ curriculumData.productName }}
</view>
</view>
<view v-else class="normal_box">
<view class="price_box">
<template
v-if="
curriculumData.activityPrice &&
curriculumData.activityPrice > 0
"
>
<text class="aui-text-danger price">
¥{{ curriculumData.activityPrice }}
</text>
<text class="price original_price"
>原价:¥{{ curriculumData.price }}
</text>
</template>
<template v-else>
<text class="aui-text-danger price">
¥{{ curriculumData.price }}
</text>
</template>
<text
class="price original_price sales_number"
style="float: right"
>已售 {{ curriculumData.sumSales }}件
</text>
</view>
<view class="curriulum_title" style="margin-top: 40rpx"
>{{ curriculumData.productName }}
</view>
</view>
<view class="price_box"> </view>
</view>
</view>
<template>
<common-sticky
label="title"
:itemStyle="`width:${
cateList.length == 2 ? '50' : '33'
}%;padding-left: 15px; padding-right: 15px; height: 68rpx;`"
:list="cateList"
:currentCateIndex="currentCateIndex"
@handleselectCate="handleselectCate"
>
</common-sticky>
</template>
<!-- <view :class="`priceDetail`" v-if="this.statusList[this.currentStatusIndex].type == 'price'">
<scroll-view scroll-y="true" class="scroll-Y">
<price ref="priceDetail" type="price" :oid="this.statusList[this.currentStatusIndex].oid"></price>
</scroll-view>
</view>
<view :class="`priceDetail`" v-else-if="this.statusList[this.currentStatusIndex].type == 'purchaseNotice'">
<scroll-view scroll-y="true" class="scroll-Y">
<price ref="purchaseNotice" :oid="this.statusList[this.currentStatusIndex].oid"></price>
</scroll-view>
</view>
-->
<view :class="`dataList `">
<view
class="goods_detail_list_title bg_box_shandow color_shandow bg_color PM_font"
style="background-color: #d8f8e4"
>
<view class="left">
<u-icon
name="grid"
color="#018F89"
size="23"
style="display: inline-block; margin-right: 10rpx"
></u-icon>
商品规格</view
>
<text class="right" @click="openPopup"
>共{{ goodsList.length }}种商品可选择</text
>
</view>
<common-goods-list
imgUrl="url"
isNoIcon
imgMode="aspectFit"
class="color_shandow"
defaultUrl=""
:isCondition="true"
:dataList="goodsList"
@hancleClick="selectGoods"
label="title"
>
<template slot="labelSlot" slot-scope="slotProps">
<!-- isSelectGoods -->
<view
class="related_courses_name goodsList"
:class="`goods_item ${
selectGoodsData &&
selectGoodsData.productId == slotProps.row.productId
? ''
: ''
}`"
>
<view class="image_box">
<image
:src="slotProps.row.productImages"
mode="aspectFit"
class="goods_image"
></image>
</view>
</view>
<!-- <text v-if="slotProps.row.conditions!='03'">【试听】</text> -->
</template>
<!-- <template slot="rightSlot" slot-scope="slotProps">
<view v-if="slotProps.row.surplusNum" class="related_courses_right">
<view class="progress_icon" style=""><u-line-progress activeColor="#3AB3AE" height="14"
:percentage="30" :showText="false" showText></u-line-progress></view>
<view
:class="slotProps.row.surplusNum < 30 ? 'aui-text-danger dateReminder' : 'dateReminder'">
距&nbsp;{{ slotProps.row.surplusNum }}&nbsp;天到期</view>
</view>
<view v-if="slotProps.row.inType == '03'" class="fdButtonBox">
<u-button type="primary" :plain="true" text="复读一月" :customStyle="fdButtonStyle" size="small"
@click.native.stop="fnRelearn(slotProps.row.inType, 30, slotProps.row.courseFee)"></u-button>
<u-button type="primary" :plain="true" text="复读三月" :customStyle="fdButtonStyle" size="small"
@click.native.stop="fnRelearn(slotProps.row.inType, 90, slotProps.row.courseFee)"></u-button>
</view>
<view>
</view>
</template> -->
</common-goods-list>
</view>
<view :class="`dataList parameterList`" v-if="booksList.length > 0">
<view
class="goods_detail_list_title bg_box_shandow color_shandow bg_color PM_font"
>
<view class="left" style="color: #018f89 !important">
<u-icon
name="list"
color="#018F89"
size="23"
style="display: inline-block; margin-right: 10rpx"
></u-icon>
书籍信息</view
>
</view>
<common-list
imgUrl="url"
isNoIcon
imgMode="aspectFit"
class="color_shandow parameter_box book_box"
defaultUrl=""
:isCondition="true"
:dataList="booksList"
label="title"
>
<template slot="labelSlot" slot-scope="slotProps">
<!-- isSelectGoods -->
<view class="related_courses_name" :class="`goods_item `">
<view class="image_box" style="margin-right: 10rpx">
<image
:src="slotProps.row.images"
mode="aspectFit"
class="goods_image"
></image>
</view>
<view :class="`goods_info `">
<view class="name">
<text style="color: #333"> {{ slotProps.row.name }}</text>
</view>
</view>
</view>
<!-- <text v-if="slotProps.row.conditions!='03'">【试听】</text> -->
</template>
</common-list>
</view>
<view :class="`dataList parameterList`" v-if="coursesList.length > 0">
<view
class="goods_detail_list_title bg_box_shandow color_shandow bg_color PM_font"
>
<view class="left" style="color: #018f89 !important">
<u-icon
name="list"
color="#018F89"
size="23"
style="display: inline-block; margin-right: 10rpx"
></u-icon>
课程信息</view
>
</view>
<common-list
imgUrl="url"
isNoIcon
imgMode="aspectFit"
class="color_shandow parameter_box"
defaultUrl=""
:isCondition="true"
:dataList="coursesList"
label="title"
>
<template slot="labelSlot" slot-scope="slotProps">
<!-- isSelectGoods -->
<view class="related_courses_name" :class="`goods_item `">
<view class="image_box" style="margin-right: 10rpx">
<image
:src="slotProps.row.images"
mode="aspectFit"
class="goods_image"
></image>
</view>
<view :class="`goods_info `">
<view class="name">
<text style="color: #333"> {{ slotProps.row.title }}</text>
</view>
</view>
</view>
<!-- <text v-if="slotProps.row.conditions!='03'">【试听】</text> -->
</template>
</common-list>
</view>
<u-divider
text="商品参数"
:hairline="true"
textColor="#333"
lineColor="#b0b0b0"
></u-divider>
<view class="parameter_info_box">
<common-list
imgUrl="url"
isNoIcon
imgMode="aspectFit"
class="parameter_box parameter_info"
defaultUrl=""
:isCondition="true"
:dataList="parameterList"
@hancleClick="selectGoods"
label="name"
>
<template slot="labelSlot" slot-scope="slotProps">
<!-- isSelectGoods -->
<view
class="related_courses_name"
:class="`goods_item ${
selectGoodsData &&
selectGoodsData.productId == slotProps.row.productId
? ''
: ''
}`"
>
<view :class="`goods_info `">
<view class="name">
<text style="color: #333"> {{ slotProps.row.name }}</text>
<text v-if="slotProps.row.isTime">
{{ slotProps.row.value | formatDate }}</text
>
<text v-else> {{ slotProps.row.value }}</text>
</view>
</view>
</view>
<!-- <text v-if="slotProps.row.conditions!='03'">【试听】</text> -->
</template>
<!-- <template slot="rightSlot" slot-scope="slotProps">
<view v-if="slotProps.row.surplusNum" class="related_courses_right">
<view class="progress_icon" style=""><u-line-progress activeColor="#3AB3AE" height="14"
:percentage="30" :showText="false" showText></u-line-progress></view>
<view
:class="slotProps.row.surplusNum < 30 ? 'aui-text-danger dateReminder' : 'dateReminder'">
距&nbsp;{{ slotProps.row.surplusNum }}&nbsp;天到期</view>
</view>
<view v-if="slotProps.row.inType == '03'" class="fdButtonBox">
<u-button type="primary" :plain="true" text="复读一月" :customStyle="fdButtonStyle" size="small"
@click.native.stop="fnRelearn(slotProps.row.inType, 30, slotProps.row.courseFee)"></u-button>
<u-button type="primary" :plain="true" text="复读三月" :customStyle="fdButtonStyle" size="small"
@click.native.stop="fnRelearn(slotProps.row.inType, 90, slotProps.row.courseFee)"></u-button>
</view>
<view>
</view>
</template> -->
</common-list>
</view>
<u-divider
text="商品详情"
:hairline="true"
textColor="#333"
lineColor="#b0b0b0"
></u-divider>
<view class="small_class_teaching_box" style="background-color: #b7e0e2">
<view class="common_divider divider_box"> </view>
<common-rich-detail :detailInfo="detailInfo" style="padding: 10rpx">
<template #richHeadImg>
<!-- <image :src="curriculumData.imgUrl" mode="widthFix" class="headImage"></image> -->
<!-- <image :src="detailInfo.imgUrl" v-if="detailInfo.imgUrl" mode="widthFix" class="headImage"></image> -->
</template>
</common-rich-detail>
<!-- <view class="small_class_teaching_top">
<view class="small_class_teaching_top_left">
<image src="@/static/icon/course_ic.png" mode="aspectFil" class="icon1"></image>
<text>小班教学</text>
</view>
<text>{{ curriculumInfo.remainingDays }}</text>
</view> -->
<view class="small_class_teaching_content">
<!-- <view class="top">
<view class="top_item" v-for="(v, i) in teachingList">
{{ v.title }}
</view>
</view> -->
<!-- <view class="schedule">
<view class="icon_box">
<image src="@/static/icon/course_07.png" mode="aspectFil" class="icon1">学习进度</image>
</view>
<view class="progress_box">
<view class="progress_icon" style=""><u-line-progress activeColor="#3AB3AE" height="18"
:percentage="30" :showText="false" showText></u-line-progress></view>
<image src="@/static/icon/curriculum_05.png" mode="aspectFil" class="icon1" />
<image src="@/static/icon/curriculum_07.png" mode="aspectFil" class="icon2" />
</view>
</view> -->
</view>
</view>
<view
class="small_class_teaching_box related_courses_box"
v-if="relatedCoursesList.length > 0"
>
<view class="small_class_teaching_top">
<view class="small_class_teaching_top_left">
<image
src="@/static/icon/course_ic.png"
mode="aspectFil"
class="icon1"
></image>
<text>相关课程</text>
</view>
</view>
<view class="small_class_teaching_content">
<common-curriculum-list
imgUrl="url"
:isCondition="true"
:dataList="relatedCoursesList"
@hancleClick="goCourseDescription"
label="title"
>
<template slot="labelSlot" slot-scope="slotProps">
<view class="related_courses_name hidden1">{{
slotProps.row.title
}}</view>
<!-- <text v-if="slotProps.row.conditions!='03'">【试听】</text> -->
</template>
<template slot="rightSlot" slot-scope="slotProps">
<!-- {{ slotProps.row.bxType }} -->
<text class="aui-text-danger">
¥{{ slotProps.row.courseFee }}</text
>
<view> </view>
</template>
</common-curriculum-list>
</view>
</view>
</view>
<view class="goods_nav_box" v-if="!this.$store.state.loadingShow">
<uni-goods-nav
:fill="true"
:options="buyOptions"
:button-group="customButtonGroup1"
@click="onHandleClickBuy"
@buttonClick="onHandleClickBuy1"
/>
</view>
<!--
<u-modal
:show="show"
:title="modalInfo.title"
:content="modalInfo.content"
showCancelButton
@confirm="hancleModalConfirm"
@cancel="hancleModalCancel"
></u-modal> -->
<common-select-goods
ref="commonSelectGoods"
:selectGoodsData="selectGoodsData"
:goodsList="goodsList"
:buyOptions="buyOptions"
:customButtonGroup1="customButtonGroup1"
@selectGoods="selectGoods"
@onHandleClickBuy="onHandleClickBuy"
></common-select-goods>
<u-popup
:show="showInfo"
mode="bottom"
@close="closeShowInfo"
class="popup_box"
>
<view class="popup_top">
<view class="product_image">
<image
:src="selectGoodsData.productImages"
mode="aspectFit"
class="goods_image"
></image>
</view>
<view class="title">已选:{{ selectGoodsData.productName }}</view>
</view>
<view :class="`common_radius_box goods_box popup_content`">
<view class="title title_box"
><text class="title_price">¥{{ selectGoodsData.price }}</text
><u-icon
name="close"
color="#333"
size="18"
@click="close"
style="display: inline-block"
></u-icon
></view>
<view class="title title_list"
><text>商品列表({{ goodsList.length }}</text></view
>
<common-list
imgUrl="url"
isNoIcon
imgMode="aspectFit"
defaultUrl=""
:isCondition="true"
:dataList="goodsList"
@hancleClick="selectGoods"
label="title"
>
<template slot="labelSlot" slot-scope="slotProps">
<!-- isSelectGoods -->
<view
class="related_courses_name"
:class="`goods_item ${
selectGoodsData &&
selectGoodsData.productId == slotProps.row.productId
? 'isSelectGoods color_shandow'
: ''
}`"
>
<view class="image_box" style="margin-right: 10rpx">
<image
:src="slotProps.row.productImages"
mode="aspectFit"
class="goods_image"
></image>
</view>
<view :class="`goods_info `">
<view class="name">{{ slotProps.row.productName }}</view>
<view class="price" style="color: #3ab3ae">{{
slotProps.row.price
}}</view></view
>
</view>
<!-- <text v-if="slotProps.row.conditions!='03'">【试听】</text> -->
</template>
</common-list>
<view class="goods_nav_box">
<uni-goods-nav
:fill="true"
:options="buyOptions"
:button-group="customButtonGroup1"
@click="onHandleClickBuy"
@buttonClick="onHandleClickBuy"
/>
</view>
<!-- <view>
<text @click="handleClickClose">取消</text>
<text @click="handleClickGoBuy">立即购买</text>
</view>-->
</view>
</u-popup>
<z-navigation></z-navigation>
</view>
</template>
<script>
import courseDescription from "@/pages/component/commonComponents/list";
import $http from "@/config/requestConfig.js";
import { mapState } from "vuex";
export default {
components: {
courseDescription, //课程说明
},
data() {
return {
detailInfo: {},
showInfo: false,
selectGoodsData: {},
parameterList: [],
booksList: [],
coursesList: [],
buyOptions: [
// {
// icon: 'chat',
// text: '客服'
// },
// {
// icon: "shop",
// text: "店铺",
// // info: 2,
// infoBackgroundColor: "#007aff",
// infoColor: "#f5f5f5",
// },
// {
// icon: 'cart',
// text: '购物车',
// info: 2
// }
],
swiperList: [],
goodsList: [],
options: {},
relatedCoursesList: [], //相关课程
curriculumData: {},
curriculumInfo: {},
detailInfo: {},
fdButtonStyle: {
width: "120rpx",
"border-color": "#3AB3AE",
color: "#3AB3AE",
float: "right",
"margin-right": "20rpx",
"margin-left": "30rpx",
},
modalInfo: {},
show: false,
playData: {},
taiHuClassInfo: {},
searchValue: "",
teachingList: [
{
title: "临床实践",
type: "02",
apiUrl: "app/phoneDoctor.do?getTaiHuToShine",
},
{
title: "学习问答",
type: "03",
oid: "8a9fb99809e4428888aad6b56a3096a6",
},
{
title: "学习心得",
type: "01",
},
{
title: "在线作业",
type: "04",
oid: "d0f47071c2194e94845fbb373d06f59d",
},
], // 一级分类标题1
cateList: [], // 一级分类标题1
twoCateList: [], // 二级分类标题
dataList: [], // 方剂标题
allDataList: [], // 方剂标题
currentStatusIndex: 0, // 当前选中的一级分类
currentCateIndex: 0, // 当前选中的一级分类
curTwoCateIndex: 0, // 当前选中的二级分类
searchList: [], // 搜索结果数组
showSearchList: false,
userMes: {}, // 用户信息
searchDisable: false, // 搜索不可用
limitShow: false,
limitTitle: "提示",
limitContent: "",
scrollViewHeight: 0,
urlList: {
list: "app/phone.do?getCourseDetail_new",
curriculumInfo: "app/phone.do?getCourseInfo",
goodsList: "book/shopproduct/getGlProductList",
},
customButtonGroup1: [
{
with: 200,
text: "立即购买",
backgroundColor: "linear-gradient(90deg, #FE6035, #EF1224)",
color: "#fff",
},
],
};
},
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) {
//控制小程序中图片大小
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:inline-block;margin:10rpx auto;"'
);
return newContent;
},
// 时间格式化
formatDate(date) {
console.log(date);
let newDate = new Date(date);
let year = newDate.getFullYear();
let month = newDate.getMonth().toString().padStart(2, 0);
let day = newDate.getDay().toString().padStart(2, 0);
return year + "-" + month + "-" + day;
},
},
onLoad(options) {
this.options = options;
// this.handleClickGetGoodsList();
// this.getUserInfo()
// this.getCateList()
},
onHide() {
this.selectGoodsData = {};
this.$refs.commonSelectGoods.close();
// this.showSearchList = false
// this.searchList = []
},
onUnload() {
this.selectGoodsData = {};
this.$refs.commonSelectGoods.close();
this.show = false;
// this.showSearchList = false
// this.searchList = []
},
onShow() {
if (this.options.type == "visitor") {
this.urlList.detailInfo = "visitor/getProductDetail";
} else {
this.urlList.detailInfo = "sociology/product/getProductDetail";
}
this.selectGoodsData = {};
this.getCourseDescriptionData();
this.show = false;
},
computed: {
...mapState(["userInfo"]),
},
methods: {
closeShowInfo() {
this.showInfo = false;
},
openBookInfo() {
this.showInfo = true;
},
openPopup() {
if (this.options.type == "visitor") {
console.log("this.options.type at line 1090:", this.options.type);
uni.showModal({
content: "登陆后可购买本商品",
confirmText: "去登录",
cancelText: "再逛逛", confirmColor:'#018f89',//确定按钮颜色
success(res) {
if (res.confirm) {
uni.navigateTo({
url: "/pages/user/login/login",
});
}
},
});
return;
}
// this.selectGoodsData = this.goodsList[0];
this.$refs.commonSelectGoods.open();
// this.show = true;
this.$forceUpdate();
},
close() {
this.show = false;
},
selectGoods(data) {
if (this.options.type == "visitor") {
console.log("this.options.type at line 1090:", this.options.type);
uni.showModal({
content: "登陆后可购买本商品",
confirmText: "去登录",
cancelText: "再逛逛", confirmColor:'#018f89',//确定按钮颜色
success(res) {
if (res.confirm) {
uni.navigateTo({
url: "/pages/user/login/login",
});
}
},
});
return;
}
this.selectGoodsData = data;
this.$refs.commonSelectGoods.open();
// this.show = true;
this.$forceUpdate();
},
onHandleClickBuy1() {
if (this.options.type == "visitor") {
console.log("this.options.type at line 1090:", this.options.type);
uni.showModal({
content: "登陆后可购买本商品",
confirmText: "去登录",
cancelText: "再逛逛", confirmColor:'#018f89',//确定按钮颜色
success(res) {
if (res.confirm) {
uni.navigateTo({
url: "/pages/user/login/login",
});
}
},
});
return;
}
this.$refs.commonSelectGoods.open();
// this.show = true;
},
onHandleClickBuy() {
console.log(
this.selectGoodsData,
"this.selectGoodsDatathis.selectGoodsDatathis.selectGoodsData"
);
var mynavData = JSON.stringify({
goods: [
{
productImages: this.selectGoodsData.productImages,
productId: this.selectGoodsData.productId,
productName: this.selectGoodsData.productName,
price: this.selectGoodsData.activityPrice
? this.selectGoodsData.activityPrice
: this.selectGoodsData.price,
goodsType: this.selectGoodsData.goodsType,
},
],
navTitle: this.options.navTitle,
title: this.options.title,
typeId: 0,
}); // 这里转换成 字符串
uni.navigateTo({
url: `/pages/goods/order/index?data=${mynavData}`,
});
// uni.navigateTo({
// // url: '../bookShop/commodityDetail?id=' + item.id
// url: `/pages/goods/order/index?navTitle=${this.options.navTitle}&title=${this.options.title}&oid=${this.options.oid}&conditions=${this.options.conditions}&detailOid=${this.options.detailOid}`
// })
},
buttonClick(e) {
console.log(e);
this.options[2].info++;
},
hancleModalConfirm() {
var data = {
values: {
customerType: "D",
token: uni.getStorageSync("token"),
customerOid: uni.getStorageSync("customerOid"),
...this.taiHuClassInfo,
},
};
// $mars.progressBegin('申请中...');
// $mars.post(customerType, 'applyRelearn', data, function (ret) {
// api.hideProgress();
// fnLoadDataGrid();
// });
},
fnRelearn(oid, days, courseFee) {
//99和199课程复读一个月60三个月120; 299和399课程复读一个月80三个月180
//499和599课程复读一个月90三个月220; 699和799课程复读一个月100三个月248
var feeAs = [
[60, 120],
[80, 180],
[90, 220],
[100, 248],
];
var fee = 0;
if (courseFee < 206) {
fee = feeAs[0][days == 30 ? 0 : 1];
} else if (courseFee < 406) {
fee = feeAs[1][days == 30 ? 0 : 1];
} else if (courseFee < 606) {
fee = feeAs[2][days == 30 ? 0 : 1];
} else {
fee = feeAs[3][days == 30 ? 0 : 1];
}
this.modalInfo = {
title: "提示信息",
content:
"用户您好,该课程已到期,通过支付" +
fee +
"元,本门课程可获得" +
days +
"天延期学习时间,点击确认即完成自动扣费,感谢配合!",
};
this.taiHuClassInfo = {
taiHuClassOid: oid,
days: days,
fee: fee,
};
this.show = true;
// $aui.alert({
// title: ,
// content: '用户您好,该课程已到期,通过支付' + fee + '元,本门课程可获得' + days + '天延期学习时间,点击确认即完成自动扣费,感谢配合!',
// buttons: ['取消', '确认'],
// radius: 6,
// titleColor: '#ff3300',
// contColor: '#333',
// btnColor: ''
},
//课程详情
async gotoDetail(v) {
console.log(v);
var result = await this.$commonJS.getCheckCourseStatus({
oid: v.courseOid,
});
console.log("result at line 364:", result);
if (result.buyFlg == 0 && v.conditions != "01") {
this.$commonJS.showToast("请先购买课程");
return;
}
uni.navigateTo({
// url: '../bookShop/commodityDetail?id=' + item.id
url: `/pages/curriculum/order/curriculum/detail?navTitle=${v.title}&title=${v.title}&oid=${v.courseOid}&conditions=${v.conditions}&detailOid=${v.detailOid}`,
});
},
//相关课程
goCourseDescription(v) {
console.log(v);
uni.navigateTo({
// url: '../bookShop/commodityDetail?id=' + item.id
url: `/pages/curriculum/order/curriculum/index?navTitle=${v.title}&title=${v.title}&oid=${v.oid}`,
});
},
async getCourseDescriptionData() {
var data = {};
var that = this;
this.$http
.request({
url: this.urlList.detailInfo,
method: "POST",
data: {
productId: this.options.id,
},
header: {
//默认 无 说明:请求头
"Content-Type": "application/json",
},
})
.then(async (res) => {
that.selectGoodsData = res.data.GLProducts[0];
that.curriculumData = res.data.detail;
that.booksList = res.data.books ? res.data.books : [];
that.coursesList = res.data.courses ? res.data.courses : [];
that.goodsList = res.data.GLProducts;
that.parameterList = [];
if (that.curriculumData.productName) {
that.parameterList.push({
name: "书名",
value: that.curriculumData.productName,
});
}
if (that.curriculumData.author) {
that.parameterList.push({
name: "作者",
value: that.curriculumData.author,
});
}
if (that.curriculumData.publisher) {
that.parameterList.push({
name: "出版社",
value: that.curriculumData.publisher,
});
}
if (that.curriculumData.pubDate) {
that.parameterList.push({
name: "出版时间",
value: that.curriculumData.pubDate,
isTime: true,
});
}
if (that.curriculumData.format) {
that.parameterList.push({
name: "开本",
value: that.curriculumData.format,
});
}
if (that.curriculumData.pageNum) {
that.parameterList.push({
name: "页数",
value: that.curriculumData.pageNum,
});
}
if (that.curriculumData.quality) {
that.parameterList.push({
name: "内文用纸材质",
value: that.curriculumData.quality,
});
}
if (
that.curriculumData.productImageList == null ||
that.curriculumData.productImageList == ""
) {
this.swiperList.push(that.curriculumData.explainsImg);
} else {
that.swiperList = that.curriculumData.productImageList.split(",");
// for (var i = 0; i < imgList.length; i++) {
// this.swiperList.push(imgList[i])
// }
}
this.detailInfo = {
content: this.curriculumData.productDetails,
};
});
},
getPriceData() {
var that = this;
setTimeout(() => {
that.$nextTick(() => {
that.$refs.priceDetail.getData();
});
}, 100);
},
// 检查是有权限使用搜索功能
checkDisable() {
console.log("点击了");
},
// 显示无权限弹窗
// showNoRights() {
// let that = this
// uni.showModal({
// content: "",
// confirmText: '好的',
// showCancel: false,
// success: function(res) {
// if (res.confirm) {
// // console.log('用户点击确定');
// that.clear()
// }
// }
// })
// },
// 获取用户详情
getUserInfo() {
// 用户详情
if (this.userInfo.id != undefined) {
this.$http.post("book/user/info/" + this.userInfo.id).then((res) => {
this.userMes = res.user;
this.getCateList();
console.log(this.userMes, "呼呼");
});
}
},
async handleselectCate(item, index) {
this.dataList = [];
var data = [];
console.log(item, index, 99999);
var that = this;
// curriculumInfo
this.$http
.post(this.urlList.curriculumInfo, {
customerType: "D",
token: uni.getStorageSync("token"),
customerOid: uni.getStorageSync("customerOid"),
oid: item.coid,
})
.then(async (res) => {
that.curriculumInfo = res.obj;
that.dataList = res.obj.courseList;
// socket.init();
});
// this.$nextTick(() => {
// switch (item.type) {
// case 1:
// // allDataList
// this.dataList = that.allDataList.result1Lst
// break;
// case 2:
// this.dataList = that.allDataList.result2Lst
// break;
// case 3:
// this.dataList = that.allDataList.result3Lst
// break;
// case 4:
// this.dataList = that.allDataList.result4Lst.filter(e =>
// e.oid != '5fcf991c027b11e7ae62008cfae40c18' && e.oid != 'b3d8a938b8e147bc877613bb712a9cb3' && e.oid != '4d4730163135420ea962bfac4805e026' && e.oid != '49fb76ca3d6b43718d78c6aa9a3003c2' && e.oid != 'c7b047ed9246469b9ae2b1013fc3df9c'
// )
// console.log(this.dataList.length, 6666666)
// break;
// }
// this.currentCateIndex = item.index
// })
console.log(this.allDataList, this.dataList, "1688");
// if(this.userMes.tgdzPower == 0){
// let that = this
// uni.showModal({
// content: "购买 针灸六经法要上册和下册 后方可使用此功能",
// confirmText: '好的',
// showCancel: false,
// success: function(res) {
// if (res.confirm) {
// // console.log('用户点击确定');
// }
// }
// })
// return
// }
// if(item.title == "时辰取穴"){
// uni.navigateTo({
// url: "../timeAcupoint/timeAcupoint"
// })
// return
// }
// this.currentStatusIndex = index
this.searchValue = "";
this.searchList = [];
this.showSearchList = false;
// if (index != 2) {
// uni.createSelectorQuery().select('.statusList').boundingClientRect(function (rect) {
// var height = rect.height
// console.log('元素高度:',);
// }).exec();
// } else {
// this.getJFList(dictType)
// }
return data;
},
async getDetailInfo() {
var that = this;
// curriculumInfo
// this.$nextTick(() => {
// switch (item.type) {
// case 1:
// // allDataList
// this.dataList = that.allDataList.result1Lst
// break;
// case 2:
// this.dataList = that.allDataList.result2Lst
// break;
// case 3:
// this.dataList = that.allDataList.result3Lst
// break;
// case 4:
// this.dataList = that.allDataList.result4Lst.filter(e =>
// e.oid != '5fcf991c027b11e7ae62008cfae40c18' && e.oid != 'b3d8a938b8e147bc877613bb712a9cb3' && e.oid != '4d4730163135420ea962bfac4805e026' && e.oid != '49fb76ca3d6b43718d78c6aa9a3003c2' && e.oid != 'c7b047ed9246469b9ae2b1013fc3df9c'
// )
// console.log(this.dataList.length, 6666666)
// break;
// }
// this.currentCateIndex = item.index
// })
console.log(this.allDataList, this.dataList, "1688");
// if(this.userMes.tgdzPower == 0){
// let that = this
// uni.showModal({
// content: "购买 针灸六经法要上册和下册 后方可使用此功能",
// confirmText: '好的',
// showCancel: false,
// success: function(res) {
// if (res.confirm) {
// // console.log('用户点击确定');
// }
// }
// })
// return
// }
// if(item.title == "时辰取穴"){
// uni.navigateTo({
// url: "../timeAcupoint/timeAcupoint"
// })
// return
// }
// this.currentStatusIndex = index
this.searchValue = "";
this.searchList = [];
this.showSearchList = false;
// if (index != 2) {
// uni.createSelectorQuery().select('.statusList').boundingClientRect(function (rect) {
// var height = rect.height
// console.log('元素高度:',);
// }).exec();
// } else {
// this.getJFList(dictType)
// }
return data;
},
async setOneCateIndex(item, index) {
this.allDataList = [];
console.log(index, 99999);
var that = this;
// if(this.userMes.tgdzPower == 0){
// let that = this
// uni.showModal({
// content: "购买 针灸六经法要上册和下册 后方可使用此功能",
// confirmText: '好的',
// showCancel: false,
// success: function(res) {
// if (res.confirm) {
// // console.log('用户点击确定');
// }
// }
// })
// return
// }
// if(item.title == "时辰取穴"){
// uni.navigateTo({
// url: "../timeAcupoint/timeAcupoint"
// })
// return
// }
this.currentStatusIndex = index;
// this.currentCateIndex = 0
this.searchValue = "";
this.searchList = [];
this.showSearchList = false;
this.$nextTick(async () => {
await that.getCourseDescriptionData();
this.$forceUpdate();
});
// this.handleselectCate(this.cateList[this.currentCateIndex])
// if (index != 2) {
// uni.createSelectorQuery().select('.statusList').boundingClientRect(function (rect) {
// var height = rect.height
// console.log('元素高度:',);
// }).exec();
// } else {
// this.getJFList(dictType)
// }
},
transformData(inputData) {
const result = {};
inputData.forEach((item) => {
const { letter } = item;
if (!result[letter]) {
result[letter] = [];
}
result[letter].push(item);
});
// const finalResult = Object.keys(result).map(key => ({ [key]: result[key] }));
return result;
},
// getJFList(id) {
// $http.request({
// url: "book/prescript/prescriptListForJF",
// method: "POST", // POST、GET、PUT、DELETE具体说明查看官方文档
// data: {
// loadAnimate: 'none', // 请求加载动画
// 'categoryId': id
// },
// header: { //默认 无 说明:请求头
// 'Content-Type': 'application/json'
// },
// }).then(res => {
// if (res.code == 0 && res.list.length > 0) {
// this.twoCateList = []
// this.dataList = this.transformData(res.list)
// console.log('JF经方', this.dataList)
// } else {
// this.twoCateList = []
// this.dataList = []
// }
// }).catch(e => {
// this.twoCateList = []
// this.dataList = []
// console.log(e)
// })
// },
getCateList(id) {
id ? "" : (id = 0);
this.twoCateList = [];
this.curTwoCateIndex = 0;
// 0为获取顶级分类其他为搜索下级分类目前的逻辑顶级是写死的所以可能只会涉及到搜索第二级
// $http.request({
// url: "book/prescript/prescriptCategoryList",
// method: "POST", // POST、GET、PUT、DELETE具体说明查看官方文档
// data: {
// loadAnimate: 'none', // 请求加载动画
// 'categoryId': id
// },
// header: { //默认 无 说明:请求头
// 'Content-Type': 'application/json'
// },
// }).then(res => {
// console.log(res, '脉穴分类获取成功')
// if (res.code == 0 && res.list.length > 0) {
// this.statusList = res.list
// this.getTowCateList(this.statusList[0].type)
// } else {
// this.statusList = []
// }
// }).catch(e => {
// this.statusList = []
// console.log(e)
// })
},
// 放大图片
previewImage(url) {
console.log(url);
uni.previewImage({
urls: [url],
longPressActions: {
itemList: ["很抱歉,暂不支持保存图片到本地"],
success: function (res) {
// console.log(res,'+++++')
},
},
});
},
// getSearch() {
// $http.request({
// url: "book/prescript/searchPrescript",
// method: "POST", // POST、GET、PUT、DELETE具体说明查看官方文档
// data: {
// loadAnimate: 'none', // 请求加载动画
// 'keywords': this.searchValue,
// type: this.currentStatusIndex + 1
// },
// header: { //默认 无 说明:请求头
// 'Content-Type': 'application/json'
// },
// }).then(res => {
// console.log(res, '搜索结果')
// if (res.code == 0 && res.list.length >= 0) {
// this.showSearchList = true
// this.searchList = res.list
// } else {
// this.searchList = []
// }
// }).catch(e => {
// // this.dataList = []
// this.searchList = []
// console.log(e)
// })
// },
// search(res) {
// console.log(res, 'res')
// // uni.showToast({
// // title: '搜索:' + res,
// // icon: 'none'
// // })
// if (res == '') {
// this.showSearchList = false
// this.searchList = []
// } else {
// this.getSearch()
// }
// },
// input(res) {
// console.log('----input:', res)
// if (res == '') {
// this.searchList = []
// } else {
// this.getSearch()
// }
// },
// clear(res) {
// console.log('----clear:', res)
// // uni.showToast({
// // title: 'clear事件清除值为',
// // icon: 'none'
// // })
// this.searchValue = ''
// this.showSearchList = false
// },
// blur(res) {
// // console.log('----blur:', res)
// // if (res == '') {
// // this.showSearchList = false
// // this.searchList = []
// // } else {
// // this.getSearch()
// // }
// },
// focus(e) {
// console.log('----focus:')
// // uni.showToast({
// // title: 'focus事件输出值为' + e.value,
// // icon: 'none'
// // })
// // 等于1 就是有权限
// // this.showSearchList = true
// },
// cancel(res) {
// uni.showToast({
// title: '点击取消,输入值为:' + res.value,
// icon: 'none'
// })
// }
},
onBackPress() {
// #ifdef APP-PLUS
plus.key.hideSoftKeybord();
// #endif
},
};
</script>
<style lang="scss" scoped>
@import "@/style/mixin.scss";
.u-grid-list {
// height: 40rpx;
}
.searchList {
.item {
font-size: 28rpx;
padding: 20rpx;
border-bottom: 1px solid #dadbde;
}
}
.scroll-view_H {
background-color: #fff;
white-space: nowrap;
padding: 10rpx;
}
.contentBox {
height: calc(100% - 50px);
.statusList {
padding: 10rpx;
box-sizing: border-box;
justify-content: space-between;
text {
text-align: center;
display: inline-block;
width: 32%;
padding: 20rpx 0;
font-size: 34rpx;
border-radius: 10rpx;
}
.cur {
background-color: $themeColor;
color: #fff;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
}
.twoCateList {
font-size: 28rpx;
margin-top: 20rpx;
.grid-text {
padding: 10rpx 0rpx;
text-align: center;
}
.cur {
color: $themeColor;
}
// .u-grid-list{border: 0.5px solid #dadbde;}
}
.dataList {
font-size: 26rpx;
padding-bottom: 40rpx;
// margin-top: 20rpx;
// padding: 32rpx 0rpx;
border-radius: 10rpx;
background-color: #fff;
box-sizing: border-box;
.JFtitleItem {
background-color: #ffffff;
padding: 20rpx 10rpx;
width: 100%;
border-bottom: 0.5px solid #f8f9fa;
}
.wmzhimg {
width: 220rpx;
height: 220rpx;
}
}
}
.search_box {
margin: 0 auto;
overflow: hidden;
align-items: center;
width: calc(100% - 10px);
margin-top: 20rpx;
margin-bottom: 20rpx;
.search {
height: 56upx;
display: flex;
width: 86%;
margin: 0 auto;
align-items: center;
padding: 0upx 40upx;
background-color: #fff;
border-radius: 20upx;
box-shadow: 0 0px 10px 1px #3ab3ae33;
}
.prompt {
color: #838383;
font-size: 24rpx;
}
.icon_search {
background-image: url("@/static/icon/map_ic_search.png");
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
width: 36upx;
height: 36upx;
margin-right: 20upx;
}
}
.flexbox {
display: flex;
}
.uni-modal .uni-modal__bd {
text-align: left;
}
.limiTy {
font-size: 28rpx;
line-height: 46rpx;
}
.chImage {
height: 100rpx;
}
.dataList {
height: 100%;
}
.titleList2 {
height: calc(100% - 150rpx);
}
.priceDetail {
height: calc(100% - 180rpx) !important;
padding: 0rpx 0;
box-sizing: border-box;
}
.componentPage {
height: calc(100% - 90rpx) !important;
}
.dateReminder {
width: 100%;
font-size: 24rpx;
text-align: right;
line-height: 40rpx;
}
.fdButtonBox {
border: 1rpx solid $themeColor;
background-color: $themeColor;
color: #fff;
// width: 100%;
float: right;
padding: 4rpx 14rpx;
font-size: 24rpx;
font-weight: 500;
line-height: 30rpx;
border-radius: 10rpx;
box-sizing: border-box;
// margin-top: 20rpx;
// display: flex;
// align-items: center;
}
.headImage {
// height: 400rpx !important;
}
.commonDetailPage {
padding-bottom: 150rpx !important;
background-color: #f5f5f5 !important;
}
.goods_box {
background-color: #fff;
// margin-top: 20rpx;
// padding: 40rpx 30rpx;
box-sizing: border-box;
width: 100%;
.curriulum_title_box {
width: calc(100%) !important;
padding-bottom: 20rpx;
background-color: #fff;
.curriulum_title {
width: calc(100%);
font-weight: 600;
font-size: 34rpx;
// line-height: 40rpx;
// display: flex;
// align-items: center;
margin-top: 80rpx;
margin-bottom: 0rpx;
// padding: 20rpx;
box-sizing: border-box;
}
}
}
.dataList {
background-color: #fff !important;
padding: 0 30rpx 40rpx !important;
box-sizing: border-box;
}
/deep/.titleItem {
// width: calc(100% - 120rpx) !important;
}
/deep/.scroll-view-item:nth-child(2n-1) {
background-color: transparent !important;
}
.dataList {
height: auto !important;
}
.small_class_teaching_box {
padding-top: 20rpx;
width: 100%;
margin-top: 20rpx;
background: #fff;
.small_class_teaching_top {
padding: 20rpx 20rpx 0 10rpx;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: space-between;
// background: #EDFCF7;
color: #8f8e8e;
// box-shadow: 0px 0px 6rpx 0px #E9DCCC;
.icon1 {
width: 50rpx;
height: 50rpx;
}
.small_class_teaching_top_left {
display: flex;
align-items: center;
color: #018f89;
font-family: MicrosoftYaHei;
}
}
.small_class_teaching_content {
margin-top: 20rpx;
// background: #EDFCF7;
padding-bottom: 10rpx;
.top {
padding: 20rpx 20rpx;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 4rpx solid #fff;
.top_item {
width: 23%;
font-family: PangMenZhengDaoBiaoTiTiMianFeiBan;
font-weight: normal;
font-size: 34rpx;
color: #018f89;
line-height: 80rpx;
background: #cef8ea;
text-align: center;
border-radius: 10rpx;
box-shadow: 0px 0px 6rpx 0px #e9dccc;
}
}
.schedule {
width: 100%;
overflow: hidden;
padding: 20rpx 20rpx;
box-sizing: border-box;
align-items: center;
color: #018f89;
font-family: MicrosoftYaHei;
.icon_box {
width: 100%;
display: flex;
align-items: center;
margin-bottom: 0rpx;
.icon1 {
width: 50rpx;
height: 50rpx;
margin-right: 10rpx;
}
}
.progress_box {
width: 100%;
display: flex;
align-items: center;
position: relative;
.progress_icon {
width: calc(100% - 240rpx);
}
.icon1 {
width: 60rpx;
height: 60rpx;
margin: 0 20rpx;
}
.icon2 {
width: 140rpx;
height: 100rpx;
position: absolute;
right: 0;
// margin-top: -20rpx;
}
}
}
}
}
.related_courses_box {
background-color: #fff;
.small_class_teaching_content {
padding: 10rpx 20rpx;
box-sizing: border-box;
}
}
.related_courses_name {
display: inline-block;
width: calc(100% - 0rpx) !important;
.aui-text-danger {
display: inline-block;
float: right;
}
}
.original_price {
font-size: 28rpx !important;
font-weight: 500;
color: #999 !important;
white-space: nowrap;
text-decoration: line-through;
float: left;
margin-top: 6rpx;
}
.price {
font-size: 48rpx;
font-weight: 700;
float: left;
margin-right: 10rpx;
// font-family: PangMenZhengDaoBiaoTiTiMianFeiBan;
}
.price_box {
width: 100%;
overflow: hidden;
}
.commonTags {
margin-right: 20rpx;
margin-top: -5rpx !important;
}
.sales_number {
text-decoration: none;
color: #b0b0b0;
font-weight: 500;
}
.miaosha_box {
overflow: hidden;
.countdown {
display: flex;
align-items: center;
color: #fff;
font-size: 24rpx;
}
.price_left {
width: calc(100% - 300rpx);
float: left;
}
.price_box {
.price {
color: #fff !important;
}
.original_price {
color: #e4dede !important;
font-weight: 500;
margin-left: 20rpx;
font-size: 26rpx !important;
}
.sales_number {
display: block;
width: 100%;
color: #fff !important;
font-weight: 500;
padding-left: 10rpx;
margin-left: 0rpx;
font-size: 24rpx !important;
}
padding: 30rpx 20rpx 30rpx;
background: linear-gradient(to right, #ff2701, #fd8d024d);
// height: 100rpx;
}
.curriulum_title {
padding: 20rpx 40rpx;
margin-top: 20rpx !important;
}
}
.normal_box {
padding: 40rpx 30rpx;
}
.xianshimaiosha_box {
width: 300rpx;
height: 100%;
float: right;
}
.xianshimaiosha {
display: inline-block;
width: 100%;
line-height: 100rpx;
font-family: PangMenZhengDaoBiaoTiTiMianFeiBan;
font-weight: blod;
font-size: 64rpx;
color: red;
text-align: right;
padding-right: 20rpx;
box-sizing: border-box;
font-style: italic;
}
// .common_curriculum_list{
// }
/deep/.common_curriculum_list {
margin-top: 20rpx;
padding: 20rpx 20rpx 20rpx;
.content_item {
width: 100% !important;
margin-bottom: 0 !important;
padding: 15rpx 0 0rpx;
border-top: 1rpx solid #f1f0f0;
// height: 160rpx;
.book_image {
width: 60rpx !important;
height: 60rpx !important;
float: left !important;
background-color: #f5f5f5;
}
.common_curriculum_item {
width: calc(100% - 88rpx);
float: right;
display: block !important;
// overflow: hidden;
.related_courses_name {
width: 100% !important;
}
}
}
.content_item:nth-child(1) {
border-top: none !important;
}
}
/deep/.common_section {
padding: 0 !important;
padding-bottom: 20rpx !important;
}
.goods_detail_list_title {
display: flex;
align-items: center;
justify-content: space-between;
.left {
display: flex;
align-items: center;
}
.right {
font-size: 24rpx;
font-weight: 500 !important;
color: #333;
font-family: none;
}
// justify-content: space-between;
}
.commonPageContentBox {
height: auto !important;
}
.goods_item {
overflow: hidden;
display: flex;
align-items: center;
justify-content: space-between;
// margin-bottom: 20rpx;
padding: 10rpx 20rpx;
border: 2rpx solid #fff;
border-radius: 10rpx;
}
.title {
box-sizing: border-box;
// font-weight: bold;
margin-bottom: 40rpx;
padding-left: 20rpx;
}
.image_box {
width: 70rpx;
height: 70rpx;
float: left;
background-color: #f5f5f5;
}
.goods_image {
width: 100%;
height: 100%;
}
.goods_info {
width: calc(100%);
// padding: 10rpx 20rpx;
box-sizing: border-box;
// height: 100rpx;
display: flex;
align-items: center;
justify-content: space-between;
float: left;
.name {
font-size: 26rpx;
// font-weight: 600;
color: #333;
}
.price {
font-size: 26rpx;
color: #aaa;
}
}
.isSelectGoods {
color: $themeColor !important;
.name {
color: $themeColor !important;
}
.price {
color: $themeColor !important;
}
border: 2rpx solid $themeColor;
border-radius: 10rpx;
}
/deep/.list_item {
// border-bottom: none;
padding: 10rpx 0 !important;
padding-right: 0 !important;
}
.parameterList {
/deep/.list_item {
// border-bottom: none;
padding: 0 !important;
border: none !important;
box-shadow: none !important;
}
.parameter_box {
padding: 20rpx 0;
}
.goods_item {
padding-top: 5rpx !important;
padding-bottom: 5rpx !important;
}
}
.parameter_info_box {
padding: 0 20rpx;
}
.parameter_info {
/deep/.list_item {
// border-bottom: none;
padding: 0 !important;
border: none !important;
box-shadow: none !important;
}
.goods_item {
border: none !important;
}
}
.goodsList {
.image_box {
width: 80rpx;
height: 80rpx;
float: left;
background-color: #f5f5f5;
}
}
/deep/.u-popup__content {
background-color: transparent !important;
}
/deep/.u-popup__content__close {
color: #fff !important;
}
.title_box {
display: flex;
align-items: center;
justify-content: space-between;
padding-left: 0;
.title_price {
color: #ef1224;
font-size: 40rpx;
font-weight: 700;
}
}
.title_list {
margin-bottom: 20rpx;
}
.book_box {
.image_box {
width: 160rpx;
height: 160rpx;
}
.goods_info {
display: block;
}
}
</style>