123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463 |
- <template>
- <mobile-frame>
- <view class="main">
- <view class="one">
- <scroll-view scroll-y="true" class="scroll-view">
- <view class="list-scroll-view">
- <view class="one_1">
- <banner :goodsInfo="goodsInfo" :goodsColect="goodsColect" @toGoodscolect="toGoodscolect">
- </banner>
- </view>
- <view class="one_2">
- <text class="money_1" v-if="infospecs.leader_price"><text>团长价¥</text>{{infospecs.leader_price||0}}</text>
- <text class="money" v-if="infospecs.price"><text>特价¥</text>{{infospecs.price||0}}</text>
- <text class="money" v-if="!infospecs.price&&!infospecs.leader_price"><text>¥</text>{{infospecs.sell_money||0}}</text>
- <text class="money"><text>¥</text>{{infospecs.flow_money||0}}</text>
- </view>
- <view class="one_3" v-if="discount">
- <text v-if="discount.full_decrement&&discount.full_decrement.length>0" class="act" v-for="(item,index) in discount.full_decrement" :key="index">{{item}}</text>
- <text v-if="discount.full_fold&&discount.full_decrement.length>0" class="act" v-for="(item,index) in discount.full_fold" :key="index">{{item}}</text>
- </view>
- <view class="one_4">
- <text class="num">已售{{info.goods.sell_num||0}}件</text>
- </view>
- <view class="one_5">
- 5
- </view>
- </view>
- </scroll-view>
- </view>
- <view class="two">
- <uni-goods-nav :options="options" :button-group="buttonGroup" @click="toNavleft" @buttonClick="toNavright" />
- </view>
- </view>
- </mobile-frame>
- </template>
- <script>
- import banner from './parts/banner_1.vue';
- export default {
- <<<<<<< HEAD
- components: {},
- =======
- components: {
- banner
- },
- >>>>>>> 05da159d61256c6a0236cdc1ed80cfc988b67efa
- data() {
- return {
- // 系统设置
- config: {},
- // 商品id
- id: '',
- // 分享人id
- inviter: '',
- // 当前用户信息
- user: {},
- // 是否关注商品
- goodsColect: false,
- // 是否关注店铺
- shopColect: false,
- // 评价数
- evaluate_num: 0,
- // 商品详情
- info: {},
- // 商品详情
- goodsInfo: {},
- // 规格
- infospecs: {},
- // 优惠
- discount: {},
- // 底部菜单
- options: [{
- icon: 'shop',
- text: '店铺',
- type: 'shop',
- route: 'pagesHome/shop/index',
- },
- {
- icon: 'cart',
- text: '购物车',
- type: 'market',
- route: 'pages/market/index',
- },
- ],
- buttonGroup: [{
- text: '加入购物车',
- backgroundColor: 'linear-gradient(90deg, #FFCD1E, #FF8A18)',
- color: '#fff',
- type: '0'
- },
- {
- text: '立即购买',
- backgroundColor: 'linear-gradient(90deg, #FE6035, #EF1224)',
- color: '#fff',
- type: '1'
- }
- ],
- <<<<<<< HEAD
- // one_2
- // 商品价格
- infospecs: {},
- // one_3
- discount: {
- full_decrement: [
- '测试一'
- ]
- }
- =======
- // 系统菜单
- barList: [],
- is_menu: false,
- // 规格弹框
- popupShow: '1',
- // 规格信息
- is_specs: 0,
- btn_type: '1',
- specsInfo: {},
- // 是否零库存
- is_zero: false,
- // 商品设置
- group_config: [],
- // 限制说明
- buyList: [],
- // 购买数量
- buy_num: 1,
- // 规格弹出框
- dialog: {
- show: false,
- type: '1'
- },
- >>>>>>> 05da159d61256c6a0236cdc1ed80cfc988b67efa
- };
- },
- onLoad: async function(e) {
- const that = this;
- that.$set(that, `id`, e.id || '');
- that.$set(that, `inviter`, e.inviter || '');
- await that.searchConfig();
- await that.search();
- await that.configShare();
- },
- onShow: async function() {
- const that = this;
- await that.watchLogin();
- },
- onUnload: function() {
- // 页面卸载,重新部署分享内容
- const that = this;
- if (that.config) {
- // 赋值默认值
- that.$config.share = {
- title: that.config.title,
- path: '/pages/index/index',
- imageUrl: that.config.config.share[0].url
- }
- }
- },
- methods: {
- // 查询系统设置
- searchConfig() {
- const that = this;
- uni.getStorage({
- key: 'config',
- success: function(res) {
- let data = res.data;
- that.$set(that, `config`, data);
- if (data.bottom_menu && data.bottom_menu.list.length > 0) {
- let list = data.bottom_menu.list.sort((a, b) => {
- return a.sort - b.sort
- });
- that.$set(that, `barList`, list)
- }
- }
- })
- },
- // 查询用户信息
- watchLogin() {
- const that = this;
- uni.getStorage({
- key: 'token',
- success: async function(res) {
- let user = that.$jwt(res.data);
- if (user) that.$set(that, `user`, user);
- },
- fail: function(err) {
- console.log('暂无用户信息');
- }
- })
- },
- // 查询其他信息
- async searchOther() {
- const that = this;
- let user = that.user;
- let res;
- // 是否关注商品
- res = await that.$api(`/storeGoods/check`, `GET`, {
- customer: user._id,
- goods: that.id
- });
- if (res.errcode == '0') that.$set(that, `goodsColect`, res.data);
- // 是否关注店铺
- res = await that.$api(`/storeShop/check`, `GET`, {
- customer: user._id,
- shop: that.info?.shop?._id
- });
- if (res.errcode == '0') that.$set(that, `shopColect`, res.data);
- // 商品设置
- res = await that.$api(`/goodsConfig`, `GET`, {
- goods: that.id,
- shop: that.info?.shop?._id
- }, 'group');
- if (res.errcode == '0' && res.total > 0) that.$set(that, `group_config`, res.data);
- // 限制说明
- res = await that.$api(`/dictData`, 'GET', {
- code: "buy_limit"
- });
- if (res.errcode == '0') that.$set(that, `buyList`, res.data)
- },
- // 查询商品信息
- async search() {
- const that = this;
- let id = that.id;
- if (id) {
- let res;
- res = await that.$api(`/viewGoods/goodsDetail`, `POST`, {
- id: id
- });
- if (res.errcode == '0') {
- let data = res.data;
- if (data.goods.brief) data.goods.brief = data.goods.brief.replace(/\<img/gi,
- '<img class="rich-img"');
- // 特价
- let act;
- act = data.act.find(i => i.type == '3')
- if (act) {
- for (let val of act.list) {
- for (let [index, arr] of data.specs.entries()) {
- if (val.spec == arr._id) arr.price = val.price
- }
- }
- }
- // 显示最低价格的规格信息,不考虑库存问题
- if (data.specs && data.specs.length > 0) {
- // 规格排序
- let indexSpecs = data.specs.sort(function(a, b) {
- let i, j;
- if (a.price) i = 'price'
- else i = 'sell_money'
- if (b.price) j = 'price'
- else j = 'sell_money'
- return a[i] - b[j];
- })
- that.$set(that, `infospecs`, indexSpecs[0])
- }
- that.$set(that, `info`, data);
- that.$set(that, `goodsInfo`, data?.goods);
- // 优惠
- act = data.act.find(i => i.type == '5')
- if (act) that.$set(that.discount, `full_decrement`, act.text.split(';'));
- act = data.act.find(i => i.type == '6')
- if (act) that.$set(that.discount, `full_fold`, act.text.split(';'));
- await that.searchOther();
- // 查询规格
- await that.searchSpecs(data.specs);
- // 查询评价数
- await that.searchRate(data);
- }
- } else {
- uni.showToast({
- title: '暂无商品信息',
- icon: 'none'
- })
- }
- },
- // 查询规格
- searchSpecs(e) {
- const that = this;
- if (e.length > 0) {
- let data = e.find(i => i.num > 0);
- let dataIndex = e.findIndex(i => i._id == data._id);
- if (data) {
- let specsInfo = that.group_config.find(i => i.spec._id == data._id)
- if (specsInfo?._id && that.user.is_leader == '0') data.can_group = '0'
- else data.can_group = '1'
- let limit = that.buyList.find((i) => i.value == data.buy_limit);
- if (limit) data.buy_name = limit.label
- that.$set(that, `specsInfo`, data);
- that.$set(that, `is_specs`, dataIndex);
- }
- }
- },
- // 查询评价数
- async searchRate(e) {
- const that = this;
- let res = await that.$api(`/goodsRate`, `GET`, {
- limit: 1,
- goods: e.goods._id
- })
- if (res.errcode == '0') that.$set(that, `evaluate_num`, res.total);
- },
- // 关注商品
- async toGoodscolect() {
- const that = this;
- let user = that.user;
- if (user && user._id) {
- let res = await that.$api(`/storeGoods`, `POST`, {
- customer: user._id,
- goods: that.id
- });
- if (res.errcode == '0') {
- uni.showToast({
- title: res.data.msg,
- icon: 'none'
- })
- that.$set(that, `goodsColect`, res.data.result)
- }
- } else {
- uni.showToast({
- title: '暂无账号,无法收藏商品',
- icon: 'none'
- })
- }
- },
- // 店铺,购物车
- toNavleft(e) {
- const that = this;
- if (e.content.type == 'shop') {
- that.toShop();
- } else if (e.content.type == 'market') {
- let obj = {
- route: e.content.route
- }
- that.toPath(obj)
- }
- },
- // 加入购物车,立即购买
- toNavright(e) {
- const that = this;
- that.$set(that, `popupShow`, '1');
- that.$set(that, `btn_type`, e.content.type);
- that.$refs.specShow.open();
- },
- <<<<<<< HEAD
- },
- =======
- // 配置分享内容
- configShare() {
- const that = this;
- let id = that.id;
- let inviter = that.user && that.user._id ? that.user._id : '';
- let title = that.info && that.info.goods ? that.info.goods.name : '';
- let imageUrl = that.info && that.info.goods ? that.info.goods.file[0].url : '';
- that.$config.share = {
- title: title,
- path: `/pagesHome/order/detail?id=${id}&inviter=${inviter}`,
- imageUrl: imageUrl
- }
- },
- }
- >>>>>>> 05da159d61256c6a0236cdc1ed80cfc988b67efa
- }
- </script>
- <style lang="scss">
- .main {
- display: flex;
- flex-direction: column;
- width: 100vw;
- height: 100vh;
- .one {
- position: relative;
- flex-grow: 1;
- .one_2 {
- border-bottom: 0.5vw solid var(--f9Color);
- padding: 2vw;
- .money_1 {
- color: #23B67A;
- font-size: 20px;
- padding: 0 1vw 0 0;
- font-weight: bold;
- text {
- font-size: 14px;
- }
- }
- .money {
- font-size: 20px;
- padding: 0 1vw 0 0;
- color: #ff0000;
- font-weight: bold;
- text {
- font-size: 14px;
- }
- }
- .money:last-child {
- font-size: 16px;
- color: #858585;
- text-decoration: line-through;
- }
- }
- .one_3 {
- display: flex;
- flex-wrap: wrap;
- padding: 1vw;
- border-bottom: 0.5vw solid var(--f9Color);
- .act {
- font-size: 12px;
- border: 1px solid var(--fFB1Color);
- margin: 0 1vw 1vw 0;
- color: var(--fFB1Color);
- border-radius: 6px;
- padding: 0 1vw;
- }
- .num {
- font-size: 12px;
- color: #858585;
- }
- }
- .one_4 {
- display: flex;
- flex-wrap: wrap;
- padding: 1vw;
- border-bottom: 0.5vw solid var(--f9Color);
- .num {
- font-size: 12px;
- color: #858585;
- }
- }
- }
- .two {
- width: 100vw;
- height: 8vh;
- overflow: hidden;
- }
- }
- .scroll-view {
- position: absolute;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- .list-scroll-view {
- display: flex;
- flex-direction: column;
- }
- }
- </style>
|