Skip to content

M
mallapp
Commit f2954b96 authored by 罗超's avatar 罗超
Browse files
Options

完善商品详情

parent b449fe68
Expand all Show whitespace changes
Inline Side-by-side
Showing with 1044 additions and 108 deletions
components/auth/index.vue
View file @ f2954b96
......@@ -40,6 +40,7 @@ export default {
methods: {
getUserInfo(e) {
if(e.mp.detail.userInfo){
// TODO 实现用户登录
uni.setStorageSync("userinfo", e.mp.detail.userInfo);
this.$emit('changeuserinfo');
}
......
components/goods/goodsaction.vue 0 → 100644
View file @ f2954b96
<template>
<view
class="actionsheet"
:style="{ 'padding-bottom': bian ? '28px' : '0px' }"
>
<view class="item" @click="setFavorite" style="width:36px;">
<view style="width: 22px; margin: auto;">
<u-icon name="cart-o" size="44" :color="mc"></u-icon>
</view>
<text class="text" :style="{'color':mc}">购物车</text>
</view>
<view class="item">
<view style="width: 22px; margin: auto;">
<u-icon name="chat-o" size="44" color="#333"></u-icon>
</view>
<text class="text">客服</text>
<button
open-type="contact"
:send-message-title="goodName"
:send-message-path="path"
:send-message-img="g.coverPic"
:show-message-card="true"
>
0
</button>
</view>
<view class="item" @click="setFavorite">
<view style="width: 22px; margin: auto;">
<u-icon
:name="favorStatus ? 'like' : 'like-o'"
size="44"
:color="favorStatus ? mc : '#333'"
></u-icon>
</view>
<text class="text">收藏</text>
</view>
<view class="item2">
<view style="flex: 1;">
<u-button
@click="joinCar"
:ripple="true"
:hair-line="false"
:custom-style="btn1"
>加入购物车</u-button
>
</view>
<view style="flex: 1;">
<u-button
@click="buy"
:ripple="true"
:hair-line="false"
:custom-style="btn2"
>立即购买</u-button
>
</view>
</view>
</view>
</template>
<script>
export default {
props: ["coverPic", "goodName", "favorite", "goodId"],
data() {
return {
mc: "",
fu: "",
bian: false,
btn1: {
flex: 1,
height: "100%",
borderRadius: "40px 0 0 40px",
border: "none",
color: "#FFF",
fontSize: "13px",
width: "100%",
},
btn2: {
flex: 1,
height: "100%",
borderRadius: "0 40px 40px 0",
border: "none",
color: "#FFF",
fontSize: "13px",
width: "100%",
},
path: "",
favorStatus: false,
};
},
mounted() {
this.mc = this.$uiConfig.mainColor;
this.fu = this.$uiConfig.secondary;
this.bian = this.$utils.is_biang;
this.btn1.background = this.fu;
this.btn2.background = this.mc;
let t = getCurrentPages();
this.path = "/" + t[t.length - 1].route;
//console.log(t[t.length - 1]);
this.favorStatus = this.favorite;
},
methods: {
setFavorite() {
let h=this.apiheader()
console.log(h)
this.request(
{
url: "",
data: {
r: this.favorStatus
? "api/user/favorite-remove"
: "api/user/favorite-add",
goods_id: this.goodId,
},
header:h
},
(res) => {
this.favorStatus = !this.favorStatus;
}
);
},
joinCar() {
this.$emit("join-car");
},
buy() {
this.$emit("buy");
},
},
};
</script>
<style>
.actionsheet {
display: flex;
background: #fff;
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: 3;
height: 50px;
align-items: center;
}
.actionsheet .item {
display: flex;
flex-direction: column;
justify-content: center;
margin: 0 10px;
color: #333;
font-size: 12px;
padding: 3px 0;
width: 30px;
position: relative;
}
.actionsheet .item .text {
margin-top: 2px;
text-align: center;
}
.actionsheet .item2 {
flex: 1;
width: 1px;
padding: 5px;
box-sizing: border-box;
margin-left: 10px;
height: 100%;
display: flex;
}
.actionsheet .item button {
width: 100%;
height: 100%;
opacity: 0;
left: 0;
top: 0;
position: absolute;
}
</style>
components/goods/goodsku.vue 0 → 100644
View file @ f2954b96
This diff is collapsed.
components/goods/list.vue 0 → 100644
View file @ f2954b96
<template>
<view class="u-good-list">
<u-row gutter="20">
<u-col span="6" v-for="(cx, ci) in g" :key="ci">
<view class="good" @click="clickHandler(cx.page_url)">
<view class="good-img">
<image
mode="aspectFit"
:src="cx.cover_pic"
style="width: 100%; height: 100%;"
/>
</view>
<view class="good-name">{{ cx.name }}</view>
<view class="good-info">
<view class="price" :style="{ color: mainColor }">{{
cx.price_content
}}</view>
<view class="sell">{{ cx.sales }}</view>
<view class="cart">
<u-icon name="cart-o" size="40" :color="mainColor" />
</view>
</view>
</view>
</u-col>
</u-row>
</view>
</template>
<script>
export default {
props: ["list"],
data() {
return {
g: [],
};
},
mounted() {
this.g = this.list;
},
watch: {
list: {
deep: true,
immediate: true,
handler: function (newVal, oldVal) {
this.g = newVal;
}
},
},
methods: {
clickHandler(url) {
uni.navigateTo({
url: url,
});
},
},
};
</script>
<style>
.u-good-list .good {
background: #fff;
border-radius: 10px;
overflow: hidden;
margin-bottom: 10px;
}
.u-good-list .good .good-img {
width: calc(50vw - 15px);
height: calc(50vw - 15px);
display: block;
}
.u-good-list .good .good-name {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
margin-bottom: 3px;
font-size: 13px;
margin: 7px 10px;
}
.u-good-list .good .good-info {
display: flex;
margin: 7px 10px;
margin-top: 0;
align-items: flex-end;
padding-bottom: 5px;
}
.u-good-list .good .good-info .price {
font-size: 14px;
color: #ff4544;
flex: 1;
}
.u-good-list .good .good-info .sell {
font-size: 11px;
color: gray;
flex: 1;
}
.u-good-list .good .good-info .cart {
width: 40rpx;
text-align: right;
}
</style>
node_modules/uview-ui/components/u-number-box/u-number-box.vue
View file @ f2954b96
......@@ -5,7 +5,7 @@
height: inputHeight + 'rpx',
color: color
}">
<u-icon name="minus" :size="size"></u-icon>
&nbsp;
</view>
<input :disabled="disabled" :class="{ 'u-input-disabled': disabled }" v-model="inputVal" class="u-number-input" @blur="onBlur"
type="number" :style="{
......@@ -241,6 +241,7 @@
display: flex;
justify-content: center;
align-items: center;
position: relative;
}
.u-icon-plus {
......@@ -260,4 +261,25 @@
color: #c8c9cc !important;
background-color: #f2f3f5 !important;
}
.u-icon-minus::after{
height: 1px;
content: ' ';
top: 50%;
background: #000;
left: 10px;
right: 10px;
display: block;
position: absolute;
}
.u-icon-minus.u-icon-disabled::after{
height: 1px;
content: ' ';
top: 50%;
background: #c8c9cc;
left: 10px;
right: 10px;
display: block;
position: absolute;
}
</style>
node_modules/uview-ui/components/u-popup/u-popup.vue
View file @ f2954b96
......@@ -158,7 +158,7 @@
;
}
// 不加可能圆角无效
style.overflow = 'hidden';
//style.overflow = 'hidden';
}
return style;
},
......@@ -171,7 +171,7 @@
if (this.borderRadius) {
style.borderRadius = `${this.borderRadius}rpx`;
// 不加可能圆角无效
style.overflow = 'hidden';
//style.overflow = 'hidden';
}
return style;
}
......
node_modules/uview-ui/components/u-section/u-section.vue
View file @ f2954b96
......@@ -4,15 +4,16 @@
fontWeight: bold ? 'bold' : 'normal',
color: color,
fontSize: fontSize + 'rpx'
}">
}" :class="{'u-section-title-leftshow':showSplit}">
{{title}}
</view>
<view class="u-right-info" v-if="right" :style="{
color: subColor
color: subColor,
fontSize: fontSize + 'rpx'
}" @tap="rightClick">
{{subTitle}}
<view class="u-icon-arrow">
<u-icon name="arrow-right" size="24" :color="subColor"></u-icon>
<u-icon name="arrow" size="24" :color="subColor"></u-icon>
</view>
</view>
</view>
......@@ -40,6 +41,10 @@
type: String,
default: ''
},
showSplit:{
type: Boolean,
default: true
},
// 右边副标题内容
subTitle: {
type: String,
......@@ -94,11 +99,13 @@
.u-section-title {
position: relative;
font-size: 28rpx;
padding-left: 10px;
line-height: 1;
}
.u-section-title:after {
.u-section-title-leftshow{
padding-left: 10px;
}
.u-section-title-leftshow:after {
position: absolute;
width: 4px;
height: 100%;
......
pages/goods/goods.vue
View file @ f2954b96
This diff is collapsed.
pages/goods/list.vue
View file @ f2954b96
......@@ -52,29 +52,7 @@
@scroll="scroll"
style="height: 100%; padding-bottom: 0px;"
>
<u-row gutter="20">
<u-col span="6" v-for="(cx, ci) in g" :key="ci">
<view class="good" @click="clickHandler(cx.page_url)">
<view class="good-img">
<image
mode="aspectFit"
:src="cx.cover_pic"
style="width: 100%; height: 100%;"
/>
</view>
<view class="good-name">{{ cx.name }}</view>
<view class="good-info">
<view class="price" :style="{ color: mainColor }">{{
cx.price_content
}}</view>
<view class="sell">{{ cx.sales }}</view>
<view class="cart">
<u-icon name="cart-o" size="40" :color="mainColor" />
</view>
</view>
</view>
</u-col>
</u-row>
<goodlist :list="g"></goodlist>
<u-loadmore
v-if="showLoading"
:status="status"
......@@ -104,6 +82,7 @@
</template>
<script>
import goodlist from '@/components/goods/list'
export default {
data() {
return {
......@@ -131,6 +110,9 @@ export default {
},
};
},
components:{
goodlist
},
onLoad(option) {
this.mainColor = this.$uiConfig.mainColor;
this.catId = option.cat_id;
......@@ -230,7 +212,7 @@ export default {
width: 90rpx;
color: #333;
border-radius: 90rpx;
margin-top: 40px;
margin-top: 40rpx;
display: flex;
align-items: center;
justify-content: center;
......@@ -245,46 +227,5 @@ export default {
flex: 1;
text-align: center;
}
.good-list .good {
background: #fff;
border-radius: 10px;
overflow: hidden;
margin-bottom: 10px;
}
.good-list .good .good-img {
width: calc(50vw - 15px);
height: calc(50vw - 15px);
display: block;
}
.good-list .good .good-name {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
margin-bottom: 3px;
font-size: 13px;
margin: 7px 10px;
}
.good-list .good .good-info {
display: flex;
margin: 7px 10px;
margin-top: 0;
align-items: flex-end;
padding-bottom: 5px;
}
.good-list .good .good-info .price {
font-size: 14px;
color: #ff4544;
flex: 1;
}
.good-list .good .good-info .sell {
font-size: 11px;
color: gray;
flex: 1;
}
.good-list .good .good-info .cart {
width: 40rpx;
text-align: right;
}
</style>
plugin/api.js
View file @ f2954b96
......@@ -2,7 +2,7 @@ export default {
install(Vue, options) {
Vue.prototype.host = "https://wx.weibaoge.cn/web/index.php?_mall_id=1285"
Vue.prototype.request = function(param, success, failed, header = {}) {
Vue.prototype.request = function(param, success, failed) {
//网络请求
uni.request({
url: this.host + param.url,
......@@ -12,7 +12,7 @@ export default {
},
data: param.data,
success: res => {
if (res.data.code != 0) {
if (res.data.code != 0 && res.data.msg != "商品未上架") {
wx.showModal({
content: '网络开小差了，刷新页面重新加载吧',
showCancel: false
......@@ -33,6 +33,17 @@ export default {
}
});
}
Vue.prototype.apiheader = function() {
return {
'X-Access-Token': '_4Y_WpUZ4a6SI5uJgsZ4Lb7t9mvqJTyr',
'X-App-Platform': 'wxapp',
'X-App-Version': '4.2.47',
'X-Form-Id-List': [],
'X-Requested-With': 'XMLHttpRequest',
'X-User-Id': 19992,
'content-type': "application/json"
}
}
// Vue.prototype.post = function(obj, success, failed) {
// this.sendRequest(obj.url, 'POST', obj.data, success, failed)
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment