Skip to content

U
uni-pdtravel
Commit 15e6f9ca authored by zhoucong's avatar zhoucong
Browse files
Options

123

parent e24d9475
Show whitespace changes
Inline Side-by-side
Showing with 184 additions and 95 deletions
App.vue
View file @ 15e6f9ca
......@@ -12,7 +12,7 @@
if(!token&&path.indexOf("pages/ourPayment/ourPayment")==-1){//扫码支付页面不需要在此登录
setTimeout(()=>{//解决关联普通二维码扫码首次进入时一直显示登录中
uni.navigateTo({
// url: "/pages/login/login"
url: "/pages/login/login"
})
},300)
}
......
pages/vlog/product/product.vue
View file @ 15e6f9ca
......@@ -18,11 +18,11 @@
<text class="noprice">¥{{item.originalPrice}}</text>
<text class="price">¥{{item.sellingPrice}}</text>
</view>
<navigator url="../productDetails/productDetails" class="btnn">
<navigator :url="'../productDetails/productDetails?id='+item.id+'&name='+item.name" class="btnn">
<view>开始制作</view>
</navigator>
</view>
<view class="guige">
<view class="guige" v-if="item.priceStockList[0].standardName">
规格:{{item.priceStockList[0].standardName || ""}}
</view>
</view>
......@@ -45,11 +45,11 @@ export default {
getList(){//获取商品列表
this.$request("scenic/user/product/findProductList", {
openid: uni.getStorageSync("openid"),
productType:4,
type:4
}).then(res => {
if (res.code === "00") {
this.list=res.data.list
console.log(this.list);
}else{
uni.showModal({
title: '提示',
......
pages/vlog/productDetails/productDetails.vue
View file @ 15e6f9ca
<template>
<view class="content">
<view class="item">
<image src="https://cdn.uviewui.com/uview/swiper/1.jpg"></image>
<image :src="productVo.priceStockList[0].imgList[0].url"></image>
<view class="title" style="padding-top: 35rpx;">
<text>规格:24张</text>
<text>规格:{{productVo.priceStockList[0].standardName || ""}}</text>
<view style="margin-top: 30rpx;">
<text class="noprice">¥88</text>
<text class="price">¥88</text>
<text class="noprice">¥{{productVo.priceStockList[0].originalPrice || ""}}</text>
<text class="price">¥{{productVo.priceStockList[0].sellingPrice || ""}}</text>
</view>
</view>
</view>
<view class="" style="display: flex;">
<u-section title="模板选择" :right="false" color="#303133" ></u-section><text style="font-size: 24rpx;color: #ccc;margin-left: 30rpx;">Template Selection</text>
<u-section title="模板选择" :right="false" color="#303133"></u-section><text style="font-size: 24rpx;color: #ccc;margin-left: 30rpx;">Template Selection</text>
</view>
<image src="../../../static/img/vlog/icon/fengexian.png" mode="" style="width: 100%;height: 15rpx;"></image>
<view style="display: flex;justify-content: space-around;margin-top: 20rpx;">
......@@ -20,7 +20,7 @@
</view>
<view v-if="current===0">
<view class="cover">
<view class="coverItem" v-for="(item,index) in coverList" :key="index">
<view class="coverItem" v-for="(item,index) in imgList2" :key="index">
<image class="img" :src="item.url" mode="" @click="changeCover(item.url)"></image>
<u-icon v-if="cover===item.url" class="icon" name="checkmark-circle-fill" color="#2979FF" size="50"></u-icon>
</view>
......@@ -28,7 +28,7 @@
</view>
<view class="" v-else>
<view class="cover">
<view class="coverItem" v-for="(item,index) in insidePagesList" :key="index">
<view class="coverItem" v-for="(item,index) in imgList3" :key="index">
<image class="img" :src="item.url" mode="" @click="changeinsidePages(item.url)"></image>
<u-icon v-if="insidePages===item.url" class="icon" name="checkmark-circle-fill" color="#2979FF" size="50"></u-icon>
</view>
......@@ -36,25 +36,11 @@
</view>
<view style="display: flex;margin-top: 30rpx;">
<u-section title="详细参数" :right="false" color="#303133" ></u-section><text style="font-size: 24rpx;color: #ccc;margin-left: 30rpx;">Parameters</text>
<u-section title="详细参数" :right="false" color="#303133"></u-section><text style="font-size: 24rpx;color: #ccc;margin-left: 30rpx;">Parameters</text>
</view>
<image src="../../../static/img/vlog/icon/fengexian.png" mode="" style="width: 100%;height: 15rpx;"></image>
<view class="parameter">
<view class="parameterItem">
<view>产品品牌:</view>
<view>产品名称:</view>
<view>产品规格:</view>
<view>内页数量:</view>
<view>入册数量:</view>
<view>内页尺寸:</view>
</view>
<view class="parameterItem">
<view>相册工艺:</view>
<view>产品封面:</view>
<view>内页材质:</view>
<view>装订方式:</view>
<view>产品配送:</view>
</view>
<image :src="item.url" mode="widthFix" v-for="(item,index) in imgList1" :key="index"></image>
</view>
<view class="bottom" @click="beginMaking">
上传照片制作
......@@ -62,81 +48,184 @@
</view>
</template>
<script>
export default {
export default {
data() {
return {
current: 0,//封面内页切换
cover:"",//封面
coverList:[
{url:"https://cdn.uviewui.com/uview/swiper/1.jpg"},
{url:"https://cdn.uviewui.com/uview/swiper/2.jpg"},
{url:"https://cdn.uviewui.com/uview/swiper/3.jpg"},
],//封面列表
insidePages:"",//内页
insidePagesList:[
{url:"https://cdn.uviewui.com/uview/swiper/1.jpg"},
{url:"https://cdn.uviewui.com/uview/swiper/2.jpg"},
{url:"https://cdn.uviewui.com/uview/swiper/3.jpg"}
],//内页列表
list:[
{name:"封面"},
{name:"内页"}
],
productVo:{},//产品详情
imgList1:[],//详情列表
imgList2:[],//封面列表
imgList3:[],//内页列表
current: 0, //封面内页切换
cover: "", //封面
insidePages: "", //内页
}
},
onLoad(){//代替 vue 里面的 created
uni.setNavigationBarTitle({title:"欢乐集"})
onLoad(option) { //代替 vue 里面的 created
uni.setNavigationBarTitle({
title: option.name
})
this.getDetails(option.id)
},
onReady() {//代替 vue 里面的 mounted
onReady() { //代替 vue 里面的 mounted
},
methods: {
changeCover(url){//选择封面
this.cover=url
getDetails(id) { //获取商品详情
this.$request("scenic/user/product/findChoseProductInfo", {
productId: id,
openid: uni.getStorageSync("openid")
}).then(res => {
if (res.code === "00") {
this.productVo=res.data.productVo
res.data.productVo.imgList.forEach(item=>{
if(item.location===5){
this.imgList1.push(item)
}
if(item.location===6){
this.imgList2.push(item)
}
if(item.location===8){
this.imgList3.push(item)
}
})
} else {
uni.showModal({
title: '提示',
content: res.message,
showCancel: false,
})
}
})
},
changeCover(url) { //选择封面
this.cover = url
},
changeinsidePages(url){//选择内页
this.insidePages=url
changeinsidePages(url) { //选择内页
this.insidePages = url
},
beginMaking(){
if(this.cover===""){
return uni.showModal({title: '提示',content: '请选择封面',});
beginMaking() {
if (this.cover === "") {
return uni.showModal({
title: '提示',
content: '请选择封面',
});
}
if(this.insidePages===""){
return uni.showModal({title: '提示',content: '请选择内页',});
if (this.insidePages === "") {
return uni.showModal({
title: '提示',
content: '请选择内页',
});
}
this.$u.route({
url:'pages/vlog/uploadPictures/uploadPictures',
params:{
cover:this.cover,
insidePages:this.insidePages
url: 'pages/vlog/uploadPictures/uploadPictures',
params: {
cover: this.cover,
insidePages: this.insidePages
}
})
}
}
}
}
</script>
<style lang="scss" scoped>
.content{padding: 0 20rpx;box-sizing: border-box;margin-bottom:100rpx;text-align: center;
.item{display: flex;justify-content: space-between;padding: 30rpx 20rpx 20rpx 20rpx;
image{width: 48%;height: 220rpx; border-radius: 10rpx;}
.title{width: 48%;height: 220rpx;padding-top: 10rpx;margin-top: 20rpx;}
.content {
padding: 0 20rpx;
box-sizing: border-box;
margin-bottom: 100rpx;
text-align: center;
.item {
display: flex;
justify-content: space-between;
padding: 30rpx 20rpx 20rpx 20rpx;
image {
width: 48%;
height: 220rpx;
border-radius: 10rpx;
}
.noprice{font-size: 24rpx; text-decoration: line-through;color: #ccc;}
.price{font-size: 32rpx;color: #DE6F26;margin-left: 10rpx;}
.cover{display: flex;flex-wrap: wrap;justify-content: space-between;
.coverItem{width: 48.5%;height: 200rpx; position: relative;padding-top: 20rpx;
.img{width: 100%;height: 100%;border-radius: 10rpx;}
.icon{position: absolute;top: 25rpx;right: 5rpx;}
.title {
width: 48%;
height: 220rpx;
padding-top: 10rpx;
margin-top: 20rpx;
}
}
.parameter{display: flex;justify-content: space-between;
.parameterItem{width: 50%;text-align: left;color: #ccc;
view{margin: 10rpx 0;}
.noprice {
font-size: 24rpx;
text-decoration: line-through;
color: #ccc;
font-weight: bold;
}
.price {
font-size: 32rpx;
color: #DE6F26;
margin-left: 10rpx;
font-weight: bold;
}
.bottom{position: fixed;bottom: 0;width: 100%;height: 100rpx;background-color:#FFE600;right: 0;line-height: 100rpx;font-size: 32rpx;font-weight: bold;border-top-left-radius: 10rpx;border-top-right-radius: 10rpx;}
.cover {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.coverItem {
width: 48.5%;
height: 220rpx;
position: relative;
padding-top: 20rpx;
.img {
width: 100%;
height: 100%;
border-radius: 10rpx;
}
.icon {
position: absolute;
top: 25rpx;
right: 5rpx;
}
}
}
.parameter {
width: 100%;
image:{width: 100%;border-radius: 10rpx;}
}
.bottom {
position: fixed;
bottom: 0;
width: 100%;
height: 100rpx;
background-color: #FFE600;
right: 0;
line-height: 100rpx;
font-size: 32rpx;
font-weight: bold;
border-top-left-radius: 10rpx;
border-top-right-radius: 10rpx;
}
}
.btnn {
background-color: #ECF4FF;
width: 25%;
height: 60rpx;
line-height: 60rpx;
font-size: 26rpx;
}
.active {
background-color: #2979FF;
color: #fff;
}
.noactive {
color: #2979FF;
}
.btnn{background-color: #ECF4FF;width: 25%;height: 60rpx;line-height: 60rpx;font-size: 26rpx;}
.active{background-color: #2979FF;color: #fff;}
.noactive{color: #2979FF;}
</style>
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