Commit daf137d6fdb9a5992261ea0bf7a5ac6a3259250c

Authored by 范牧
Exists in master

合并冲突

src/pages/addOpticsData/addOpticsData.vue
1 <template> 1 <template>
2 <view class="wrap"> 2 <view class="wrap">
3 <!-- 弹窗 --> 3 <!-- 弹窗 -->
4 <uni-popup ref="popup" type="center"> 4 <uni-popup ref="popup" type="center">
5 <!-- 给一个左边弹窗的样式 --> 5 <!-- 给一个左边弹窗的样式 -->
6 <view class="popUpWrap" :class="{'popUpWrap1': whichTap == 0}"> 6 <view class="popUpWrap" :class="{'popUpWrap1': whichTap == 0}">
7 <!-- 关闭弹窗按钮 --> 7 <!-- 关闭弹窗按钮 -->
8 <view class="closeBtn" @click="this.$refs.popup.close()"></view> 8 <view class="closeBtn" @click="this.$refs.popup.close()"></view>
9 <!-- 左 --> 9 <!-- 左 -->
10 <image class="glassInfo" src="../../static/img/myOpticsData/glassInfo.png" v-if="whichTap == 0" mode="aspectFit"></image> 10 <image class="glassInfo" src="../../static/img/myOpticsData/glassInfo.png" v-if="whichTap == 0" mode="aspectFit"></image>
11 <!-- 右 --> 11 <!-- 右 -->
12 <image class="dataInfo" src="../../static/img/myOpticsData/dataInfo.png" v-else mode="aspectFit"></image> 12 <image class="dataInfo" src="../../static/img/myOpticsData/dataInfo.png" v-else mode="aspectFit"></image>
13 </view> 13 </view>
14 </uni-popup> 14 </uni-popup>
15 <!-- 点击弹窗部分 --> 15 <!-- 点击弹窗部分 -->
16 <view class="header"> 16 <view class="header">
17 <view class="headerLeft" @click=changeTap(0)> 17 <view class="headerLeft" @click=changeTap(0)>
18 <text>如何查看验光单?</text> 18 <text>如何查看验光单?</text>
19 <image src="../../static/dataLook.png" mode="aspectFit"></image> 19 <image src="../../static/dataLook.png" mode="aspectFit"></image>
20 </view> 20 </view>
21 <view class="headerRight" @click=changeTap(1)> 21 <view class="headerRight" @click=changeTap(1)>
22 <text>如何查看眼镜框架?</text> 22 <text>如何查看眼镜框架?</text>
23 <image src="../../static/glassLook.png" mode="aspectFit"></image> 23 <image src="../../static/glassLook.png" mode="aspectFit"></image>
24 </view> 24 </view>
25 </view> 25 </view>
26 <!-- 数据展示部分 --> 26 <!-- 数据展示部分 -->
27 <view class="dataMenu"> 27 <view class="dataMenu">
28 <uni-collapse accordion="true"> 28 <uni-collapse accordion="true">
29 <view class="item" v-for="(loveItem,index) in loveList" :key="index"> 29 <view class="item" v-for="(loveItem,index) in loveList" :key="index" >
30 <uni-collapse-item :title='loveItem.name' :time='getRightTime(loveItem.in_time)' :iconText='getFirstName(loveItem.name)' showAnimation='true'> 30 <uni-collapse-item :title='loveItem.name' :time='getRightTime(loveItem.in_time)' :iconText='getFirstName(loveItem.name)' showAnimation='true'>
31 <view class="loveDataInfo"> 31 <view class="loveDataInfo" @click="toNewData(2,index)">
32 <view class="dataInfoItem"> 32 <view class="dataInfoItem">
33 <text>度数(SPH):</text><text>左:{{loveItem.leftSph}}</text><text>右:{{loveItem.rightSph}}</text> 33 <text>度数(SPH):</text><text>左:{{loveItem.leftSph}}</text><text>右:{{loveItem.rightSph}}</text>
34 </view> 34 </view>
35 <view class="dataInfoItem"> 35 <view class="dataInfoItem">
36 <text>散光(CYL):</text><text>左:{{loveItem.leftCyl}}</text><text>右:{{loveItem.rightCyl}}</text> 36 <text>散光(CYL):</text><text>左:{{loveItem.leftCyl}}</text><text>右:{{loveItem.rightCyl}}</text>
37 </view> 37 </view>
38 <view class="dataInfoItem"> 38 <view class="dataInfoItem">
39 <text>轴位(AXI):</text><text>左:{{loveItem.leftAxi}}</text><text>右:{{loveItem.rightAxi}}</text> 39 <text>轴位(AXI):</text><text>左:{{loveItem.leftAxi}}</text><text>右:{{loveItem.rightAxi}}</text>
40 </view> 40 </view>
41 <view class="dataInfoItem"> 41 <view class="dataInfoItem">
42 <text>瞳距(PD):</text><text>{{loveItem.pd}}</text> 42 <text>瞳距(PD):</text><text>{{loveItem.pd}}</text>
43 </view> 43 </view>
44 </view> 44 </view>
45 </uni-collapse-item> 45 </uni-collapse-item>
46 </view> 46 </view>
47 </uni-collapse> 47 </uni-collapse>
48 </view> 48 </view>
49 <view class="footer"> 49 <view class="footer">
50 <button class="btn" type="default" @click="toNewData">新建验光单</button> 50 <button class="btn" type="default" @click="toNewData(1)">新建验光单</button>
51 </view> 51 </view>
52 </view> 52 </view>
53 </template> 53 </template>
54 54
55 <script> 55 <script>
56 import UniCollapse from '@/components/UniCollapse/UniCollapse.vue' 56 import UniCollapse from '@/components/UniCollapse/UniCollapse.vue'
57 import UniCollapseItem from '@/components/UniCollapseItem/UniCollapseItem.vue' 57 import UniCollapseItem from '@/components/UniCollapseItem/UniCollapseItem.vue'
58 import UniPopup from '@/components/UniPopup/uni-popup.vue' 58 import UniPopup from '@/components/UniPopup/uni-popup.vue'
59 import store from '@/store'; 59 import store from '@/store';
60 export default { 60 export default {
61 components: {UniCollapse,UniCollapseItem,UniPopup}, 61 components: {UniCollapse,UniCollapseItem,UniPopup},
62 data() { 62 data() {
63 return { 63 return {
64 whichTap:0 64 whichTap:0
65 }; 65 };
66 }, 66 },
67 onLoad: function(option) { 67 onLoad: function(option) {
68 //获取关心的人列表 68 //获取关心的人列表
69 store.dispatch('myLoveList/getLoveList', { 69 store.dispatch('myLoveList/getLoveList', {
70 uid: "1", 70 uid: this.$store.state.user.userInfo.uid,
71 }); 71 });
72 }, 72 },
73 computed:{ 73 computed:{
74 loveList() { 74 loveList() {
75 console.log(this.$store.state.myLoveList.loveList) 75 console.log(this.$store.state.myLoveList.loveList)
76 return this.$store.state.myLoveList.loveList || [] 76 return this.$store.state.myLoveList.loveList || []
77 }, 77 },
78 }, 78 },
79 methods:{ 79 methods:{
80 changeTap(item){ 80 changeTap(item){
81 this.whichTap = item 81 this.whichTap = item
82 this.$refs.popup.open() 82 this.$refs.popup.open()
83 }, 83 },
84 //给时间搞一个nice的格式 84 //给时间搞一个nice的格式
85 getRightTime(time){ 85 getRightTime(time){
86 //如果小于10 则返回'0'+m 86 //如果小于10 则返回'0'+m
87 // function add(m){return m<10?'0'+m:m} 87 // function add(m){return m<10?'0'+m:m}
88 //传给我的带有时分秒,想去除一下,但是完事IOS显示NaN,暂时不用吧 88 //传给我的带有时分秒,想去除一下,但是完事IOS显示NaN,暂时不用吧
89 // const oldTime = (new Date(time)).getTime() 89 // const oldTime = (new Date(time)).getTime()
90 // const year = new Date(oldTime).getFullYear() 90 // const year = new Date(oldTime).getFullYear()
91 // const month = new Date(oldTime).getMonth()+1 91 // const month = new Date(oldTime).getMonth()+1
92 // const day = new Date(oldTime).getDate() 92 // const day = new Date(oldTime).getDate()
93 // const newTime = add(year)+'-'+add(month)+'-'+add(day) 93 // const newTime = add(year)+'-'+add(month)+'-'+add(day)
94 94
95 // console.log(newTime) 95 // console.log(newTime)
96 // return newTime.replace(/-/g, '/') 96 // return newTime.replace(/-/g, '/')
97 return time 97 return time
98 }, 98 },
99 getFirstName(name){ 99 getFirstName(name){
100 return name.substring(0,1) 100 return name.substring(0,1)
101 }, 101 },
102 toNewData(){ 102 toNewData(item,index){
103 // const args={
104 // name:loveItem.name,
105 // pd:loveItem.pd,
106 // leftSph:loveItem.leftSph,
107 // rightSph:loveItem.rightSph,
108 // leftCyl:loveItem.leftCyl,
109 // rightCyl:loveItem.rightCyl,
110 // leftAxi:loveItem.leftAxi,
111 // rightAxi:loveItem.rightAxi
112 // }
103 uni.navigateTo({ 113 uni.navigateTo({
104 url:'../newOpticsData/newOpticsData' 114 // kinds 参数为 1 表示添加新的验光单, 2 表示更新验光单
115 // name 表示修改的人名儿,pd瞳距
116 url:'../newOpticsData/newOpticsData?kinds='+item+'&index='+index
105 }) 117 })
106 } 118 }
107 } 119 }
108 } 120 }
109 </script> 121 </script>
110 122
111 <style lang="scss"> 123 <style lang="scss">
112 .wrap{ 124 .wrap{
113 min-height: 100vh; 125 min-height: 100vh;
114 width: 100%; 126 width: 100%;
115 background-color: #F2F2F2; 127 background-color: #F2F2F2;
116 .header{ 128 .header{
117 height: 304rpx; 129 height: 304rpx;
118 width: 100%; 130 width: 100%;
119 background-color: #FFFFFF; 131 background-color: #FFFFFF;
120 display: flex; 132 display: flex;
121 justify-content: space-around; 133 justify-content: space-around;
122 align-items: center; 134 align-items: center;
123 view{ 135 view{
124 height: 210rpx; 136 height: 210rpx;
125 width: 304rpx; 137 width: 304rpx;
126 background: #FDF7F5; 138 background: #FDF7F5;
127 border-radius: 4px; 139 border-radius: 4px;
128 border-radius: 4px; 140 border-radius: 4px;
129 display: flex; 141 display: flex;
130 flex-direction: column; 142 flex-direction: column;
131 align-items: center; 143 align-items: center;
132 justify-content: center; 144 justify-content: center;
133 text{ 145 text{
134 font-size: 12px; 146 font-size: 12px;
135 color: #333333; 147 color: #333333;
136 } 148 }
137 image{ 149 image{
138 height: 144rpx; 150 height: 144rpx;
139 width: 144rpx; 151 width: 144rpx;
140 } 152 }
141 } 153 }
142 } 154 }
143 .dataMenu{ 155 .dataMenu{
144 margin-top: 20rpx; 156 margin-top: 20rpx;
145 box-shadow: 0 0 4px 0 rgba(133,107,107,0.10); 157 box-shadow: 0 0 4px 0 rgba(133,107,107,0.10);
146 width: 100%; 158 width: 100%;
147 background-color: #FFFFFF; 159 background-color: #FFFFFF;
160 margin-bottom: 120rpx;
148 .item{ 161 .item{
149 padding: 0 40rpx; 162 padding: 0 40rpx;
150 .loveDataInfo{ 163 .loveDataInfo{
151 padding: 0 44rpx 0 70rpx; 164 padding: 0 44rpx 0 70rpx;
152 display: flex; 165 display: flex;
153 justify-content: space-around; 166 justify-content: space-around;
154 flex-direction: column; 167 flex-direction: column;
155 align-items: flex-start; 168 align-items: flex-start;
156 .dataInfoItem{ 169 .dataInfoItem{
157 font-size: 12px; 170 font-size: 12px;
158 color: #333333; 171 color: #333333;
159 margin-bottom: 34rpx; 172 margin-bottom: 34rpx;
160 text{ 173 text{
161 font-size: 12px; 174 font-size: 12px;
162 color: #2A2A2A; 175 color: #2A2A2A;
163 margin-right: 20rpx; 176 margin-right: 20rpx;
164 } 177 }
165 } 178 }
166 } 179 }
167 } 180 }
168 } 181 }
169 .footer{ 182 .footer{
170 width: 100%; 183 width: 100%;
171 position: fixed; 184 position: fixed;
172 bottom: 0; 185 bottom: 0;
173 left: 0; 186 left: 0;
174 .btn{ 187 .btn{
175 width: 100%; 188 width: 100%;
176 height: 112rpx; 189 height: 112rpx;
177 line-height: 112rpx; 190 line-height: 112rpx;
178 background: #FF6B4A; 191 background: #FF6B4A;
179 font-size: 16px; 192 font-size: 16px;
180 color: #FFFFFF; 193 color: #FFFFFF;
181 } 194 }
182 } 195 }
183 } 196 }
184 .popUpWrap{ 197 .popUpWrap{
185 height: 850rpx; 198 height: 850rpx;
186 width: 542rpx; 199 width: 542rpx;
187 background-color: #FFFFFF; 200 background-color: #FFFFFF;
188 border-radius: 4px; 201 border-radius: 4px;
189 border: 1px solid #979797; 202 border: 1px solid #979797;
190 .closeBtn{ 203 .closeBtn{
191 height: 28rpx; 204 height: 28rpx;
192 width: 28rpx; 205 width: 28rpx;
193 // border: 1px solid red; 206 // border: 1px solid red;
194 position: absolute; 207 position: absolute;
195 top: 20rpx; 208 top: 20rpx;
196 right: 20rpx; 209 right: 20rpx;
197 } 210 }
198 .glassInfo{ 211 .glassInfo{
199 height: 474rpx; 212 height: 474rpx;
200 width: 528rpx; 213 width: 528rpx;
201 } 214 }
202 .dataInfo{ 215 .dataInfo{
203 height: 850rpx; 216 height: 850rpx;
204 width: 542rpx; 217 width: 542rpx;
205 } 218 }
206 } 219 }
207 .popUpWrap1{ 220 .popUpWrap1{
208 height: 474rpx; 221 height: 474rpx;
209 width: 528rpx; 222 width: 528rpx;
210 border-radius: 4px; 223 border-radius: 4px;
211 border: 1px solid #979797; 224 border: 1px solid #979797;
212 } 225 }
213 226
214 </style> 227 </style>
215 228
src/pages/detailStandard/detailStandard_k.vue
1 <template> 1 <template>
2 <view class="container"> 2 <view class="container">
3 <view class="detail"> 3 <view class="detail">
4 <view class="detail1"><image v-bind:src="details.data.img_index_url"></image></view> 4 <view class="detail1"><image v-bind:src="details.data.img_index_url"></image></view>
5 <view class="detail2"> 5 <view class="detail2">
6 <view class="detail2_name">{{details.data.p_name}}</view> 6 <view class="detail2_name">{{details.data.p_name}}</view>
7 <view class="detail2_tui"><span>支持7天无条件退货</span><span>顺丰发货</span></view> 7 <view class="detail2_tui"><span>支持7天无条件退货</span><span>顺丰发货</span></view>
8 <view class="detail2_price"> 8 <view class="detail2_price">
9 <span>¥{{details.data.p_sale_price*count}}</span> 9 <span>¥{{details.data.p_sale_price*count}}</span>
10 <view class="counter"> 10 <view class="counter">
11 <view class="btn" disabled="this.disabled" @click="counter(false)">-</view> 11 <view class="btn" disabled="this.disabled" @click="counter(false)">-</view>
12 <text>{{count}}</text> 12 <text>{{count}}</text>
13 <view class="btn" @click="counter(true)">+</view> 13 <view class="btn" @click="counter(true)">+</view>
14 </view> 14 </view>
15 </view> 15 </view>
16 </view> 16 </view>
17 </view> 17 </view>
18 <view class="choose"> 18 <view class="choose">
19 <view class="colour"> 19 <view class="colour">
20 <view class="colour1"><span>框架颜色</span><image src="/static/img/detail/xiala.png"></image></view> 20 <view class="colour1" @click="xialachange(0)">
21 <view class="colour_exp">*{{colour}}</view> 21 <text>框架颜色</text>
22 <image v-bind:src="isNone[0].img"></image>
23 </view>
24 <view class="colour_exp">*{{navData.colour}}</view>
22 <view> 25 <view>
23 <view class="colour2"> 26 <view class="colour2" v-bind:class="{'colour2_none' : isNone[0].state}">
24 <view 27 <view
25 v-for="(items,index) in details.data.skuList" 28 v-for="(items,index) in details.data.skuList"
26 :key="index" 29 :key="index"
27 @click="viewChoose(index)" 30 @click="viewChoose(index)"
28 class="colour2_view" 31 class="colour2_view"
29 v-bind:class="{'colour2_viewed': chooseNum == index}" 32 v-bind:class="{'colour2_viewed': chooseNum == index}"
30 > 33 >
31 <image v-bind:src="items.pic" @click="colourChange(index,items.sku_name)"></image> 34 <image v-bind:src="items.pic" @click="colourChange(index,items.sku_name)"></image>
32 </view> 35 </view>
33 </view> 36 </view>
34 </view> 37 </view>
35 <hr/> 38 <hr/>
36 </view> 39 </view>
37 <view class="size"> 40 <view class="size">
38 <view class="size1"> 41 <view class="size1" @click="xialachange(1)">
39 <view class="size1_1">框架尺寸</view> 42 <view class="size1_1">框架尺寸</view>
40 <view><span>+¥20</span><image src="/static/img/detail/xiala.png"></image></view> 43 <view><image v-bind:src="isNone[1].img"></image></view>
41 </view> 44 </view>
42 <view class="colour"> 45 <view class="colour">
43 <view class="colour_exp">*{{colour}}</view> 46 <view class="colour_exp">*{{navData.colour}}</view>
44 </view> 47 </view>
45 <view class="D3_list"> 48 <view class="D3_list" v-bind:class="{'colour2_none' : isNone[1].state}">
46 <view> 49 <view>
47 <view><image class="D3_image" v-bind:src ="parameter[0].img"></image></view> 50 <view><image class="D3_image" v-bind:src ="parameter[0].img"></image></view>
48 <view class="D3_list_jDu"> 51 <view class="D3_list_jDu">
49 <view class="D3_list1"> 52 <view class="D3_list1">
50 <c-progress class="c-progress" :inner_widthProp="300"/> 53 <c-progress class="c-progress" :inner_widthProp="300"/>
51 <text>{{details.data.frame_width}}mm</text> 54 <text>{{details.data.frame_width}}mm</text>
52 </view> 55 </view>
53 <view>{{parameter[0].standard}}</view> 56 <view>{{parameter[0].standard}}</view>
54 </view> 57 </view>
55 </view> 58 </view>
56 <view> 59 <view>
57 <view><image class="D3_image" v-bind:src ="parameter[1].img"></image></view> 60 <view><image class="D3_image" v-bind:src ="parameter[1].img"></image></view>
58 <view class="D3_list_jDu"> 61 <view class="D3_list_jDu">
59 <view class="D3_list1"> 62 <view class="D3_list1">
60 <c-progress class="c-progress" :inner_widthProp="190"/> 63 <c-progress class="c-progress" :inner_widthProp="190"/>
61 <view>{{details.data.glass_width}}mm</view> 64 <view>{{details.data.glass_width}}mm</view>
62 </view> 65 </view>
63 <view>{{parameter[1].standard}}</view> 66 <view>{{parameter[1].standard}}</view>
64 </view> 67 </view>
65 </view> 68 </view>
66 <view> 69 <view>
67 <view><image class="D3_image" v-bind:src ="parameter[2].img"></image></view> 70 <view><image class="D3_image" v-bind:src ="parameter[2].img"></image></view>
68 <view class="D3_list_jDu"> 71 <view class="D3_list_jDu">
69 <view class="D3_list1"> 72 <view class="D3_list1">
70 <c-progress class="c-progress" :inner_widthProp="210"/> 73 <c-progress class="c-progress" :inner_widthProp="210"/>
71 <view>{{details.data.glass_height}}mm</view> 74 <view>{{details.data.glass_height}}mm</view>
72 </view> 75 </view>
73 <view>{{parameter[2].standard}}</view> 76 <view>{{parameter[2].standard}}</view>
74 </view> 77 </view>
75 </view> 78 </view>
76 <view> 79 <view>
77 <view><image class="D3_image" v-bind:src ="parameter[3].img"></image></view> 80 <view><image class="D3_image" v-bind:src ="parameter[3].img"></image></view>
78 <view class="D3_list_jDu"> 81 <view class="D3_list_jDu">
79 82
80 <view class="D3_list1"> 83 <view class="D3_list1">
81 <c-progress class="c-progress" :inner_widthProp="160"/> 84 <c-progress class="c-progress" :inner_widthProp="160"/>
82 <view>{{details.data.nose_width}}mm</view> 85 <view>{{details.data.nose_width}}mm</view>
83 </view> 86 </view>
84 <view>{{parameter[3].standard}}</view> 87 <view>{{parameter[3].standard}}</view>
85 </view> 88 </view>
86 </view> 89 </view>
87 <view> 90 <view>
88 <view><image class="D3_image" v-bind:src ="parameter[4].img"></image></view> 91 <view><image class="D3_image" v-bind:src ="parameter[4].img"></image></view>
89 <view class="D3_list_jDu"> 92 <view class="D3_list_jDu">
90 <view class="D3_list1"> 93 <view class="D3_list1">
91 <c-progress class="c-progress" :inner_widthProp="260"/> 94 <c-progress class="c-progress" :inner_widthProp="260"/>
92 <view>{{details.data.leg_long}}mm</view> 95 <view>{{details.data.leg_long}}mm</view>
93 </view> 96 </view>
94 <view>{{parameter[4].standard}}</view> 97 <view>{{parameter[4].standard}}</view>
95 </view> 98 </view>
96 </view> 99 </view>
97 <hr/> 100 <hr/>
98 </view> 101 </view>
99 </view> 102 </view>
100 <view class="part"> 103 <view class="part">
101 <view class="size1"> 104 <view class="size1" @click="xialachange(2)">
102 <view class="size1_1">配件</view> 105 <view class="size1_1" >配件</view>
103 <view><span>+¥0.00</span><image src="/static/img/detail/xiala.png"></image></view> 106 <view>
107 <span>+¥0.00</span>
108 <image v-bind:src="isNone[2].img"></image>
109 </view>
104 </view> 110 </view>
105 <view class="colour_exp">*0290</view> 111 <view class="colour_exp">*0290</view>
106 <view class="part_som"> 112 <view class="part_som" v-bind:class="{'colour2_none' : isNone[2].state}">
107 <view 113 <view
108 v-for="(part) in part" 114 v-for="(part) in part"
109 :key="part.key" 115 :key="part.key"
110 v-bind:class="{'size_viewed': part.is_actived}" 116 v-bind:class="{'size_viewed': part.is_actived}"
111 > 117 >
112 <image v-bind:src="part.img"></image> 118 <image v-bind:src="part.img"></image>
113 </view> 119 </view>
114 </view> 120 </view>
115 </view> 121 </view>
116 </view> 122 </view>
117 <view class="buy"> 123 <view class="buy">
118 <view class="buy1">选了镜框,想选镜片?</view> 124 <view class="buy1">选了镜框,想选镜片?</view>
119 <view class="buy2">系统已为你保存好已选镜框,放心去选镜片吧!</view> 125 <view class="buy2">系统已为你保存好已选镜框,放心去选镜片吧!</view>
120 <view class="buy3"> 126 <view class="buy3">
121 <view class="buy3_1">暂时不选</view> 127 <view class="buy3_1">暂时不选</view>
122 <view class="buy3_2" @click="popArgs">立即去选</view> 128 <view class="buy3_2" @click="popArgs">立即去选</view>
123 </view> 129 </view>
124 </view> 130 </view>
125 <view class="zhanwei"></view> 131 <view class="zhanwei"></view>
126 <view class="button"><view>立即结算</view></view> 132 <view class="button"><view @click="popSure(details.data.p_name,details.data.p_sale_price)" >立即结算</view></view>
127 </view> 133 </view>
128 </template> 134 </template>
129 <script> 135 <script>
130 import CProgress from '../../components/UniSliper/UniSliper' 136 import CProgress from '../../components/UniSliper/UniSliper'
131 import store from '@/store' 137 import store from '@/store'
132 138
133 export default { 139 export default {
134 components: { 140 components: {
135 CProgress 141 CProgress
136 }, 142 },
137 data(){ 143 data(){
138 return{ 144 return{
139 count: 1, 145 count: 1,
140 colour: '1.56非球面防蓝光_亚黑色', 146 // colour: '1.56非球面防蓝光_亚黑色',
141 chooseNum : '', 147 chooseNum : '',
148 isNone:[
149 {state: false ,img: '/static/img/detail/xiala.png'},
150 {state: false ,img: '/static/img/detail/xiala.png'},
151 {state: false ,img: '/static/img/detail/xiala.png'},
152 {state: false ,img: '/static/img/detail/xiala.png'},
153 {state: false ,img: '/static/img/detail/xiala.png'},
154 ],
155 //传参
156 navData:{
157 pid: "26",
158 p_root_index: "2",
159 name:'',
160 price:'',
161 colour: '1.56非球面防蓝光_亚黑色',
162 },
163
164 //尺寸
142 parameter:[ 165 parameter:[
143 {key: 0,img:'/static/img/detail/d2.png', standard:'框架宽', slength:139}, 166 {key: 0,img:'/static/img/detail/d2.png', standard:'框架宽', slength:139},
144 {key: 1,img:'/static/img/detail/d3.png', standard:'镜片宽', slength:51}, 167 {key: 1,img:'/static/img/detail/d3.png', standard:'镜片宽', slength:51},
145 {key: 2,img:'/static/img/detail/d4.png', standard:'镜片高', slength:45}, 168 {key: 2,img:'/static/img/detail/d4.png', standard:'镜片高', slength:45},
146 {key: 3,img:'/static/img/detail/d5.png', standard:'鼻架宽', slength:19}, 169 {key: 3,img:'/static/img/detail/d5.png', standard:'鼻架宽', slength:19},
147 {key: 4,img:'/static/img/detail/d6.png', standard:'框架耳长', slength:138}, 170 {key: 4,img:'/static/img/detail/d6.png', standard:'框架耳长', slength:138},
148 ], 171 ],
149 //配饰 172 //配饰
150 part:[ 173 part:[
151 {key: 0,img:'/static/img/detail/Kuang/g1.png',is_actived:true}, 174 {key: 0,img:'/static/img/detail/Kuang/g1.png',is_actived:true},
152 {key: 1,img:'/static/img/detail/Kuang/g1.png',is_actived:false}, 175 {key: 1,img:'/static/img/detail/Kuang/g1.png',is_actived:false},
153 {key: 2,img:'/static/img/detail/Kuang/g2.png',is_actived:false}, 176 {key: 2,img:'/static/img/detail/Kuang/g2.png',is_actived:false},
154 {key: 3,img:'/static/img/detail/Kuang/g1.png',is_actived:false}, 177 {key: 3,img:'/static/img/detail/Kuang/g1.png',is_actived:false},
155 {key: 4,img:'/static/img/detail/Kuang/g1.png',is_actived:false}, 178 {key: 4,img:'/static/img/detail/Kuang/g1.png',is_actived:false},
156 {key: 5,img:'/static/img/detail/Kuang/g3.png',is_actived:false}, 179 {key: 5,img:'/static/img/detail/Kuang/g3.png',is_actived:false},
157 {key: 6,img:'/static/img/detail/Kuang/g3.png',is_actived:false}, 180 {key: 6,img:'/static/img/detail/Kuang/g3.png',is_actived:false},
158 {key: 7,img:'/static/img/detail/Kuang/g2.png',is_actived:false}, 181 {key: 7,img:'/static/img/detail/Kuang/g2.png',is_actived:false},
159 ], 182 ],
160 } 183 }
161 }, 184 },
162 185
163 computed: { 186 computed: {
164 details(){ 187 details(){
165 return this.$store.state.detailStandard_k.list 188 return this.$store.state.detailStandard_k.list
166 }, 189 },
167 }, 190 },
168 onLoad:function(){ 191 onLoad:function(){
169 store.dispatch('detailStandard_k/fetch', { 192 store.dispatch('detailStandard_k/fetch', {
170 uid: "1", 193 uid: "1",
171 pid: "26", 194 pid: "26",
195 p_root_index: "2"
172 }); 196 });
173 // console.log(this.$store.state.detailStandard_k.list+'ssss'); 197 // console.log(this.$store.state.detailStandard_k.list+'ssss');
174 }, 198 },
175 methods: { 199 methods: {
176 counter(isadd){ 200 counter(isadd){
177 if(isadd){ 201 if(isadd){
178 this.count++ 202 this.count++
179 }else{ 203 }else{
180 this.count <= 1? this.disabled = true:this.count-- 204 this.count <= 1? this.disabled = true:this.count--
181 } 205 }
182 }, 206 },
207 xialachange(index){
208 this.isNone[index].state = !this.isNone[index].state;
209 if(this.isNone[index].state){
210 this.isNone[index].img = '/static/img/detail/right.png'
211 }else{
212 this.isNone[index].img = '/static/img/detail/xiala.png'
213 }
214 },
183 colourChange(index,e){ 215 colourChange(index,e){
184 this.colour = e ; //颜色选择 216 this.navData.colour = e ; //颜色选择
185 // console.log(index,e); 217 console.log(index,this.navData.colour);
186 218
187 }, 219 },
188 viewChoose(index){ 220 viewChoose(index,e){
189 this.chooseNum = index 221 this.chooseNum = index
190 }, 222 },
191 popArgs(){ 223 popArgs(){
192 uni.navigateTo({ 224 uni.navigateTo({
193 url: '../detailsChoiceArgs/detailsChoiceArgs', 225 url: '../detailsChoiceArgs/detailsChoiceArgs',
194 success: res => {}, 226 success: res => {},
195 fail: () => {}, 227 fail: () => {},
196 complete: () => {} 228 complete: () => {}
197 }); 229 });
198 } 230 },
231 //跳转确认订单页及传参
232 popSure(name,price){
233 this.navData.name = name;
234 this.navData.price = price;
235 var navData = JSON.stringify(this.navData);
236 uni.navigateTo({
237 url: '../confirmOrder/confirmOrder?index='+navData,
238 });
239 console.log(this.navData)
240 },
199 } 241 }
200 242
201 } 243 }
202 </script> 244 </script>
203 245
204 <style lang="scss"> 246 <style lang="scss">
205 .container{ 247 .container{
206 min-height: 100vh; 248 min-height: 100vh;
207 background: #F2F2F2; 249 background: #F2F2F2;
208 padding-top: 10px; 250 padding-top: 10px;
209 box-sizing: border-box; 251 box-sizing: border-box;
210 } 252 }
211 hr{ 253 hr{
212 border: none; 254 border: none;
213 height: 1px; 255 height: 1px;
214 background: #F2F2F2; 256 background: #F2F2F2;
215 margin-top: 18px; 257 margin-top: 18px;
216 } 258 }
217 .detail{ 259 .detail{
218 height: 272rpx; 260 height: 272rpx;
219 background: #FFFFFF; 261 background: #FFFFFF;
220 border-radius: 8px; 262 border-radius: 8px;
221 padding: 16px; 263 padding: 16px;
222 box-sizing: border-box; 264 box-sizing: border-box;
223 display: flex; 265 display: flex;
224 justify-content: space-between; 266 justify-content: space-between;
225 align-items: center; 267 align-items: center;
226 } 268 }
227 .detail1{ 269 .detail1{
228 height: 178rpx; 270 height: 178rpx;
229 width: 188rpx; 271 width: 188rpx;
230 image{ 272 image{
231 width: 100%; 273 width: 100%;
232 height: 100%; 274 height: 100%;
233 border-radius: 8px; 275 border-radius: 8px;
234 } 276 }
235 } 277 }
236 .detail2{ 278 .detail2{
237 width: 68%; 279 width: 68%;
238 view{ 280 view{
239 margin-bottom: 6px; 281 margin-bottom: 6px;
240 font-family: PingFangSC-Regular; 282 font-family: PingFangSC-Regular;
241 } 283 }
242 .detail2_name{ 284 .detail2_name{
243 font-size: 14px; 285 font-size: 14px;
244 color: #333333; 286 color: #333333;
245 letter-spacing: -0.26px; 287 letter-spacing: -0.26px;
246 line-height: 18px; 288 line-height: 18px;
247 overflow:hidden; 289 overflow:hidden;
248 text-overflow:ellipsis; 290 text-overflow:ellipsis;
249 display:-webkit-box; 291 display:-webkit-box;
250 -webkit-box-orient:vertical; 292 -webkit-box-orient:vertical;
251 -webkit-line-clamp:2; 293 -webkit-line-clamp:2;
252 } 294 }
253 .detail2_tui{ 295 .detail2_tui{
254 font-size: 10px; 296 font-size: 10px;
255 color: #999999; 297 color: #999999;
256 letter-spacing: -0.19px; 298 letter-spacing: -0.19px;
257 span{ 299 span{
258 margin-right: 10px; 300 margin-right: 10px;
259 } 301 }
260 } 302 }
261 .detail2_price{ 303 .detail2_price{
262 font-size: 14px; 304 font-size: 14px;
263 color: #FF6B4A; 305 color: #FF6B4A;
264 letter-spacing: -0.26px; 306 letter-spacing: -0.26px;
265 } 307 }
266 } 308 }
267 .counter{ 309 .counter{
268 display: flex; 310 display: flex;
269 flex-direction: row; 311 flex-direction: row;
270 justify-content: space-between; 312 justify-content: space-between;
271 font-size: 28rpx; 313 font-size: 28rpx;
272 color: #333333; 314 color: #333333;
273 width: 122rpx; 315 width: 122rpx;
274 float: right; 316 float: right;
275 .btn{ 317 .btn{
276 display: flex; 318 display: flex;
277 justify-content: center; 319 justify-content: center;
278 line-height: 32rpx; 320 line-height: 32rpx;
279 height: 32rpx; 321 height: 32rpx;
280 width: 32rpx; 322 width: 32rpx;
281 background-color: #F2F2F2; 323 background-color: #F2F2F2;
282 color: #CFCFCF; 324 color: #CFCFCF;
283 } 325 }
284 } 326 }
285 .choose{ 327 .choose{
286 background: #FFFFFF; 328 background: #FFFFFF;
287 padding: 16px; 329 padding: 16px;
288 box-sizing: border-box; 330 box-sizing: border-box;
289 margin-top: 10px; 331 margin-top: 10px;
290 border-radius: 8px; 332 border-radius: 8px;
291 .colour1{ 333 .colour1{
292 span{ 334 span{
293 font-family: PingFangSC-Medium; 335 font-family: PingFangSC-Medium;
294 font-size: 16px; 336 font-size: 16px;
295 color: #333333; 337 color: #333333;
296 letter-spacing: -0.3px; 338 letter-spacing: -0.3px;
297 text-align: justify; 339 text-align: justify;
298 line-height: 24px; 340 line-height: 24px;
299 font-weight: bold; 341 font-weight: bold;
300 } 342 }
301 image{ 343 image{
302 float: right; 344 float: right;
303 width: 40rpx; 345 width: 40rpx;
304 height: 36rpx; 346 height: 36rpx;
305 } 347 }
306 } 348 }
307 .colour_exp{ 349 .colour_exp{
308 font-family: PingFangSC-Regular; 350 font-family: PingFangSC-Regular;
309 font-size: 12px; 351 font-size: 12px;
310 color: #666666; 352 color: #666666;
311 letter-spacing: 0; 353 letter-spacing: 0;
312 margin-top: 10px; 354 margin-top: 10px;
313 margin-bottom: 10px; 355 margin-bottom: 10px;
314 } 356 }
315 .colour2{ 357 .colour2{
316 display: grid; 358 display: grid;
317 grid-template-columns: repeat(5, 17%); 359 grid-template-columns: repeat(5, 17%);
318 justify-content: space-between ; 360 justify-content: space-between ;
319 grid-row-gap: 10px; 361 grid-row-gap: 10px;
320 margin-bottom: 14px; 362 margin-bottom: 14px;
321 .colour2_view{ 363 .colour2_view{
322 border: 1px solid #F2F2F2; 364 border: 1px solid #F2F2F2;
323 image{ 365 image{
324 width: 100rpx; 366 width: 100rpx;
325 height: 60rpx; 367 height: 60rpx;
326 } 368 }
327 } 369 }
328 .colour2_viewed{ 370 .colour2_viewed{
329 border: 1px solid #FF6B4A; 371 border: 1px solid #FF6B4A;
330 image{ 372 image{
331 width: 100rpx; 373 width: 100rpx;
332 height: 60rpx; 374 height: 60rpx;
333 } 375 }
334 } 376 }
335 } 377 }
378 .colour2_none{
379 display: none;
380 }
336 } 381 }
337 .size,.part{ 382 .size,.part{
338 margin-top:14px; 383 margin-top:14px;
339 .size1{ 384 .size1{
340 display: flex; 385 display: flex;
341 justify-content: space-between; 386 justify-content: space-between;
342 margin-bottom: 10px; 387 margin-bottom: 10px;
343 .size1_1{ 388 .size1_1{
344 font-weight: bold; 389 font-weight: bold;
345 font-family: PingFangSC-Medium; 390 font-family: PingFangSC-Medium;
346 font-size: 16px; 391 font-size: 16px;
347 color: #333333; 392 color: #333333;
348 letter-spacing: -0.3px; 393 letter-spacing: -0.3px;
349 line-height: 24px; 394 line-height: 24px;
350 } 395 }
351 view{ 396 view{
352 span{ 397 span{
353 font-family: PingFangSC-Regular; 398 font-family: PingFangSC-Regular;
354 font-size: 14px; 399 font-size: 14px;
355 color: #FF6B4A; 400 color: #FF6B4A;
356 letter-spacing: -0.26px; 401 letter-spacing: -0.26px;
357 margin-right: 12px; 402 margin-right: 12px;
358 } 403 }
359 image{ 404 image{
360 width: 40rpx; 405 width: 40rpx;
361 height: 36rpx; 406 height: 36rpx;
362 } 407 }
363 } 408 }
364 } 409 }
365 .size2{ 410 .size2{
366 view{ 411 view{
367 display: inline-flex; 412 display: inline-flex;
368 align-items: center; 413 align-items: center;
369 justify-content: center; //字体居中 414 justify-content: center; //字体居中
370 margin-right: 12px; 415 margin-right: 12px;
371 margin-bottom: 20px; 416 margin-bottom: 20px;
372 width: 136rpx; 417 width: 136rpx;
373 height: 60rpx; 418 height: 60rpx;
374 background: #F2F2F2; 419 background: #F2F2F2;
375 border-radius: 2px; 420 border-radius: 2px;
376 font-family: PingFangSC-Regular; 421 font-family: PingFangSC-Regular;
377 font-size: 12px; 422 font-size: 12px;
378 color: #666666; 423 color: #666666;
379 } 424 }
380 view:hover{ 425 view:hover{
381 color: #FF6B4A; 426 color: #FF6B4A;
382 background: rgba(255,107,74,0.15); 427 background: rgba(255,107,74,0.15);
383 } 428 }
384 } 429 }
385 .D3_list{ 430 .D3_list{
386 margin-bottom: 4px; 431 margin-bottom: 4px;
387 } 432 }
388 .D3_list>view{ 433 .D3_list>view{
389 display: flex; 434 display: flex;
390 align-content: center; 435 align-content: center;
391 margin-bottom: 10px; 436 margin-bottom: 10px;
392 view{ 437 view{
393 margin-right: 10px; 438 margin-right: 10px;
394 } 439 }
395 } 440 }
396 .D3_list image{ 441 .D3_list image{
397 width: 50px; 442 width: 50px;
398 height: 25px; 443 height: 25px;
399 margin-right: 6px; 444 margin-right: 6px;
400 } 445 }
401 .D3_list span{ 446 .D3_list span{
402 margin-left: 6px; 447 margin-left: 6px;
403 margin-right: 5px; 448 margin-right: 5px;
404 font-family: 'PingFangSC-Regular'; 449 font-family: 'PingFangSC-Regular';
405 } 450 }
406 .D3_list_jDu{ 451 .D3_list_jDu{
407 view{ 452 view{
408 font-family: PingFangSC-Regular; 453 font-family: PingFangSC-Regular;
409 font-size: 10px; 454 font-size: 10px;
410 color: #999999; 455 color: #999999;
411 letter-spacing: -0.19px; 456 letter-spacing: -0.19px;
412 } 457 }
413 .D3_list1{ 458 .D3_list1{
414 display: flex; 459 display: flex;
415 } 460 }
416 } 461 }
417 } 462 }
418 .part{ 463 .part{
419 .part_som{ 464 .part_som{
420 display: grid; 465 display: grid;
421 justify-content: space-between; 466 justify-content: space-between;
422 grid-template-columns: repeat(4, 22%); 467 grid-template-columns: repeat(4, 22%);
423 grid-row-gap: 12px; 468 grid-row-gap: 12px;
424 margin-bottom: 14px; 469 margin-bottom: 14px;
425 view{ 470 view{
426 border: 1px solid #F2F2F2; 471 border: 1px solid #F2F2F2;
427 height: 72rpx; 472 height: 72rpx;
428 image{ 473 image{
429 width: 100%; 474 width: 100%;
430 height: 100%; 475 height: 100%;
431 } 476 }
432 } 477 }
433 .size_viewed{ 478 .size_viewed{
434 border: 1px solid #FF6B4A; 479 border: 1px solid #FF6B4A;
435 height: 72rpx; 480 height: 72rpx;
436 image{ 481 image{
437 width: 100%; 482 width: 100%;
438 height: 100%; 483 height: 100%;
439 } 484 }
440 } 485 }
441 } 486 }
487 .colour2_none{
488 display: none;
489 }
442 } 490 }
443 491
444 .buy{ 492 .buy{
445 height: 300rpx; 493 height: 300rpx;
446 background: #FFFFFF ; 494 background: #FFFFFF ;
447 margin-top: 10px; 495 margin-top: 10px;
448 border-radius: 8px; 496 border-radius: 8px;
449 padding-top: 20px; 497 padding-top: 20px;
450 box-sizing: border-box; 498 box-sizing: border-box;
451 margin-bottom: 20px; 499 margin-bottom: 20px;
452 } 500 }
453 .buy1{ 501 .buy1{
454 font-family: PingFangSC-Medium; 502 font-family: PingFangSC-Medium;
455 font-size: 16px; 503 font-size: 16px;
456 font-weight: bold; 504 font-weight: bold;
457 color: #333333; 505 color: #333333;
458 text-align: center; 506 text-align: center;
459 } 507 }
460 .buy2{ 508 .buy2{
461 font-family: PingFangSC-Regular; 509 font-family: PingFangSC-Regular;
462 font-size: 12px; 510 font-size: 12px;
463 color: #999999; 511 color: #999999;
464 text-align: center; 512 text-align: center;
465 margin: 10px; 513 margin: 10px;
466 } 514 }
467 .buy3{ 515 .buy3{
468 font-family: PingFangSC-Regular; 516 font-family: PingFangSC-Regular;
469 font-size: 16px; 517 font-size: 16px;
470 display: flex; 518 display: flex;
471 justify-content: center; 519 justify-content: center;
472 margin-top: 14px; 520 margin-top: 14px;
473 view{ 521 view{
474 border-radius: 20px; 522 border-radius: 20px;
475 width: 240rpx; 523 width: 240rpx;
476 height: 80rpx; 524 height: 80rpx;
477 display: flex; 525 display: flex;
478 justify-content: center; 526 justify-content: center;
479 align-items: center; 527 align-items: center;
480 } 528 }
481 .buy3_1{ 529 .buy3_1{
482 margin-right: 20px; 530 margin-right: 20px;
483 background: rgba(255,107,74,0.15); 531 background: rgba(255,107,74,0.15);
484 color: #FF6B4A ; 532 color: #FF6B4A ;
485 } 533 }
486 .buy3_2{ 534 .buy3_2{
487 background: #FF6B4A; 535 background: #FF6B4A;
488 color: #FFFFFF ; 536 color: #FFFFFF ;
489 } 537 }
490 } 538 }
491 .zhanwei{ 539 .zhanwei{
492 background: #F2F2F2; 540 background: #F2F2F2;
493 height: 120rpx; 541 height: 120rpx;
494 } 542 }
495 .button{ 543 .button{
496 position: fixed; 544 position: fixed;
497 bottom: 0; 545 bottom: 0;
498 width:100%; 546 width:100%;
499 height: 112rpx; 547 height: 112rpx;
500 background: #FF6B4A 100%; 548 background: #FF6B4A 100%;
501 view{ 549 view{
502 color: #FFFFFF; 550 color: #FFFFFF;
503 height: 100%; 551 height: 100%;
504 display: flex; 552 display: flex;
505 justify-content: center; 553 justify-content: center;
506 align-items: center; 554 align-items: center;
507 font-family: PingFangSC-Regular; 555 font-family: PingFangSC-Regular;
508 font-size: 16px; 556 font-size: 16px;
509 } 557 }
510 } 558 }
511 </style> 559 </style>
src/pages/detailStandard/detailStandard_sun.vue
1 <template> 1 <template>
2 <view class="container"> 2 <view>
3 <view class="container" v-if="type===2">
3 <view class="detail"> 4 <view class="detail">
4 <view class="detail1"><image v-bind:src="details.data.img_index_url"></image></view> 5 <view class="detail1"><image v-bind:src="details.data.img_index_url"></image></view>
5 <view class="detail2"> 6 <view class="detail2">
6 <view class="detail2_name">{{details.data.p_name}}</view> 7 <view class="detail2_name">{{details.data.p_name}}</view>
7 <view class="detail2_tui"><text>支持7天无条件退货</text><text>顺丰发货</text></view> 8 <view class="detail2_tui"><text>支持7天无条件退货</text><text>顺丰发货</text></view>
8 <view class="detail2_price"> 9 <view class="detail2_price">
9 <text>¥{{details.data.p_sale_price*count}}</text> 10 <text>¥{{details.data.p_sale_price*count}}</text>
10 <view class="counter"> 11 <view class="counter">
11 <view class="btn" disabled="this.disabled" @click="counter(false)">-</view> 12 <view class="btn" disabled="this.disabled" @click="counter(false)">-</view>
12 <text>{{count}}</text> 13 <text>{{count}}</text>
13 <view class="btn" @click="counter(true)">+</view> 14 <view class="btn" @click="counter(true)">+</view>
14 </view> 15 </view>
15 </view> 16 </view>
16 </view> 17 </view>
17 </view> 18 </view>
18 <view class="choose"> 19 <view class="choose">
19 <view class="colour"> 20 <view class="colour">
20 <view class="colour1"><text>框架颜色</text><image src="/static/img/detail/xiala.png"></image></view> 21 <view class="colour1" @click="xialachange(0)">
21 <view class="colour_exp">*{{colour}}</view> 22 <text>框架颜色</text>
23 <image v-bind:src="isNone[0].img"></image>
24 </view>
25 <view class="colour_exp">*{{navData.colour}}</view>
22 <view> 26 <view>
23 <view class="colour2"> 27 <view class="colour2" v-bind:class="{'colour2_none' : isNone[0].state}">
24 <view 28 <view
25 v-for="(items,index) in details.data.skuList" 29 v-for="(items,index) in details.data.skuList"
26 :key="index" 30 :key="index"
27 @click="viewChoose(index)" 31 @click="viewChoose(index)"
28 class="colour2_view" 32 class="colour2_view"
29 v-bind:class="{'colour2_viewed': chooseNum == index}" 33 v-bind:class="{'colour2_viewed': chooseNum == index}"
30 > 34 >
31 <image v-bind:src="items.pic" @click="colourChange(index,items.sku_name)"></image> 35 <image v-bind:src="items.pic" @click="colourChange(index,items.sku_name)"></image>
32 </view> 36 </view>
33 </view> 37 </view>
34 </view> 38 </view>
35 <hr/> 39 <hr/>
36 </view> 40 </view>
37 <view class="colour"> 41 <view class="colour">
38 <view class="colour1"><text>镜片颜色</text><image src="/static/img/detail/xiala.png"></image></view> 42 <view class="colour1" @click="xialachange(1)">
43 <text>镜片颜色</text>
44 <image v-bind:src="isNone[1].img"></image>
45 </view>
39 <view class="colour_exp">*BL192345 粉紫色【限时打折】</view> 46 <view class="colour_exp">*BL192345 粉紫色【限时打折】</view>
40 <view> 47 <view v-bind:class="{'colour2_none' : isNone[1].state}">
41 <view class="jp_colour2"> 48 <view class="jp_colour2">
42 <view 49 <view
43 v-for="(items,index) in jp_colour" 50 v-for="(items,index) in jp_colour"
44 :key="index" 51 :key="index"
45 class="jp_colour2_view" 52 class="jp_colour2_view"
46 > 53 >
47 <image v-bind:src="items.img"></image> 54 <image v-bind:src="items.img"></image>
48 </view> 55 </view>
49 </view> 56 </view>
50 </view> 57 </view>
51 <hr/> 58 <hr/>
52 </view> 59 </view>
53 <view class="colour"> 60 <view class="colour">
54 <view class="colour1"> 61 <view class="colour1" @click="xialachange(2)">
55 <text>{{details.data.attrList[0].meta_name}}</text> 62 <text>{{details.data.attrList[0].meta_name}}</text>
56 <text class="colour_exp colour1_span2">注:折射率越高,镜片越薄</text> 63 <text class="colour_exp colour1_span2">注:折射率越高,镜片越薄</text>
57 <image src="/static/img/detail/xiala.png"></image> 64 <image v-bind:src="isNone[2].img"></image>
58 </view> 65 </view>
59 <view> 66 <view>
60 <view class="split"> 67 <view class="colour_exp">*{{navData.split}}</view>
68 <view class="split" v-bind:class="{'colour2_none' : isNone[2].state}">
61 <view 69 <view
62 v-for="(items,index) in details.data.attrList[0].attr" 70 v-for="(items,index) in details.data.attrList[0].attr"
63 :key="index" 71 :key="index"
64 > 72 >
65 <view 73 <view
66 class="split_colour2" 74 class="split_colour2"
67 @click="splitChoose(index)" 75 @click="splitChoose(index,items.name)"
68 v-bind:class="{'split_colour2 split_colour2_actived' : isSplit == index}" 76 v-bind:class="{'split_colour2 split_colour2_actived' : isSplit == index}"
69 >{{items.name}}</view> 77 >{{items.name}}</view>
70 </view> 78 </view>
71 </view> 79 </view>
72 </view> 80 </view>
73 <hr/> 81 <hr/>
74 </view> 82 </view>
75 <view class="size"> 83 <view class="size">
76 <view class="size1"> 84 <view class="size1" @click="xialachange(3)">
77 <view class="size1_1">框架尺寸</view> 85 <view class="size1_1">框架尺寸</view>
78 <view><span>+¥20</span><image src="/static/img/detail/xiala.png"></image></view> 86 <view><image v-bind:src="isNone[3].img"></image></view>
79 </view> 87 </view>
80 <view class="colour"> 88 <view class="colour">
81 <view class="colour_exp">*{{colour}}</view> 89 <view class="colour_exp">*{{navData.colour}}</view>
82 </view> 90 </view>
83 <view class="D3_list"> 91 <view class="D3_list" v-bind:class="{'colour2_none' : isNone[3].state}">
84 <view> 92 <view>
85 <view><image class="D3_image" v-bind:src ="parameter[0].img"></image></view> 93 <view><image class="D3_image" v-bind:src ="parameter[0].img"></image></view>
86 <view class="D3_list_jDu"> 94 <view class="D3_list_jDu">
87 <view class="D3_list1"> 95 <view class="D3_list1">
88 <c-progress class="c-progress" :inner_widthProp="300"/> 96 <c-progress class="c-progress" :inner_widthProp="300"/>
89 <text>{{details.data.frame_width}}mm</text> 97 <text>{{details.data.frame_width}}mm</text>
90 </view> 98 </view>
91 <view>{{parameter[0].standard}}</view> 99 <view>{{parameter[0].standard}}</view>
92 </view> 100 </view>
93 </view> 101 </view>
94 <view> 102 <view>
95 <view><image class="D3_image" v-bind:src ="parameter[1].img"></image></view> 103 <view><image class="D3_image" v-bind:src ="parameter[1].img"></image></view>
96 <view class="D3_list_jDu"> 104 <view class="D3_list_jDu">
97 <view class="D3_list1"> 105 <view class="D3_list1">
98 <c-progress class="c-progress" :inner_widthProp="190"/> 106 <c-progress class="c-progress" :inner_widthProp="190"/>
99 <view>{{details.data.glass_width}}mm</view> 107 <view>{{details.data.glass_width}}mm</view>
100 </view> 108 </view>
101 <view>{{parameter[1].standard}}</view> 109 <view>{{parameter[1].standard}}</view>
102 </view> 110 </view>
103 </view> 111 </view>
104 <view> 112 <view>
105 <view><image class="D3_image" v-bind:src ="parameter[2].img"></image></view> 113 <view><image class="D3_image" v-bind:src ="parameter[2].img"></image></view>
106 <view class="D3_list_jDu"> 114 <view class="D3_list_jDu">
107 <view class="D3_list1"> 115 <view class="D3_list1">
108 <c-progress class="c-progress" :inner_widthProp="210"/> 116 <c-progress class="c-progress" :inner_widthProp="210"/>
109 <view>{{details.data.glass_height}}mm</view> 117 <view>{{details.data.glass_height}}mm</view>
110 </view> 118 </view>
111 <view>{{parameter[2].standard}}</view> 119 <view>{{parameter[2].standard}}</view>
112 </view> 120 </view>
113 </view> 121 </view>
114 <view> 122 <view>
115 <view><image class="D3_image" v-bind:src ="parameter[3].img"></image></view> 123 <view><image class="D3_image" v-bind:src ="parameter[3].img"></image></view>
116 <view class="D3_list_jDu"> 124 <view class="D3_list_jDu">
117 125
118 <view class="D3_list1"> 126 <view class="D3_list1">
119 <c-progress class="c-progress" :inner_widthProp="160"/> 127 <c-progress class="c-progress" :inner_widthProp="160"/>
120 <view>{{details.data.nose_width}}mm</view> 128 <view>{{details.data.nose_width}}mm</view>
121 </view> 129 </view>
122 <view>{{parameter[3].standard}}</view> 130 <view>{{parameter[3].standard}}</view>
123 </view> 131 </view>
124 </view> 132 </view>
125 <view> 133 <view>
126 <view><image class="D3_image" v-bind:src ="parameter[4].img"></image></view> 134 <view><image class="D3_image" v-bind:src ="parameter[4].img"></image></view>
127 <view class="D3_list_jDu"> 135 <view class="D3_list_jDu">
128 <view class="D3_list1"> 136 <view class="D3_list1">
129 <c-progress class="c-progress" :inner_widthProp="260"/> 137 <c-progress class="c-progress" :inner_widthProp="260"/>
130 <view>{{details.data.leg_long}}mm</view> 138 <view>{{details.data.leg_long}}mm</view>
131 </view> 139 </view>
132 <view>{{parameter[4].standard}}</view> 140 <view>{{parameter[4].standard}}</view>
133 </view> 141 </view>
134 </view> 142 </view>
135 <hr/>
136 </view> 143 </view>
144 <hr/>
137 </view> 145 </view>
138 <view class="part"> 146 <view class="part">
139 <view class="size1"> 147 <view class="size1" @click="xialachange(4)">
140 <view class="size1_1">配件</view> 148 <view class="size1_1">配件</view>
141 <view><span>+¥0.00</span><image src="/static/img/detail/xiala.png"></image></view> 149 <view><span>+¥0.00</span><image v-bind:src="isNone[4].img"></image></view>
150 </view>
151 <view class="colour_exp">*0290</view>
152 <view class="part_som" v-bind:class="{'colour2_none' : isNone[4].state}">
153 <view
154 v-for="(part) in part"
155 :key="part.key"
156 v-bind:class="{'size_viewed': part.is_actived}"
157 >
158 <image v-bind:src="part.img"></image>
159 </view>
160 </view>
161 </view>
162 </view>
163 <view class="buy">
164 <view class="buy1">选了镜框,想选镜片?</view>
165 <view class="buy2">系统已为你保存好已选镜框,放心去选镜片吧!</view>
166 <view class="buy3">
167 <view class="buy3_1">暂时不选</view>
168 <view class="buy3_2" @click="popArgs">立即去选</view>
169 </view>
170 </view>
171 <template >
172 <view class="goods-form">
173 <text class="p1">填写验光数据</text>
174 <text class="p2">没有验光数据?请到线下眼镜店验光哦~</text>
175 <view class="picker" >
176 <view class="picker-choice">
177 <view class="choice-left">
178 <text class="p11">{{pickerInfoList[0].nameC}}</text>
179 <text class="p12">{{pickerInfoList[0].nameE}}</text>
180 </view>
181 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
182 <text class="p14">{{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}</text>
183 <picker @change="bindPickerChange01" :value="pickerInfoList[0].nameIndex1" :range="pickerInfoList[0].nameArray1">
184 <image src="../../static/detail-tabicon.png" ></image>
185 </picker>
186 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
187 <text class="p14">{{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}</text>
188 <picker @change="bindPickerChange02" :value="pickerInfoList[0].nameIndex2" :range="pickerInfoList[0].nameArray2">
189 <image src="../../static/detail-tabicon.png" ></image>
190 </picker>
191 </view>
192 </view>
193 <view class="picker" >
194 <view class="picker-choice">
195 <view class="choice-left">
196 <text class="p11">{{pickerInfoList[1].nameC}}</text>
197 <text class="p12">{{pickerInfoList[1].nameE}}</text>
198 </view>
199 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
200 <text class="p14">{{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}</text>
201 <picker @change="bindPickerChange11" :value="pickerInfoList[1].nameIndex1" :range="pickerInfoList[1].nameArray1">
202 <image src="../../static/detail-tabicon.png" ></image>
203 </picker>
204 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
205 <text class="p14">{{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}</text>
206 <picker @change="bindPickerChange12" :value="pickerInfoList[1].nameIndex2" :range="pickerInfoList[1].nameArray2">
207 <image src="../../static/detail-tabicon.png" ></image>
208 </picker>
209 </view>
210 </view>
211 <view class="picker" >
212 <view class="picker-choice">
213 <view class="choice-left">
214 <text class="p11">{{pickerInfoList[2].nameC}}</text>
215 <text class="p12">{{pickerInfoList[2].nameE}}</text>
216 </view>
217 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
218 <text class="p14">{{pickerInfoList[2].nameArray1[pickerInfoList[2].nameIndex1]}}</text>
219 <picker @change="bindPickerChange21" :value="pickerInfoList[2].nameIndex1" :range="pickerInfoList[2].nameArray1">
220 <image src="../../static/detail-tabicon.png" ></image>
221 </picker>
222 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
223 <text class="p14">{{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}</text>
224 <picker @change="bindPickerChange22" :value="pickerInfoList[2].nameIndex2" :range="pickerInfoList[2].nameArray2">
225 <image src="../../static/detail-tabicon.png" ></image>
226 </picker>
227 </view>
228 </view>
229 <view class="picker" >
230 <view class="picker-choice">
231 <view class="choice-left">
232 <text class="p11">{{pickerInfoList[3].nameC}}</text>
233 <text class="p12">{{pickerInfoList[3].nameE}}</text>
234 </view>
235 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
236 <text class="p14">{{pickerInfoList[3].nameArray1[pickerInfoList[3].nameIndex1]}}</text>
237 <picker @change="bindPickerChange31" :value="pickerInfoList[3].nameIndex1" :range="pickerInfoList[3].nameArray1">
238 <image src="../../static/detail-tabicon.png" ></image>
239 </picker>
240 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
241 <text class="p14">{{pickerInfoList[3].nameArray2[pickerInfoList[3].nameIndex2]}}</text>
242 <picker @change="bindPickerChange32" :value="pickerInfoList[3].nameIndex2" :range="pickerInfoList[3].nameArray2">
243 <image src="../../static/detail-tabicon.png" ></image>
244 </picker>
245 </view>
246 </view>
247 <view class="picker" >
248 <view class="picker-choice">
249 <view class="choice-left">
250 <text class="p11">{{pickerInfoList[4].nameC}}</text>
251 </view>
252 <text class="p13-date">年&nbsp;&nbsp;&nbsp;(Y)</text>
253 <text class="p14" style="width: 34px;">{{pickerInfoList[4].nameArray1[pickerInfoList[4].nameIndex1]}}</text>
254 <picker @change="bindPickerChange41" :value="pickerInfoList[4].nameIndex1" :range="pickerInfoList[4].nameArray1">
255 <image src="../../static/detail-tabicon.png" ></image>
256 </picker>
257 <text class="p13-date">月&nbsp;&nbsp;&nbsp;(M)</text>
258 <text class="p14" style="width: 30px;">{{pickerInfoList[4].nameArray2[pickerInfoList[4].nameIndex2]}}</text>
259 <picker @change="bindPickerChange42" :value="pickerInfoList[4].nameIndex2" :range="pickerInfoList[4].nameArray2">
260 <image src="../../static/detail-tabicon.png" ></image>
261 </picker>
262 <text class="p13-date">日&nbsp;&nbsp;&nbsp;(D)</text>
263 <text class="p14" style="width: 30px;">{{pickerInfoList[4].nameArray3[pickerInfoList[4].nameIndex3]}}</text>
264 <picker @change="bindPickerChange43" :value="pickerInfoList[4].nameIndex3" :range="pickerInfoList[4].nameArray3">
265 <image src="../../static/detail-tabicon.png" ></image>
266 </picker>
267 </view>
268 </view>
269 <view class="confirm">
270 <image :src="tablist.confirm ? tabicon[0] : tabicon[1]" @click="changeConfirm"></image>
271 <text>确认以上输入信息来源于我的验光数据!</text>
272 </view>
273 </view>
274
275 </template>
276 <view class="zhanwei"></view>
277 <view class="button" @click="popSure(details.data.p_name,details.data.p_sale_price)" ><view>立即结算</view></view>
278 </view>
279 <view class="container" v-if="type===4">
280 <view class="detail">
281 <view class="detail1"><image v-bind:src="details.data.img_index_url"></image></view>
282 <view class="detail2">
283 <view class="detail2_name">{{details.data.p_name}}</view>
284 <view class="detail2_tui"><span>支持7天无条件退货</span><span>顺丰发货</span></view>
285 <view class="detail2_price">
286 <span>¥{{details.data.p_sale_price*count}}</span>
287 <view class="counter">
288 <view class="btn" disabled="this.disabled" @click="counter(false)">-</view>
289 <text>{{count}}</text>
290 <view class="btn" @click="counter(true)">+</view>
291 </view>
292 </view>
293 </view>
294 </view>
295 <view class="choose">
296 <view class="colour">
297 <view class="colour1" @click="xialachange(0)">
298 <text>框架颜色</text>
299 <image v-bind:src="isNone[0].img"></image>
300 </view>
301 <view class="colour_exp">*{{navData.colour}}</view>
302 <view>
303 <view class="colour2" v-bind:class="{'colour2_none' : isNone[0].state}">
304 <view
305 v-for="(items,index) in details.data.skuList"
306 :key="index"
307 @click="viewChoose(index)"
308 class="colour2_view"
309 v-bind:class="{'colour2_viewed': chooseNum == index}"
310 >
311 <image v-bind:src="items.pic" @click="colourChange(index,items.sku_name)"></image>
312 </view>
313 </view>
314 </view>
315 <hr/>
316 </view>
317 <view class="size">
318 <view class="size1" @click="xialachange(1)">
319 <view class="size1_1">框架尺寸</view>
320 <view><image v-bind:src="isNone[1].img"></image></view>
321 </view>
322 <view class="colour">
323 <view class="colour_exp">*{{navData.colour}}</view>
324 </view>
325 <view class="D3_list" v-bind:class="{'colour2_none' : isNone[1].state}">
326 <view>
327 <view><image class="D3_image" v-bind:src ="parameter[0].img"></image></view>
328 <view class="D3_list_jDu">
329 <view class="D3_list1">
330 <c-progress class="c-progress" :inner_widthProp="300"/>
331 <text>{{details.data.frame_width}}mm</text>
332 </view>
333 <view>{{parameter[0].standard}}</view>
334 </view>
335 </view>
336 <view>
337 <view><image class="D3_image" v-bind:src ="parameter[1].img"></image></view>
338 <view class="D3_list_jDu">
339 <view class="D3_list1">
340 <c-progress class="c-progress" :inner_widthProp="190"/>
341 <view>{{details.data.glass_width}}mm</view>
342 </view>
343 <view>{{parameter[1].standard}}</view>
344 </view>
345 </view>
346 <view>
347 <view><image class="D3_image" v-bind:src ="parameter[2].img"></image></view>
348 <view class="D3_list_jDu">
349 <view class="D3_list1">
350 <c-progress class="c-progress" :inner_widthProp="210"/>
351 <view>{{details.data.glass_height}}mm</view>
352 </view>
353 <view>{{parameter[2].standard}}</view>
354 </view>
355 </view>
356 <view>
357 <view><image class="D3_image" v-bind:src ="parameter[3].img"></image></view>
358 <view class="D3_list_jDu">
359
360 <view class="D3_list1">
361 <c-progress class="c-progress" :inner_widthProp="160"/>
362 <view>{{details.data.nose_width}}mm</view>
363 </view>
364 <view>{{parameter[3].standard}}</view>
365 </view>
366 </view>
367 <view>
368 <view><image class="D3_image" v-bind:src ="parameter[4].img"></image></view>
369 <view class="D3_list_jDu">
370 <view class="D3_list1">
371 <c-progress class="c-progress" :inner_widthProp="260"/>
372 <view>{{details.data.leg_long}}mm</view>
373 </view>
374 <view>{{parameter[4].standard}}</view>
375 </view>
376 </view>
377 <hr/>
378 </view>
379 </view>
380 <view class="part">
381 <view class="size1" @click="xialachange(2)">
382 <view class="size1_1" >配件</view>
383 <view>
384 <span>+¥0.00</span>
385 <image v-bind:src="isNone[2].img"></image>
386 </view>
142 </view> 387 </view>
143 <view class="colour_exp">*0290</view> 388 <view class="colour_exp">*0290</view>
144 <view class="part_som"> 389 <view class="part_som" v-bind:class="{'colour2_none' : isNone[2].state}">
145 <view 390 <view
146 v-for="(part) in part" 391 v-for="(part) in part"
147 :key="part.key" 392 :key="part.key"
148 v-bind:class="{'size_viewed': part.is_actived}" 393 v-bind:class="{'size_viewed': part.is_actived}"
149 > 394 >
150 <image v-bind:src="part.img"></image> 395 <image v-bind:src="part.img"></image>
151 </view> 396 </view>
152 </view> 397 </view>
153 </view> 398 </view>
154 </view> 399 </view>
155 <view class="buy"> 400 <view class="buy">
156 <view class="buy1">选了镜框,想选镜片?</view> 401 <view class="buy1">选了镜框,想选镜片?</view>
157 <view class="buy2">系统已为你保存好已选镜框,放心去选镜片吧!</view> 402 <view class="buy2">系统已为你保存好已选镜框,放心去选镜片吧!</view>
158 <view class="buy3"> 403 <view class="buy3">
159 <view class="buy3_1">暂时不选</view> 404 <view class="buy3_1">暂时不选</view>
160 <view class="buy3_2" @click="popArgs">立即去选</view> 405 <view class="buy3_2" @click="popArgs">立即去选</view>
161 </view> 406 </view>
162 </view> 407 </view>
163 <view class="zhanwei"></view> 408 <view class="zhanwei"></view>
164 <view class="button"><view>立即结算</view></view> 409 <view class="button"><view @click="popSure(details.data.p_name,details.data.p_sale_price)" >立即结算</view></view>
165 </view> 410 </view>
411 </view>
166 </template> 412 </template>
167 <script> 413 <script>
168 import CProgress from '../../components/UniSliper/UniSliper' 414 import CProgress from '../../components/UniSliper/UniSliper'
169 import store from '@/store' 415 import store from '@/store'
170 416
171 export default { 417 export default {
172 components: { 418 components: {
173 CProgress 419 CProgress
174 }, 420 },
175 data(){ 421 data(){
176 return{ 422 return{
423 type: 2,
177 count: 1, 424 count: 1,
178 colour: '1.56非球面防蓝光_亚黑色',
179 chooseNum : '', 425 chooseNum : '',
180 isSplit: '' , 426 isSplit: '' ,
427 isNone:[
428 {state: false ,img: '/static/img/detail/xiala.png'},
429 {state: false ,img: '/static/img/detail/xiala.png'},
430 {state: false ,img: '/static/img/detail/xiala.png'},
431 {state: false ,img: '/static/img/detail/xiala.png'},
432 {state: false ,img: '/static/img/detail/xiala.png'},
433 ],
434
435 //传参
436 navData:{
437 pid: "26",
438 p_root_index: "4",
439 name:'',
440 price:'',
441 type:'',
442 split: '1.56非球面防蓝光',
443 colour: '1.56非球面防蓝光_亚黑色',
444 },
445
446 //尺寸
181 parameter:[ 447 parameter:[
182 {key: 0,img:'/static/img/detail/d2.png', standard:'框架宽', slength:139}, 448 {key: 0,img:'/static/img/detail/d2.png', standard:'框架宽', slength:139},
183 {key: 1,img:'/static/img/detail/d3.png', standard:'镜片宽', slength:51}, 449 {key: 1,img:'/static/img/detail/d3.png', standard:'镜片宽', slength:51},
184 {key: 2,img:'/static/img/detail/d4.png', standard:'镜片高', slength:45}, 450 {key: 2,img:'/static/img/detail/d4.png', standard:'镜片高', slength:45},
185 {key: 3,img:'/static/img/detail/d5.png', standard:'鼻架宽', slength:19}, 451 {key: 3,img:'/static/img/detail/d5.png', standard:'鼻架宽', slength:19},
186 {key: 4,img:'/static/img/detail/d6.png', standard:'框架耳长', slength:138}, 452 {key: 4,img:'/static/img/detail/d6.png', standard:'框架耳长', slength:138},
187 ], 453 ],
188 //镜片颜色 454 //镜片颜色
189 jp_colour:[ 455 jp_colour:[
190 {img:'/static/img/detail/Kuang/sun_jp.png'}, 456 {img:'/static/img/detail/Kuang/sun_jp.png'},
191 {img:'/static/img/detail/Kuang/sun_jp.png'}, 457 {img:'/static/img/detail/Kuang/sun_jp.png'},
192 {img:'/static/img/detail/Kuang/sun_jp.png'}, 458 {img:'/static/img/detail/Kuang/sun_jp.png'},
193 {img:'/static/img/detail/Kuang/sun_jp.png'}, 459 {img:'/static/img/detail/Kuang/sun_jp.png'},
194 {img:'/static/img/detail/Kuang/sun_jp.png'}, 460 {img:'/static/img/detail/Kuang/sun_jp.png'},
195 {img:'/static/img/detail/Kuang/sun_jp.png'} 461 {img:'/static/img/detail/Kuang/sun_jp.png'}
196 ], 462 ],
197 //配饰 463 //配饰
198 part:[ 464 part:[
199 {key: 0,img:'/static/img/detail/Kuang/g1.png',is_actived:true}, 465 {key: 0,img:'/static/img/detail/Kuang/g1.png',is_actived:true},
200 {key: 1,img:'/static/img/detail/Kuang/g1.png',is_actived:false}, 466 {key: 1,img:'/static/img/detail/Kuang/g1.png',is_actived:false},
201 {key: 2,img:'/static/img/detail/Kuang/g2.png',is_actived:false}, 467 {key: 2,img:'/static/img/detail/Kuang/g2.png',is_actived:false},
202 {key: 3,img:'/static/img/detail/Kuang/g1.png',is_actived:false}, 468 {key: 3,img:'/static/img/detail/Kuang/g1.png',is_actived:false},
203 {key: 4,img:'/static/img/detail/Kuang/g1.png',is_actived:false}, 469 {key: 4,img:'/static/img/detail/Kuang/g1.png',is_actived:false},
204 {key: 5,img:'/static/img/detail/Kuang/g3.png',is_actived:false}, 470 {key: 5,img:'/static/img/detail/Kuang/g3.png',is_actived:false},
205 {key: 6,img:'/static/img/detail/Kuang/g3.png',is_actived:false}, 471 {key: 6,img:'/static/img/detail/Kuang/g3.png',is_actived:false},
206 {key: 7,img:'/static/img/detail/Kuang/g2.png',is_actived:false}, 472 {key: 7,img:'/static/img/detail/Kuang/g2.png',is_actived:false},
207 ], 473 ],
208 //折射率 474 opIsOpen:true,
209 split:[ 475 tablist: {
210 {number: 1.56}, 476 // read: true,
211 {number: 1.60}, 477 // seeLong: false,
212 {number: 1.67}, 478 confirm: false
213 {number: 1.71}, 479 },
214 {number: 1.74} 480 tabicon:['/static/detail-button.png','/static/detail-button-unselected.png'],
215 481 // 度数相关数据
216 ] 482 pickerInfoList:[
483 {nameC:"度数",nameE:"(SPH)",nameArray1:[1.5,2.5,3.5,4.5],nameIndex1:0,nameArray2:[1.5,2.5,3.5,4.5],nameIndex2:0,key:0},
484 {nameC:"散光",nameE:"(CYL)",nameArray1:[1.5,2.5,3.5,4.5],nameIndex1:0,nameArray2:[1.5,2.5,3.5,4.5],nameIndex2:0,key:1},
485 {nameC:"散光轴位",nameE:"(AXI)",nameArray1:[1.5,2.5,3.5,4.5],nameIndex1:0,nameArray2:[1.5,2.5,3.5,4.5],nameIndex2:0,key:2},
486 {nameC:"双眼瞳距",nameE:"(PD)",nameArray1:[1.5,2.5,3.5,4.5],nameIndex1:0,nameArray2:[1.5,2.5,3.5,4.5],nameIndex2:0,key:3},
487 {nameC:"验光日期",nameE:'',nameArray1:[2017,2018,2019,2020,2021],nameIndex1:0,nameArray2:[1,2,3,4,5,6,7],nameIndex2:0,nameArray3:[1,2,3,4,5,6],nameIndex3:0}
488 ],
217 } 489 }
218 }, 490 },
219 491
220 computed: { 492 computed: {
221 details(){ 493 details(){
222 return this.$store.state.detailStandard_k.list 494 return this.$store.state.detailStandard_k.list
223 }, 495 },
224 }, 496 },
225 onLoad:function(){ 497 onLoad:function(){
226 store.dispatch('detailStandard_k/fetch', { 498 store.dispatch('detailStandard_k/fetch', {
227 uid: "1", 499 uid: "1",
228 pid: "26", 500 pid: "26",
229 }); 501 p_root_index: "4"
230 console.log(this.$store.state.detailStandard_k.list.data+'ssswwwwwwwws'); 502 });
231 console.log("ssssssssssssssssssssssssssss")
232 }, 503 },
233 methods: { 504 methods: {
234 counter(isadd){ 505 counter(isadd){
235 if(isadd){ 506 if(isadd){
236 this.count++ 507 this.count++
237 }else{ 508 }else{
238 this.count <= 1? this.disabled = true:this.count-- 509 this.count <= 1? this.disabled = true:this.count--
239 } 510 }
240 }, 511 },
512 xialachange(index){
513 this.isNone[index].state = !this.isNone[index].state;
514 if(this.isNone[index].state){
515 this.isNone[index].img = '/static/img/detail/right.png'
516 }else{
517 this.isNone[index].img = '/static/img/detail/xiala.png'
518 }
519 },
241 colourChange(index,e){ 520 colourChange(index,e){
242 this.colour = e ; //颜色选择 521 this.navData.colour = e ; //颜色选择
243 // console.log(index,e);
244 522
245 }, 523 },
246 viewChoose(index){ 524 viewChoose(index){
247 this.chooseNum = index 525 this.chooseNum = index
248 }, 526 },
249 splitChoose(index){ 527 //折射率选择
528 splitChoose(index,e){
250 this.isSplit = index 529 this.isSplit = index
530 this.navData.split = e
251 }, 531 },
532 //跳转镜片选购页
252 popArgs(){ 533 popArgs(){
253 uni.navigateTo({ 534 uni.navigateTo({
254 url: '../detailsChoiceArgs/detailsChoiceArgs', 535 url: '../detailsChoiceArgs/detailsChoiceArgs',
255 success: res => {}, 536 success: res => {},
256 fail: () => {}, 537 fail: () => {},
257 complete: () => {} 538 complete: () => {}
258 }); 539 });
259 } 540 },
541 //跳转确认订单页及传参
542 popSure(name,price){
543 this.navData.name = name;
544 this.navData.price = price;
545 this.navData.type = this.type;
546 var navData = JSON.stringify(this.navData);
547 uni.navigateTo({
548 url: '../confirmOrder/confirmOrder?index='+navData,
549 });
550 console.log(this.navData)
551 },
552 //验光表
553 changeConfirm() {
554 this.tablist.confirm = !this.tablist.confirm
555 },
556 bindPickerChange01: function(e) {
557 this.pickerInfoList[0].nameIndex1 = e.target.value
558 },
559 bindPickerChange02: function(e) {
560 this.pickerInfoList[0].nameIndex2 = e.target.value
561 },
562
563 bindPickerChange11: function(e) {
564 this.pickerInfoList[1].nameIndex1 = e.target.value
565 },
566 bindPickerChange12: function(e) {
567 this.pickerInfoList[1].nameIndex2 = e.target.value
568 },
569
570 bindPickerChange21: function(e) {
571 this.pickerInfoList[2].nameIndex1 = e.target.value
572 },
573 bindPickerChange22: function(e) {
574 this.pickerInfoList[2].nameIndex2 = e.target.value
575 },
576
577 bindPickerChange31: function(e) {
578 this.pickerInfoList[3].nameIndex1 = e.target.value
579 },
580 bindPickerChange32: function(e) {
581 this.pickerInfoList[3].nameIndex2 = e.target.value
582 },
583
584 bindPickerChange41: function(e) {
585 this.pickerInfoList[4].nameIndex1 = e.target.value
586 },
587 bindPickerChange42: function(e) {
588 this.pickerInfoList[4].nameIndex2 = e.target.value
589 },
590 bindPickerChange43: function(e) {
591 this.pickerInfoList[4].nameIndex3 = e.target.value
592 },
260 } 593 }
261 594
262 } 595 }
263 </script> 596 </script>
264 597
265 <style lang="scss"> 598 <style lang="scss">
266 .container{ 599 .container{
267 min-height: 100vh; 600 min-height: 100vh;
268 background: #F2F2F2; 601 background: #F2F2F2;
269 padding-top: 10px; 602 padding-top: 10px;
270 box-sizing: border-box; 603 box-sizing: border-box;
271 } 604 }
272 hr{ 605 hr{
273 border: none; 606 border: none;
274 height: 1px; 607 height: 1px;
275 background: #F2F2F2; 608 background: #F2F2F2;
276 margin-top: 18px; 609 margin-top: 18px;
277 margin-bottom: 10px; 610 margin-bottom: 10px;
278 } 611 }
279 .detail{ 612 .detail{
280 height: 272rpx; 613 height: 272rpx;
281 background: #FFFFFF; 614 background: #FFFFFF;
282 border-radius: 8px; 615 border-radius: 8px;
283 padding: 16px; 616 padding: 16px;
284 box-sizing: border-box; 617 box-sizing: border-box;
285 display: flex; 618 display: flex;
286 justify-content: space-between; 619 justify-content: space-between;
287 align-items: center; 620 align-items: center;
288 } 621 }
289 .detail1{ 622 .detail1{
290 height: 178rpx; 623 height: 178rpx;
291 width: 188rpx; 624 width: 188rpx;
292 image{ 625 image{
293 width: 100%; 626 width: 100%;
294 height: 100%; 627 height: 100%;
295 border-radius: 8px; 628 border-radius: 8px;
296 } 629 }
297 } 630 }
298 .detail2{ 631 .detail2{
299 width: 68%; 632 width: 68%;
300 view{ 633 view{
301 margin-bottom: 6px; 634 margin-bottom: 6px;
302 font-family: PingFangSC-Regular; 635 font-family: PingFangSC-Regular;
303 } 636 }
304 .detail2_name{ 637 .detail2_name{
305 font-size: 14px; 638 font-size: 14px;
306 color: #333333; 639 color: #333333;
307 letter-spacing: -0.26px; 640 letter-spacing: -0.26px;
308 line-height: 18px; 641 line-height: 18px;
309 overflow:hidden; 642 overflow:hidden;
310 text-overflow:ellipsis; 643 text-overflow:ellipsis;
311 display:-webkit-box; 644 display:-webkit-box;
312 -webkit-box-orient:vertical; 645 -webkit-box-orient:vertical;
313 -webkit-line-clamp:2; 646 -webkit-line-clamp:2;
314 } 647 }
315 .detail2_tui{ 648 .detail2_tui{
316 font-size: 10px; 649 font-size: 10px;
317 color: #999999; 650 color: #999999;
318 letter-spacing: -0.19px; 651 letter-spacing: -0.19px;
319 span{ 652 span{
320 margin-right: 10px; 653 margin-right: 10px;
321 } 654 }
322 } 655 }
323 .detail2_price{ 656 .detail2_price{
324 font-size: 14px; 657 font-size: 14px;
325 color: #FF6B4A; 658 color: #FF6B4A;
326 letter-spacing: -0.26px; 659 letter-spacing: -0.26px;
327 } 660 }
328 } 661 }
329 .counter{ 662 .counter{
330 display: flex; 663 display: flex;
331 flex-direction: row; 664 flex-direction: row;
332 justify-content: space-between; 665 justify-content: space-between;
333 font-size: 28rpx; 666 font-size: 28rpx;
334 color: #333333; 667 color: #333333;
335 width: 122rpx; 668 width: 122rpx;
336 float: right; 669 float: right;
337 .btn{ 670 .btn{
338 display: flex; 671 display: flex;
339 justify-content: center; 672 justify-content: center;
340 line-height: 32rpx; 673 line-height: 32rpx;
341 height: 32rpx; 674 height: 32rpx;
342 width: 32rpx; 675 width: 32rpx;
343 background-color: #F2F2F2; 676 background-color: #F2F2F2;
344 color: #CFCFCF; 677 color: #CFCFCF;
345 } 678 }
346 } 679 }
347 .choose{ 680 .choose{
348 background: #FFFFFF; 681 background: #FFFFFF;
349 padding: 16px; 682 padding: 16px;
350 box-sizing: border-box; 683 box-sizing: border-box;
351 margin-top: 10px; 684 margin-top: 10px;
352 border-radius: 8px; 685 border-radius: 8px;
353 .colour1{ 686 .colour1{
354 span{ 687 span{
355 font-family: PingFangSC-Medium; 688 font-family: PingFangSC-Medium;
356 font-size: 16px; 689 font-size: 16px;
357 color: #333333; 690 color: #333333;
358 letter-spacing: -0.3px; 691 letter-spacing: -0.3px;
359 text-align: justify; 692 text-align: justify;
360 line-height: 24px; 693 line-height: 24px;
361 font-weight: bold; 694 font-weight: bold;
362 } 695 }
363 image{ 696 image{
364 float: right; 697 float: right;
365 width: 40rpx; 698 width: 40rpx;
366 height: 36rpx; 699 height: 36rpx;
367 } 700 }
368 .colour1_span2{ 701 .colour1_span2{
369 font-family: PingFangSC-Regular; 702 font-family: PingFangSC-Regular;
370 font-size: 12px; 703 font-size: 12px;
371 color: #666666; 704 color: #666666;
372 margin-left: 10px; 705 margin-left: 10px;
373 font-weight: normal 706 font-weight: normal
374 } 707 }
375 } 708 }
376 .colour_exp{ 709 .colour_exp{
377 font-family: PingFangSC-Regular; 710 font-family: PingFangSC-Regular;
378 font-size: 12px; 711 font-size: 12px;
379 color: #666666; 712 color: #666666;
380 letter-spacing: 0; 713 letter-spacing: 0;
381 margin-top: 10px; 714 margin-top: 10px;
382 margin-bottom: 10px; 715 margin-bottom: 10px;
383 } 716 }
384 .colour2{ 717 .colour2{
385 display: grid; 718 display: grid;
386 grid-template-columns: repeat(5, 17%); 719 grid-template-columns: repeat(5, 17%);
387 justify-content: space-between ; 720 justify-content: space-between ;
388 grid-row-gap: 10px; 721 grid-row-gap: 10px;
389 margin-bottom: 14px; 722 margin-bottom: 14px;
390 .colour2_view{ 723 .colour2_view{
391 border: 1px solid #F2F2F2; 724 border: 1px solid #F2F2F2;
392 image{ 725 image{
393 width: 100rpx; 726 width: 100rpx;
394 height: 60rpx; 727 height: 60rpx;
395 } 728 }
396 } 729 }
397 .colour2_viewed{ 730 .colour2_viewed{
398 border: 1px solid #FF6B4A; 731 border: 1px solid #FF6B4A;
399 image{ 732 image{
400 width: 100rpx; 733 width: 100rpx;
401 height: 60rpx; 734 height: 60rpx;
402 } 735 }
403 } 736 }
404 } 737 }
738 .colour2_none{
739 display: none;
740 }
405 } 741 }
406 .jp_colour2{ 742 .jp_colour2{
407 display: grid; 743 display: grid;
408 grid-template-columns: repeat(5, 13%); 744 grid-template-columns: repeat(5, 13%);
409 justify-content: start ; 745 justify-content: start ;
410 grid-column-gap: 10px; 746 grid-column-gap: 10px;
411 grid-row-gap: 10px; 747 grid-row-gap: 10px;
412 margin-bottom: 14px; 748 margin-bottom: 14px;
413 .jp_colour2_view{ 749 .jp_colour2_view{
414 border: 1px solid #F2F2F2; 750 border: 1px solid #F2F2F2;
415 image{ 751 image{
416 width: 80rpx; 752 width: 80rpx;
417 height: 80rpx; 753 height: 80rpx;
418 } 754 }
419 } 755 }
420 } 756 }
421 .split{ 757 .split{
422 display: grid; 758 display: grid;
423 grid-template-columns: repeat(2, 45%); 759 grid-template-columns: repeat(2, 45%);
424 grid-column-gap: 10px; 760 grid-column-gap: 10px;
425 grid-row-gap: 10px; 761 grid-row-gap: 10px;
426 margin-top: 10px ; 762 margin-top: 10px ;
427 .split_colour2{ 763 .split_colour2{
428 display: flex; 764 display: flex;
429 justify-content: center; 765 justify-content: center;
430 align-items: center; 766 align-items: center;
431 width: 300rpx; 767 width: 300rpx;
432 height: 60rpx; 768 height: 60rpx;
433 background: #F2F2F2; 769 background: #F2F2F2;
434 border-radius: 2px; 770 border-radius: 2px;
435 font-family: PingFangSC-Regular; 771 font-family: PingFangSC-Regular;
436 font-size: 12px; 772 font-size: 12px;
437 color: #666666; 773 color: #666666;
438 letter-spacing: 0; 774 letter-spacing: 0;
439 text-align: center; 775 text-align: center;
440 } 776 }
441 .split_colour2_actived{ 777 .split_colour2_actived{
442 background: rgba(255,107,74,0.15); 778 background: rgba(255,107,74,0.15);
443 color: #FF6B4A; 779 color: #FF6B4A;
444 } 780 }
445 } 781 }
446 .size,.part{ 782 .size,.part{
447 margin-top:14px; 783 margin-top:14px;
448 .size1{ 784 .size1{
449 display: flex; 785 display: flex;
450 justify-content: space-between; 786 justify-content: space-between;
451 margin-bottom: 10px; 787 margin-bottom: 10px;
452 .size1_1{ 788 .size1_1{
453 font-weight: bold; 789 font-weight: bold;
454 font-family: PingFangSC-Medium; 790 font-family: PingFangSC-Medium;
455 font-size: 16px; 791 font-size: 16px;
456 color: #333333; 792 color: #333333;
457 letter-spacing: -0.3px; 793 letter-spacing: -0.3px;
458 line-height: 24px; 794 line-height: 24px;
459 } 795 }
460 view{ 796 view{
461 span{ 797 span{
462 font-family: PingFangSC-Regular; 798 font-family: PingFangSC-Regular;
463 font-size: 14px; 799 font-size: 14px;
464 color: #FF6B4A; 800 color: #FF6B4A;
465 letter-spacing: -0.26px; 801 letter-spacing: -0.26px;
466 margin-right: 12px; 802 margin-right: 12px;
467 } 803 }
468 image{ 804 image{
469 width: 40rpx; 805 width: 40rpx;
470 height: 36rpx; 806 height: 36rpx;
471 } 807 }
472 } 808 }
473 } 809 }
474 .size2{ 810 .size2{
475 view{ 811 view{
476 display: inline-flex; 812 display: inline-flex;
477 align-items: center; 813 align-items: center;
478 justify-content: center; //字体居中 814 justify-content: center; //字体居中
479 margin-right: 12px; 815 margin-right: 12px;
480 margin-bottom: 20px; 816 margin-bottom: 20px;
481 width: 136rpx; 817 width: 136rpx;
482 height: 60rpx; 818 height: 60rpx;
483 background: #F2F2F2; 819 background: #F2F2F2;
484 border-radius: 2px; 820 border-radius: 2px;
485 font-family: PingFangSC-Regular; 821 font-family: PingFangSC-Regular;
486 font-size: 12px; 822 font-size: 12px;
487 color: #666666; 823 color: #666666;
488 } 824 }
489 view:hover{ 825 view:hover{
490 color: #FF6B4A; 826 color: #FF6B4A;
491 background: rgba(255,107,74,0.15); 827 background: rgba(255,107,74,0.15);
492 } 828 }
493 } 829 }
494 .D3_list{ 830 .D3_list{
495 margin-bottom: 4px; 831 margin-bottom: 4px;
496 } 832 }
497 .D3_list>view{ 833 .D3_list>view{
498 display: flex; 834 display: flex;
499 align-content: center; 835 align-content: center;
500 margin-bottom: 10px; 836 margin-bottom: 10px;
501 view{ 837 view{
502 margin-right: 10px; 838 margin-right: 10px;
503 } 839 }
504 } 840 }
505 .D3_list image{ 841 .D3_list image{
506 width: 50px; 842 width: 50px;
507 height: 25px; 843 height: 25px;
508 margin-right: 6px; 844 margin-right: 6px;
509 } 845 }
510 .D3_list span{ 846 .D3_list span{
511 margin-left: 6px; 847 margin-left: 6px;
512 margin-right: 5px; 848 margin-right: 5px;
513 font-family: 'PingFangSC-Regular'; 849 font-family: 'PingFangSC-Regular';
514 } 850 }
515 .D3_list_jDu{ 851 .D3_list_jDu{
516 view{ 852 view{
517 font-family: PingFangSC-Regular; 853 font-family: PingFangSC-Regular;
518 font-size: 10px; 854 font-size: 10px;
519 color: #999999; 855 color: #999999;
520 letter-spacing: -0.19px; 856 letter-spacing: -0.19px;
521 } 857 }
522 .D3_list1{ 858 .D3_list1{
523 display: flex; 859 display: flex;
524 } 860 }
525 } 861 }
526 } 862 }
527 .part{ 863 .part{
528 .part_som{ 864 .part_som{
529 display: grid; 865 display: grid;
530 justify-content: space-between; 866 justify-content: space-between;
531 grid-template-columns: repeat(4, 22%); 867 grid-template-columns: repeat(4, 22%);
532 grid-row-gap: 12px; 868 grid-row-gap: 12px;
533 margin-bottom: 14px; 869 margin-bottom: 14px;
534 view{ 870 view{
535 border: 1px solid #F2F2F2; 871 border: 1px solid #F2F2F2;
536 height: 72rpx; 872 height: 72rpx;
537 image{ 873 image{
538 width: 100%; 874 width: 100%;
539 height: 100%; 875 height: 100%;
540 } 876 }
541 } 877 }
542 .size_viewed{ 878 .size_viewed{
543 border: 1px solid #FF6B4A; 879 border: 1px solid #FF6B4A;
544 height: 72rpx; 880 height: 72rpx;
545 image{ 881 image{
546 width: 100%; 882 width: 100%;
547 height: 100%; 883 height: 100%;
548 } 884 }
549 } 885 }
550 } 886 }
887 .colour2_none{
888 display: none;
889 }
551 } 890 }
552 891
553 .buy{ 892 .buy{
554 height: 300rpx; 893 height: 300rpx;
555 background: #FFFFFF ; 894 background: #FFFFFF ;
556 margin-top: 10px; 895 margin-top: 10px;
557 border-radius: 8px; 896 border-radius: 8px;
558 padding-top: 20px; 897 padding-top: 20px;
559 box-sizing: border-box; 898 box-sizing: border-box;
560 margin-bottom: 20px; 899 margin-bottom: 10px;
561 } 900 }
562 .buy1{ 901 .buy1{
563 font-family: PingFangSC-Medium; 902 font-family: PingFangSC-Medium;
564 font-size: 16px; 903 font-size: 16px;
565 font-weight: bold; 904 font-weight: bold;
566 color: #333333; 905 color: #333333;
567 text-align: center; 906 text-align: center;
568 } 907 }
569 .buy2{ 908 .buy2{
570 font-family: PingFangSC-Regular; 909 font-family: PingFangSC-Regular;
571 font-size: 12px; 910 font-size: 12px;
572 color: #999999; 911 color: #999999;
573 text-align: center; 912 text-align: center;
574 margin: 10px; 913 margin: 10px;
575 } 914 }
576 .buy3{ 915 .buy3{
577 font-family: PingFangSC-Regular; 916 font-family: PingFangSC-Regular;
578 font-size: 16px; 917 font-size: 16px;
579 display: flex; 918 display: flex;
580 justify-content: center; 919 justify-content: center;
581 margin-top: 14px; 920 margin-top: 14px;
582 view{ 921 view{
583 border-radius: 20px; 922 border-radius: 20px;
584 width: 240rpx; 923 width: 240rpx;
585 height: 80rpx; 924 height: 80rpx;
586 display: flex; 925 display: flex;
587 justify-content: center; 926 justify-content: center;
588 align-items: center; 927 align-items: center;
589 } 928 }
590 .buy3_1{ 929 .buy3_1{
591 margin-right: 20px; 930 margin-right: 20px;
592 background: rgba(255,107,74,0.15); 931 background: rgba(255,107,74,0.15);
593 color: #FF6B4A ; 932 color: #FF6B4A ;
594 } 933 }
595 .buy3_2{ 934 .buy3_2{
596 background: #FF6B4A; 935 background: #FF6B4A;
597 color: #FFFFFF ; 936 color: #FFFFFF ;
598 } 937 }
599 } 938 }
600 .zhanwei{ 939 .zhanwei{
601 background: #F2F2F2; 940 background: #F2F2F2;
602 height: 120rpx; 941 height: 200rpx;
942 }
943 .goods-form {
944 display: flex;
945 flex-direction: column;
946 align-items: center;
947 justify-content: center;
948 background-color: #fff;
949 width: 100%;
950 padding-top:20px;
951 padding-bottom:20px;
952 box-sizing: border-box;
953
954 .p1 {
955 font-size: 16px;
956 color: #333333;
957 letter-spacing: -0.3px;
958 text-align: justify;
959 line-height: 24px;
960 margin: 4px 0;
961 }
962 .p2 {
963 font-size: 12px;
964 color: #999999;
965 letter-spacing: -0.23px;
966 margin-bottom: 18rpx;
967 }
968 image{
969 width: 28rpx;
970 height: 26rpx;
971 }
972 .confirm {
973 display: flex;
974 align-items: center;
975 font-size: 12px;
976 color: #666666;
977 letter-spacing: -0.23px;
978 width: 684rpx;
979 image{
980 margin-right:25rpx;
981 }
982 }
983 .picker{
984 display: flex;
985 flex-direction: column;
986 justify-content: center;
987 align-items: center;
988 width: 100%;
989 image{
990 width: 10px;
991 height: 10px;
992 margin-right: 5px;
993 }
994 .picker-choice{
995 display: flex;
996 width: 684rpx;
997 align-items: center;
998 margin-bottom: 40rpx;
999 .choice-left{
1000 width: 210rpx;
1001 .p11 {
1002 font-size: 14px;
1003 color: #333333;
1004 letter-spacing: -0.26px;
1005 text-align: justify;
1006 line-height: 24px;
1007 // margin-right: 10px;
1008 }
1009 .p12 {
1010 font-size: 10px;
1011 color: #3F3F3F;
1012 letter-spacing: -0.19px;
1013 text-align: justify;
1014 line-height: 24px;
1015 }
1016
1017
1018 }
1019 .p13 {
1020 font-size: 10px;
1021 color: #999999;
1022 letter-spacing: -0.19px;
1023 margin-right: 10px;
1024 }
1025 .p13-date {
1026 font-size: 10px;
1027 color: #999999;
1028 letter-spacing: -0.19px;
1029 margin-right: 5px;
1030 }
1031 .p14 {
1032 font-size: 14px;
1033 color: #666666;
1034 letter-spacing: -0.26px;
1035 text-align: center;
1036 width: 124rpx;
1037 border-bottom: 1px solid #CFCFCF;
1038 }
1039
1040 }
1041 }
603 } 1042 }
604 .button{ 1043 .button{
605 position: fixed; 1044 position: fixed;
606 bottom: 0; 1045 bottom: 0;
607 width:100%; 1046 width:100%;
608 height: 112rpx; 1047 height: 112rpx;
609 background: #FF6B4A 100%; 1048 background: #FF6B4A 100%;
610 view{ 1049 view{
611 color: #FFFFFF; 1050 color: #FFFFFF;
612 height: 100%; 1051 height: 100%;
613 display: flex; 1052 display: flex;
614 justify-content: center; 1053 justify-content: center;
615 align-items: center; 1054 align-items: center;
616 font-family: PingFangSC-Regular; 1055 font-family: PingFangSC-Regular;
src/pages/newOpticsData/newOpticsData.vue
1 <template> 1 <template>
2 <view class="wrap"> 2 <view class="wrap">
3 <view class="body"> 3 <view class="body">
4 <template > 4 <template >
5 <view class="goods-form"> 5 <view class="goods-form">
6 <view class="p1"> 6 <view class="p1">
7 <image src="../../static/img/myOpticsData/dataWrite.png" mode="aspectFit"></image> 7 <image src="../../static/img/myOpticsData/dataWrite.png" mode="aspectFit"></image>
8 填写验光数据 8 填写验光数据
9 </view> 9 </view>
10 <text class="p2">没有验光数据?请到线下眼镜店验光哦~</text> 10 <text class="p2">没有验光数据?请到线下眼镜店验光哦~</text>
11 <view class="use_name">
12 <text>验光单取名:</text>
13 <input type="text" @change="handleInput"
14 placeholder="请输入名称" maxlength="30" :value="name" />
15 </view>
16 <view class="use_pd">
17 <text>瞳距:</text>
18 <input type="number" @change="handleInputPd"
19 placeholder="请输入瞳距,单位cm" maxlength="20" :value="pd" />
20 </view>
11 <view class="picker" > 21 <view class="picker" >
12 <view class="picker-choice"> 22 <view class="picker-choice">
13 <view class="choice-left"> 23 <view class="choice-left">
14 <text class="p11">{{pickerInfoList[0].nameC}}</text> 24 <text class="p11">{{pickerInfoList[0].nameC}}</text>
15 <text class="p12">{{pickerInfoList[0].nameE}}</text> 25 <text class="p12">{{pickerInfoList[0].nameE}}</text>
16 </view> 26 </view>
17 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text> 27 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
18 <text class="p14">{{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}</text> 28 <text class="p14">{{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}</text>
19 <picker @change="bindPickerChange01" :value="pickerInfoList[0].nameIndex1" :range="pickerInfoList[0].nameArray1"> 29 <picker @change="bindPickerChange01" :value="pickerInfoList[0].nameIndex1" :range="pickerInfoList[0].nameArray1">
20 <image src="../../static/detail-tabicon.png" ></image> 30 <image src="../../static/detail-tabicon.png" ></image>
21 </picker> 31 </picker>
22 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text> 32 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
23 <text class="p14">{{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}</text> 33 <text class="p14">{{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}</text>
24 <picker @change="bindPickerChange02" :value="pickerInfoList[0].nameIndex2" :range="pickerInfoList[0].nameArray2"> 34 <picker @change="bindPickerChange02" :value="pickerInfoList[0].nameIndex2" :range="pickerInfoList[0].nameArray2">
25 <image src="../../static/detail-tabicon.png" ></image> 35 <image src="../../static/detail-tabicon.png" ></image>
26 </picker> 36 </picker>
27 </view> 37 </view>
28 </view> 38 </view>
29 <view class="picker" > 39 <view class="picker" >
30 <view class="picker-choice"> 40 <view class="picker-choice">
31 <view class="choice-left"> 41 <view class="choice-left">
32 <text class="p11">{{pickerInfoList[1].nameC}}</text> 42 <text class="p11">{{pickerInfoList[1].nameC}}</text>
33 <text class="p12">{{pickerInfoList[1].nameE}}</text> 43 <text class="p12">{{pickerInfoList[1].nameE}}</text>
34 </view> 44 </view>
35 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text> 45 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
36 <text class="p14">{{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}</text> 46 <text class="p14">{{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}</text>
37 <picker @change="bindPickerChange11" :value="pickerInfoList[1].nameIndex1" :range="pickerInfoList[1].nameArray1"> 47 <picker @change="bindPickerChange11" :value="pickerInfoList[1].nameIndex1" :range="pickerInfoList[1].nameArray1">
38 <image src="../../static/detail-tabicon.png" ></image> 48 <image src="../../static/detail-tabicon.png" ></image>
39 </picker> 49 </picker>
40 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text> 50 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
41 <text class="p14">{{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}</text> 51 <text class="p14">{{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}</text>
42 <picker @change="bindPickerChange12" :value="pickerInfoList[1].nameIndex2" :range="pickerInfoList[1].nameArray2"> 52 <picker @change="bindPickerChange12" :value="pickerInfoList[1].nameIndex2" :range="pickerInfoList[1].nameArray2">
43 <image src="../../static/detail-tabicon.png" ></image> 53 <image src="../../static/detail-tabicon.png" ></image>
44 </picker> 54 </picker>
45 </view> 55 </view>
46 </view> 56 </view>
47 <view class="picker" > 57 <view class="picker" >
48 <view class="picker-choice"> 58 <view class="picker-choice">
49 <view class="choice-left"> 59 <view class="choice-left">
50 <text class="p11">{{pickerInfoList[2].nameC}}</text> 60 <text class="p11">{{pickerInfoList[2].nameC}}</text>
51 <text class="p12">{{pickerInfoList[2].nameE}}</text> 61 <text class="p12">{{pickerInfoList[2].nameE}}</text>
52 </view> 62 </view>
53 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text> 63 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
54 <text class="p14">{{pickerInfoList[2].nameArray1[pickerInfoList[2].nameIndex1]}}</text> 64 <text class="p14">{{pickerInfoList[2].nameArray1[pickerInfoList[2].nameIndex1]}}</text>
55 <picker @change="bindPickerChange21" :value="pickerInfoList[2].nameIndex1" :range="pickerInfoList[2].nameArray1"> 65 <picker @change="bindPickerChange21" :value="pickerInfoList[2].nameIndex1" :range="pickerInfoList[2].nameArray1">
56 <image src="../../static/detail-tabicon.png" ></image> 66 <image src="../../static/detail-tabicon.png" ></image>
57 </picker> 67 </picker>
58 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text> 68 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
59 <text class="p14">{{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}</text> 69 <text class="p14">{{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}</text>
60 <picker @change="bindPickerChange22" :value="pickerInfoList[2].nameIndex2" :range="pickerInfoList[2].nameArray2"> 70 <picker @change="bindPickerChange22" :value="pickerInfoList[2].nameIndex2" :range="pickerInfoList[2].nameArray2">
61 <image src="../../static/detail-tabicon.png" ></image> 71 <image src="../../static/detail-tabicon.png" ></image>
62 </picker> 72 </picker>
63 </view> 73 </view>
64 </view> 74 </view>
65 <view class="picker" > 75 <!-- <view class="picker" >
66 <view class="picker-choice"> 76 <view class="picker-choice">
67 <view class="choice-left"> 77 <view class="choice-left">
68 <text class="p11">{{pickerInfoList[3].nameC}}</text> 78 <text class="p11">{{pickerInfoList[3].nameC}}</text>
69 <text class="p12">{{pickerInfoList[3].nameE}}</text> 79 <text class="p12">{{pickerInfoList[3].nameE}}</text>
70 </view> 80 </view>
71 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text> 81 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
72 <text class="p14">{{pickerInfoList[3].nameArray1[pickerInfoList[3].nameIndex1]}}</text> 82 <text class="p14">{{pickerInfoList[3].nameArray1[pickerInfoList[3].nameIndex1]}}</text>
73 <picker @change="bindPickerChange31" :value="pickerInfoList[3].nameIndex1" :range="pickerInfoList[3].nameArray1"> 83 <picker @change="bindPickerChange31" :value="pickerInfoList[3].nameIndex1" :range="pickerInfoList[3].nameArray1">
74 <image src="../../static/detail-tabicon.png" ></image> 84 <image src="../../static/detail-tabicon.png" ></image>
75 </picker> 85 </picker>
76 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text> 86 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
77 <text class="p14">{{pickerInfoList[3].nameArray2[pickerInfoList[3].nameIndex2]}}</text> 87 <text class="p14">{{pickerInfoList[3].nameArray2[pickerInfoList[3].nameIndex2]}}</text>
78 <picker @change="bindPickerChange32" :value="pickerInfoList[3].nameIndex2" :range="pickerInfoList[3].nameArray2"> 88 <picker @change="bindPickerChange32" :value="pickerInfoList[3].nameIndex2" :range="pickerInfoList[3].nameArray2">
79 <image src="../../static/detail-tabicon.png" ></image> 89 <image src="../../static/detail-tabicon.png" ></image>
80 </picker> 90 </picker>
81 </view> 91 </view>
82 </view> 92 </view> -->
83 <view class="picker" > 93 <view class="picker" >
84 <view class="picker-choice"> 94 <view class="picker-choice">
85 <view class="choice-left"> 95 <view class="choice-left">
86 <text class="p11">{{pickerInfoList[4].nameC}}</text> 96 <text class="p11">{{pickerInfoList[3].nameC}}</text>
87 </view> 97 </view>
88 <text class="p13-date">年&nbsp;&nbsp;&nbsp;(Y)</text> 98 <text class="p13-date">年&nbsp;&nbsp;&nbsp;(Y)</text>
89 <text class="p14" style="width: 34px;">{{pickerInfoList[4].nameArray1[pickerInfoList[4].nameIndex1]}}</text> 99 <text class="p14" style="width: 34px;">{{pickerInfoList[3].nameArray1[pickerInfoList[3].nameIndex1]}}</text>
90 <picker @change="bindPickerChange41" :value="pickerInfoList[4].nameIndex1" :range="pickerInfoList[4].nameArray1"> 100 <picker @change="bindPickerChange41" :value="pickerInfoList[3].nameIndex1" :range="pickerInfoList[3].nameArray1">
91 <image src="../../static/detail-tabicon.png" ></image> 101 <image src="../../static/detail-tabicon.png" ></image>
92 </picker> 102 </picker>
93 <text class="p13-date">月&nbsp;&nbsp;&nbsp;(M)</text> 103 <text class="p13-date">月&nbsp;&nbsp;&nbsp;(M)</text>
94 <text class="p14" style="width: 30px;">{{pickerInfoList[4].nameArray2[pickerInfoList[4].nameIndex2]}}</text> 104 <text class="p14" style="width: 30px;">{{pickerInfoList[3].nameArray2[pickerInfoList[3].nameIndex2]}}</text>
95 <picker @change="bindPickerChange42" :value="pickerInfoList[4].nameIndex2" :range="pickerInfoList[4].nameArray2"> 105 <picker @change="bindPickerChange42" :value="pickerInfoList[3].nameIndex2" :range="pickerInfoList[3].nameArray2">
96 <image src="../../static/detail-tabicon.png" ></image> 106 <image src="../../static/detail-tabicon.png" ></image>
97 </picker> 107 </picker>
98 <text class="p13-date">日&nbsp;&nbsp;&nbsp;(D)</text> 108 <text class="p13-date">日&nbsp;&nbsp;&nbsp;(D)</text>
99 <text class="p14" style="width: 30px;">{{pickerInfoList[4].nameArray3[pickerInfoList[4].nameIndex3]}}</text> 109 <text class="p14" style="width: 30px;">{{pickerInfoList[3].nameArray3[pickerInfoList[3].nameIndex3]}}</text>
100 <picker @change="bindPickerChange43" :value="pickerInfoList[4].nameIndex3" :range="pickerInfoList[4].nameArray3"> 110 <picker @change="bindPickerChange43" :value="pickerInfoList[3].nameIndex3" :range="pickerInfoList[3].nameArray3">
101 <image src="../../static/detail-tabicon.png" ></image> 111 <image src="../../static/detail-tabicon.png" ></image>
102 </picker> 112 </picker>
103 </view> 113 </view>
104 </view> 114 </view>
105 <view class="confirm"> 115 <view class="confirm">
106 <image :src="tablist.confirm ? tabicon[0] : tabicon[1]" @click="changeConfirm"></image> 116 <image :src="confirm ? tabicon[0] : tabicon[1]" @click="changeConfirm"></image>
107 <text>确认以上输入信息来源于我的验光数据!</text> 117 <text>确认以上输入信息来源于我的验光数据!</text>
108 </view> 118 </view>
109 </view> 119 </view>
110 120
111 </template> 121 </template>
112 </view> 122 </view>
113 123
114 124
115 <view class="footer"> 125 <view class="footer" @click="handleSubmit">
116 <button class="btn" type="default">提 交</button> 126 <button class="btn" type="default">提 交</button>
117 </view> 127 </view>
118 </view> 128 </view>
119 </template> 129 </template>
120 130
121 <script> 131 <script>
132 import store from '@/store';
133
122 export default { 134 export default {
123 data() { 135 data() {
124 return { 136 return {
125 pickerInfoList:[ 137 pickerInfoList:[
126 {nameC:"度数",nameE:"(SPH)",nameArray1:[1.5,2.5,3.5,4.5],nameIndex1:0,nameArray2:[1.5,2.5,3.5,4.5],nameIndex2:0,key:0}, 138 {nameC:"度数",nameE:"(SPH)",nameArray1:[''],nameIndex1:0,nameArray2:[''],nameIndex2:0,key:0},
127 {nameC:"散光",nameE:"(CYL)",nameArray1:[1.5,2.5,3.5,4.5],nameIndex1:0,nameArray2:[1.5,2.5,3.5,4.5],nameIndex2:0,key:1}, 139 {nameC:"散光",nameE:"(CYL)",nameArray1:[''],nameIndex1:0,nameArray2:[''],nameIndex2:0,key:1},
128 {nameC:"散光轴位",nameE:"(AXI)",nameArray1:[1.5,2.5,3.5,4.5],nameIndex1:0,nameArray2:[1.5,2.5,3.5,4.5],nameIndex2:0,key:2}, 140 {nameC:"散光轴位",nameE:"(AXI)",nameArray1:[''],nameIndex1:0,nameArray2:[''],nameIndex2:0,key:2},
129 {nameC:"双眼瞳距",nameE:"(PD)",nameArray1:[1.5,2.5,3.5,4.5],nameIndex1:0,nameArray2:[1.5,2.5,3.5,4.5],nameIndex2:0,key:3}, 141 {nameC:"验光日期",nameE:'',nameArray1:[''],nameIndex1:0,nameArray2:['',1,2,3,4,5,6,7,8,9,10,11,12],nameIndex2:0,nameArray3:[''],nameIndex3:0}
130 {nameC:"验光日期",nameE:'',nameArray1:[2017,2018,2019,2020,2021],nameIndex1:0,nameArray2:[1,2,3,4,5,6,7],nameIndex2:0,nameArray3:[1,2,3,4,5,6],nameIndex3:0}
131 ], 142 ],
132 tablist: { 143 confirm: false, // 用户是否确认
133 // read: true, 144 tabicon:['/static/detail-button.png','/static/detail-button-unselected.png'],
134 // seeLong: false, 145 name: '夏小花',
135 confirm: false 146 pickerInfoChioce:{
147 "leftSph": 0,
148 "rightSph": 0,
149 "leftCyl": 0,
150 "rightCyl": 0,
151 "leftAxi": 0,
152 "rightAxi": 0,
153 "time":{
154 "year":0,
155 "month": 0,
156 "day":0 ,
157 }
136 }, 158 },
137 tabicon:['/static/detail-button.png','/static/detail-button-unselected.png'], 159 pd: '',// 瞳距
160 kinds:Number, // kinds=1,提交为新增验光,2为修改
161 mp_id: Number
138 }; 162 };
139 }, 163 },
164 onLoad: function (option) {
165 //option为object类型,会序列化上个页面传递的参数
166 // 初始化SPL、CYL、AXI的值
167 for (let j = 0; j < 3; j++) {
168 for(let i=-12;i<6;i++){
169 this.pickerInfoList[j].nameArray1.push(i)
170 this.pickerInfoList[j].nameArray1.push(i+0.5)
171 this.pickerInfoList[j].nameArray2.push(i)
172 this.pickerInfoList[j].nameArray2.push(i+0.5)
173 if(i>=-6){
174 this.pickerInfoList[j].nameArray1.push(i+0.25)
175 this.pickerInfoList[j].nameArray1.push(i+0.75)
176 this.pickerInfoList[j].nameArray2.push(i+0.25)
177 this.pickerInfoList[j].nameArray2.push(i+0.75)
178 }
179 if(i==5){
180 this.pickerInfoList[j].nameArray1.push(i+1)
181 this.pickerInfoList[j].nameArray2.push(i+1)
182 }
183 }
184 }
185 // 初始化日期值
186 for (let i = 1; i < 32; i++){
187 this.pickerInfoList[3].nameArray3.push(i)
188 }
189 // 初始化年份前后五年
190 let myDate = new Date();
191 let nowYear = myDate.getFullYear();
192 for(let i=0;i<5;i++){
193 this.pickerInfoList[3].nameArray1.push(nowYear-i)
194 }
195
196 this.kinds=option.kinds
197 if(option.kinds==1){
198 this.name= '';
199 this.pd= '';
200 } else{
201 console.log('args===>',option.index)
202 const loveList=Object.assign({},this.$store.state.myLoveList.loveList)
203 console.log('args===>',loveList[option.index].in_time)
204 console.log('args===>',loveList[option.index].in_time.toString().slice(0,4))
205 console.log('args===>',loveList[option.index].in_time.toString().slice(5,6)==0)
206 console.log('args===>',loveList[option.index].in_time.toString().slice(8,10))
207 this.name=loveList[option.index].name
208 this.pd=loveList[option.index].pd
209 this.mp_id=loveList[option.index].mp_id
210 // 将kinds =2时的值传到该页面
211 this.pickerInfoList[0].nameArray1.unshift(loveList[option.index].leftSph)
212 this.pickerInfoList[0].nameArray2.unshift(loveList[option.index].rightSph)
213 this.pickerInfoList[1].nameArray1.unshift(loveList[option.index].leftCyl)
214 this.pickerInfoList[1].nameArray2.unshift(loveList[option.index].rightCyl)
215 this.pickerInfoList[2].nameArray1.unshift(loveList[option.index].leftAxi)
216 this.pickerInfoList[2].nameArray2.unshift(loveList[option.index].rightAxi)
217
218 this.pickerInfoList[3].nameArray1.unshift(loveList[option.index].in_time.toString().slice(0,4))
219 if(loveList[option.index].in_time.toString().slice(5,6)==0){
220 this.pickerInfoList[3].nameArray2.unshift(loveList[option.index].in_time.toString().slice(6,7))
221 } else{
222 this.pickerInfoList[3].nameArray2.unshift(loveList[option.index].in_time.toString().slice(5,7))
223 }
224 if(loveList[option.index].in_time.toString().slice(8,9)==0){
225 this.pickerInfoList[3].nameArray3.unshift(loveList[option.index].in_time.toString().slice(9,10))
226 } else{
227 this.pickerInfoList[3].nameArray3.unshift(loveList[option.index].in_time.toString().slice(8,10))
228 }
229 }
230 },
140 methods:{ 231 methods:{
232 handleInput(e){
233 this.name=e.target.value
234 },
235 handleInputPd(e){
236 // 只能输入正浮点数或正数
237 if(/^\d+(\.\d+)?$/.test(e.target.value)){
238 this.pd=e.target.value
239 } else {
240 uni.showToast({
241 title:"请输入有效数据;示例:89",
242 icon: "none",
243 duration: 3000,
244 })
245 this.pd = ''
246 }
247
248 },
249 // 用户提交
250 handleSubmit(){
251 if(this.name==''){
252 uni.showToast({
253 title:"请输入验光单取名",
254 icon: "none",
255 duration: 3000,
256 })
257 }
258 if(this.pd==''){
259 uni.showToast({
260 title:"请输入瞳距",
261 icon: "none",
262 duration: 3000,
263 })
264 }
265 if(this.confirm){
266 if(this.kinds==1){
267 // 添加用户验光单
268 console.log('kinds====>',this.kinds)
269 store.dispatch('myLoveList/addMylove', {
270
271 uid: this.$store.state.user.userInfo.uid,
272 openid: this.$store.state.user.userInfo.openid,
273 // mp_name: this.$store.state.user.userInfo.mp_name,
274 leftSph: this.pickerInfoChioce.leftSph,
275 rightSph: this.pickerInfoChioce.rightSph,
276 leftCyl: this.pickerInfoChioce.leftCyl,
277 rightCyl: this.pickerInfoChioce.rightCyl,
278 leftAxi: this.pickerInfoChioce.leftAxi,
279 rightAxi: this.pickerInfoChioce.rightAxi,
280 pd: this.pd,// 瞳距
281 mp_name:this.name,
282 // time: this.pickerInfoChioce.time,
283 // img_url2: "http://localhost:8087/images/shop_1/1/",
284 });
285 store.dispatch('myLoveList/getLoveList', {
286 uid: this.$store.state.user.userInfo.uid,
287 });
288 uni.navigateBack({
289 delta:1,
290 animationDuration:2000
291 })
292 }
293 if(this.kinds==2){
294 // console.log('kinds====>',this.kinds)
295 // console.log('pickerindex=====>',this.pickerInfoList[0].nameIndex1)
296 // console.log('this.pickerInfoChioce====>',type(this.pickerInfoChioce))
297 const leftList = ["leftSph","leftCyl","leftAxi"];
298 const rightList = ["rightSph", "rightCyl", "rigthAxi"];
299 for (let j=0; j<3; j++) {
300 if(this.pickerInfoList[j].nameIndex1!=0){
301
302 store.dispatch('myLoveList/updateMylove', {
303 uid: this.$store.state.user.userInfo.uid,
304 openid: this.$store.state.user.userInfo.openid,
305 mp_id: this.mp_id,
306 keyname: leftList[j],
307 keyvalue: this.pickerInfoList[j].nameArray1[this.pickerInfoList[j].nameIndex1],
308 });
309 }
310 if(this.pickerInfoList[j].nameIndex2 !=0) {
311 store.dispatch('myLoveList/updateMylove', {
312 uid: this.$store.state.user.userInfo.uid,
313 openid: this.$store.state.user.userInfo.openid,
314 mp_id: this.mp_id,
315 keyname: rightList[j],
316 keyvalue: this.pickerInfoList[j].nameArray2[this.pickerInfoList[j].nameIndex2]
317 });
318 }
319 }
320 store.dispatch('myLoveList/getLoveList', {
321 uid: this.$store.state.user.userInfo.uid,
322 });
323 uni.navigateBack({
324 delta:1,
325 animationDuration:2000
326 })
327
328 }
329
330 } else{
331 uni.showToast({
332 title:"请确认你的验光数据",
333 icon: "none",
334 duration: 3000,
335 })
336 }
337 },
141 changeConfirm() { 338 changeConfirm() {
142 this.tablist.confirm = !this.tablist.confirm 339 this.confirm = !this.confirm
143 }, 340 },
144 341
145 bindPickerChange01: function(e) { 342 bindPickerChange01: function(e) {
146 this.pickerInfoList[0].nameIndex1 = e.target.value 343 this.pickerInfoList[0].nameIndex1 = e.target.value
344 this.pickerInfoChioce.leftSph=this.pickerInfoList[0].nameArray1[e.target.value]
147 }, 345 },
148 bindPickerChange02: function(e) { 346 bindPickerChange02: function(e) {
149 this.pickerInfoList[0].nameIndex2 = e.target.value 347 this.pickerInfoList[0].nameIndex2 = e.target.value
348 this.pickerInfoChioce.rightSph=this.pickerInfoList[0].nameArray2[e.target.value]
150 }, 349 },
151 350
152 bindPickerChange11: function(e) { 351 bindPickerChange11: function(e) {
153 this.pickerInfoList[1].nameIndex1 = e.target.value 352 this.pickerInfoList[1].nameIndex1 = e.target.value
353 this.pickerInfoChioce.leftCyl=this.pickerInfoList[1].nameArray1[e.target.value]
154 }, 354 },
155 bindPickerChange12: function(e) { 355 bindPickerChange12: function(e) {
156 this.pickerInfoList[1].nameIndex2 = e.target.value 356 this.pickerInfoList[1].nameIndex2 = e.target.value
357 this.pickerInfoChioce.rightCyl=this.pickerInfoList[1].nameArray2[e.target.value]
157 }, 358 },
158 359
159 bindPickerChange21: function(e) { 360 bindPickerChange21: function(e) {
160 this.pickerInfoList[2].nameIndex1 = e.target.value 361 this.pickerInfoList[2].nameIndex1 = e.target.value
362 this.pickerInfoChioce.leftAxi=this.pickerInfoList[2].nameArray1[e.target.value]
161 }, 363 },
162 bindPickerChange22: function(e) { 364 bindPickerChange22: function(e) {
163 this.pickerInfoList[2].nameIndex2 = e.target.value 365 this.pickerInfoList[2].nameIndex2 = e.target.value
366 this.pickerInfoChioce.rightAxi=this.pickerInfoList[2].nameArray2[e.target.value]
164 }, 367 },
165 368
166 bindPickerChange31: function(e) {
167 this.pickerInfoList[3].nameIndex1 = e.target.value
168 },
169 bindPickerChange32: function(e) {
170 this.pickerInfoList[3].nameIndex2 = e.target.value
171 },
172
173 bindPickerChange41: function(e) { 369 bindPickerChange41: function(e) {
174 this.pickerInfoList[4].nameIndex1 = e.target.value 370 this.pickerInfoList[3].nameIndex1 = e.target.value
371 this.pickerInfoChioce.time.year=this.pickerInfoList[3].nameArray1[e.target.value]
175 }, 372 },
176 bindPickerChange42: function(e) { 373 bindPickerChange42: function(e) {
177 this.pickerInfoList[4].nameIndex2 = e.target.value 374 this.pickerInfoList[3].nameIndex2 = e.target.value
375 this.pickerInfoChioce.time.month=this.pickerInfoList[3].nameArray2[e.target.value]
178 }, 376 },
179 bindPickerChange43: function(e) { 377 bindPickerChange43: function(e) {
180 this.pickerInfoList[4].nameIndex3 = e.target.value 378 this.pickerInfoList[3].nameIndex3 = e.target.value
379 this.pickerInfoChioce.time.day=this.pickerInfoList[3].nameArray3[e.target.value]
181 }, 380 },
182 } 381 }
183 } 382 }
184 </script> 383 </script>
185 384
186 <style lang="scss"> 385 <style lang="scss">
187 .wrap{ 386 .wrap{
188 min-height: 100vh; 387 min-height: 100vh;
189 background-color: #F2F2F2; 388 background-color: #F2F2F2;
190 .body{ 389 .body{
191 // font-family: PingFangSC-Regular; 390 // font-family: PingFangSC-Regular;
192 font-size: 12px; 391 font-size: 12px;
193 color: #666666; 392 color: #666666;
194 letter-spacing: 0; 393 letter-spacing: 0;
195 .bodyBox{ 394 .bodyBox{
196 margin-top: 15px; 395 margin-top: 15px;
197 .names{ 396 .names{
198 // font-family: PingFangSC-Regular; 397 // font-family: PingFangSC-Regular;
199 font-size: 12px; 398 font-size: 12px;
200 color: #151515; 399 color: #151515;
201 letter-spacing: 0; 400 letter-spacing: 0;
202 text-align: justify; 401 text-align: justify;
203 line-height: 17px; 402 line-height: 17px;
204 margin-left: 5px; 403 margin-left: 5px;
205 margin-right: 10px; 404 margin-right: 10px;
206 } 405 }
207 text{ 406 text{
208 // font-family: PingFangSC-Regular; 407 // font-family: PingFangSC-Regular;
209 font-size: 12px; 408 font-size: 12px;
210 color: #666666; 409 color: #666666;
211 letter-spacing: 0; 410 letter-spacing: 0;
212 text-align: justify; 411 text-align: justify;
213 } 412 }
214 } 413 }
215 414
216 } 415 }
217 .goods-form { 416 .goods-form {
218 display: flex; 417 display: flex;
219 flex-direction: column; 418 flex-direction: column;
220 align-items: center; 419 align-items: center;
221 justify-content: center; 420 justify-content: center;
222 background-color: #fff; 421 background-color: #fff;
223 width: 100%; 422 width: 100%;
224 padding: 40rpx 0; 423 padding: 40rpx 0;
225 .p1 { 424 .p1 {
226 font-size: 16px; 425 font-size: 16px;
227 color: #333333; 426 color: #333333;
228 letter-spacing: -0.3px; 427 letter-spacing: -0.3px;
229 text-align: justify; 428 text-align: justify;
230 line-height: 24px; 429 line-height: 24px;
231 margin: 4px 0; 430 margin: 4px 0;
232 431
233 } 432 }
234 .p2 { 433 .p2 {
235 font-size: 12px; 434 font-size: 12px;
236 color: #999999; 435 color: #999999;
237 letter-spacing: -0.23px; 436 letter-spacing: -0.23px;
238 margin-bottom: 18rpx; 437 margin-bottom: 18rpx;
239 } 438 }
439 .use_pd{
440 display: flex;
441 height: 48rpx;
442 line-height: 48rpx;
443 margin-left: -298rpx;
444 margin-top: 30rpx;
445 margin-bottom: 40rpx;
446 align-items: center;
447 justify-content: center;
448 text{
449 font-size: 14px;
450 color: #333333;
451 margin-right: 44rpx;
452 }
453 }
454 .use_name{
455 display: flex;
456 height: 48rpx;
457 line-height: 48rpx;
458 margin-left: -220rpx;
459 margin-top: 20rpx;
460 align-items: center;
461 justify-content: center;
462 // text-align: center;
463 text{
464 font-size: 14px;
465 color: #333333;
466 margin-right: 44rpx;
467 }
468 }
240 image{ 469 image{
241 width: 28rpx; 470 width: 28rpx;
242 height: 26rpx; 471 height: 26rpx;
243 } 472 }
244 .confirm { 473 .confirm {
245 display: flex; 474 display: flex;
246 align-items: center; 475 align-items: center;
247 font-size: 12px; 476 font-size: 12px;
248 color: #666666; 477 color: #666666;
249 letter-spacing: -0.23px; 478 letter-spacing: -0.23px;
250 width: 684rpx; 479 width: 684rpx;
251 image{ 480 image{
252 margin-right:25rpx; 481 margin-right:25rpx;
253 } 482 }
254 } 483 }
255 .picker{ 484 .picker{
256 display: flex; 485 display: flex;
257 flex-direction: column; 486 flex-direction: column;
258 justify-content: center; 487 justify-content: center;
259 align-items: center; 488 align-items: center;
260 width: 100%; 489 width: 100%;
261 image{ 490 image{
262 width: 10px; 491 width: 10px;
263 height: 10px; 492 height: 10px;
264 margin-right: 5px; 493 margin-right: 5px;
265 } 494 }
266 .picker-choice{ 495 .picker-choice{
267 display: flex; 496 display: flex;
268 width: 684rpx; 497 width: 684rpx;
269 align-items: center; 498 align-items: center;
270 margin-bottom: 40rpx; 499 margin-bottom: 40rpx;
271 .choice-left{ 500 .choice-left{
272 width: 210rpx; 501 width: 210rpx;
273 .p11 { 502 .p11 {
274 font-size: 14px; 503 font-size: 14px;
275 color: #333333; 504 color: #333333;
276 letter-spacing: -0.26px; 505 letter-spacing: -0.26px;
277 text-align: justify; 506 text-align: justify;
278 line-height: 24px; 507 line-height: 24px;
279 // margin-right: 10px; 508 // margin-right: 10px;
280 } 509 }
281 .p12 { 510 .p12 {
282 font-size: 10px; 511 font-size: 10px;
283 color: #3F3F3F; 512 color: #3F3F3F;
284 letter-spacing: -0.19px; 513 letter-spacing: -0.19px;
285 text-align: justify; 514 text-align: justify;
286 line-height: 24px; 515 line-height: 24px;
287 } 516 }
288 517
289 518
290 } 519 }
291 .p13 { 520 .p13 {
292 font-size: 10px; 521 font-size: 10px;
293 color: #999999; 522 color: #999999;
294 letter-spacing: -0.19px; 523 letter-spacing: -0.19px;
295 margin-right: 10px; 524 margin-right: 10px;
296 } 525 }
297 .p13-date { 526 .p13-date {
298 font-size: 10px; 527 font-size: 10px;
299 color: #999999; 528 color: #999999;
300 letter-spacing: -0.19px; 529 letter-spacing: -0.19px;
301 margin-right: 5px; 530 margin-right: 5px;
302 } 531 }
303 .p14 { 532 .p14 {
304 font-size: 14px; 533 font-size: 14px;
305 color: #666666; 534 color: #666666;
306 letter-spacing: -0.26px; 535 letter-spacing: -0.26px;
307 text-align: center; 536 text-align: center;
308 width: 124rpx; 537 width: 124rpx;
309 border-bottom: 1px solid #CFCFCF; 538 border-bottom: 1px solid #CFCFCF;
539 height: 40rpx;
540
310 } 541 }
311 542
312 } 543 }
313 } 544 }
314 } 545 }
315 546
316 .footer{ 547 .footer{
317 width: 100%; 548 width: 100%;
318 position: fixed; 549 position: fixed;
319 bottom: 0; 550 bottom: 0;
320 left: 0; 551 left: 0;
321 .btn{ 552 .btn{
322 width: 100%; 553 width: 100%;
323 height: 112rpx; 554 height: 112rpx;
324 line-height: 112rpx; 555 line-height: 112rpx;
src/pages/purchaseLenses/purchaseLenses.vue
1 <template> 1 <template>
2 <view class="content"> 2 <view class="content">
3 <view class="goodInfo"> 3 <view class="goodInfo">
4 <view class="imageWrap"> 4 <view class="imageWrap">
5 <image 5 <image
6 src="../../static/img/detail/d1.png" 6 src="../../static/img/detail/d1.png"
7 mode="aspectFill" 7 mode="aspectFill"
8 style="width: 188rpx;height: 168rpx;" 8 style="width: 188rpx;height: 168rpx;"
9 ></image> 9 ></image>
10 </view> 10 </view>
11 <view class="infoRight"> 11 <view class="infoRight">
12 <text class="goodName">商品名称商品名称商品名称名称名称商品名称名商品名称名</text> 12 <text class="goodName">商品名称商品名称商品名称名称名称商品名称名商品名称名</text>
13 <text class="remarks">支持7天无理由退货 顺丰发货</text> 13 <text class="remarks">支持7天无理由退货 顺丰发货</text>
14 <view class="priceBox"> 14 <view class="priceBox">
15 <view class="price">¥198</view> 15 <view class="price">¥198</view>
16 <text>(限购{{maxCount}}副)</text> 16 <text>(限购{{maxCount}}副)</text>
17 <view class="counter"> 17 <view class="counter">
18 <view 18 <view
19 class="btn" 19 class="btn"
20 disabled="this.addDisabled" 20 disabled="this.addDisabled"
21 type="default" 21 type="default"
22 @click="counter(false)" 22 @click="counter(false)"
23 >-</view> 23 >-</view>
24 <text>{{count}}</text> 24 <text>{{count}}</text>
25 <view 25 <view
26 class="btn" 26 class="btn"
27 disabled="this.desDisabled" 27 disabled="this.desDisabled"
28 type="default" 28 type="default"
29 @click="counter(true)" 29 @click="counter(true)"
30 >+</view> 30 >+</view>
31 </view> 31 </view>
32 </view> 32 </view>
33 </view> 33 </view>
34 </view> 34 </view>
35 <view class="goods-data"> 35 <view class="goods-data">
36 <view class="opCollapse"> 36 <view class="opCollapse">
37 <view class="body"> 37 <view class="body">
38 <template v-if="opIsOpen"> 38 <template v-if="opIsOpen">
39 <view class="goods-form"> 39 <view class="goods-form">
40 <view class="data-title"> 40 <view class="data-title">
41 <image src="../../static/icon-data.png"></image> 41 <image src="../../static/icon-data.png"></image>
42 <text class="p1">填写验光数据</text> 42 <text class="p1">填写验光数据</text>
43 </view> 43 </view>
44 <text class="p2">没有验光数据?请到线下眼镜店验光哦~</text> 44 <text class="p2">没有验光数据?请到线下眼镜店验光哦~</text>
45 <view class="picker"> 45 <view class="picker">
46 <view class="picker-choice"> 46 <view class="picker-choice">
47 <view class="choice-left"> 47 <view class="choice-left">
48 <text class="p11">验光单取名:</text> 48 <text class="p11">验光单取名:</text>
49 </view> 49 </view>
50 <input 50 <input
51 class="choice-name uni-input" 51 class="choice-name uni-input"
52 placeholder="下系" 52 placeholder="下系"
53 /> 53 />
54 </view> 54 </view>
55 </view> 55 </view>
56 <view class="picker"> 56 <view class="picker">
57 <view class="picker-choice"> 57 <view class="picker-choice">
58 <view class="choice-left"> 58 <view class="choice-left">
59 <text class="p11">{{pickerInfoList[0].nameC}}</text> 59 <text class="p11">{{pickerInfoList[0].nameC}}</text>
60 <text class="p12">{{pickerInfoList[0].nameE}}</text> 60 <text class="p12">{{pickerInfoList[0].nameE}}</text>
61 </view> 61 </view>
62 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text> 62 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
63 <text class="p14">{{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}</text> 63 <text class="p14">{{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}</text>
64 <picker 64 <picker
65 @change="bindPickerChange01" 65 @change="bindPickerChange01"
66 :value="pickerInfoList[0].nameIndex1" 66 :value="pickerInfoList[0].nameIndex1"
67 :range="pickerInfoList[0].nameArray1" 67 :range="pickerInfoList[0].nameArray1"
68 > 68 >
69 <image src="../../static/detail-tabicon.png"></image> 69 <image src="../../static/detail-tabicon.png"></image>
70 </picker> 70 </picker>
71 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text> 71 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
72 <text class="p14">{{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}</text> 72 <text class="p14">{{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}</text>
73 <picker 73 <picker
74 @change="bindPickerChange02" 74 @change="bindPickerChange02"
75 :value="pickerInfoList[0].nameIndex2" 75 :value="pickerInfoList[0].nameIndex2"
76 :range="pickerInfoList[0].nameArray2" 76 :range="pickerInfoList[0].nameArray2"
77 > 77 >
78 <image src="../../static/detail-tabicon.png"></image> 78 <image src="../../static/detail-tabicon.png"></image>
79 </picker> 79 </picker>
80 </view> 80 </view>
81 </view> 81 </view>
82 <view class="picker"> 82 <view class="picker">
83 <view class="picker-choice"> 83 <view class="picker-choice">
84 <view class="choice-left"> 84 <view class="choice-left">
85 <text class="p11">{{pickerInfoList[1].nameC}}</text> 85 <text class="p11">{{pickerInfoList[1].nameC}}</text>
86 <text class="p12">{{pickerInfoList[1].nameE}}</text> 86 <text class="p12">{{pickerInfoList[1].nameE}}</text>
87 </view> 87 </view>
88 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text> 88 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
89 <text class="p14">{{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}</text> 89 <text class="p14">{{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}</text>
90 <picker 90 <picker
91 @change="bindPickerChange11" 91 @change="bindPickerChange11"
92 :value="pickerInfoList[1].nameIndex1" 92 :value="pickerInfoList[1].nameIndex1"
93 :range="pickerInfoList[1].nameArray1" 93 :range="pickerInfoList[1].nameArray1"
94 > 94 >
95 <image src="../../static/detail-tabicon.png"></image> 95 <image src="../../static/detail-tabicon.png"></image>
96 </picker> 96 </picker>
97 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text> 97 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
98 <text class="p14">{{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}</text> 98 <text class="p14">{{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}</text>
99 <picker 99 <picker
100 @change="bindPickerChange12" 100 @change="bindPickerChange12"
101 :value="pickerInfoList[1].nameIndex2" 101 :value="pickerInfoList[1].nameIndex2"
102 :range="pickerInfoList[1].nameArray2" 102 :range="pickerInfoList[1].nameArray2"
103 > 103 >
104 <image src="../../static/detail-tabicon.png"></image> 104 <image src="../../static/detail-tabicon.png"></image>
105 </picker> 105 </picker>
106 </view> 106 </view>
107 </view> 107 </view>
108 <view class="picker"> 108 <view class="picker">
109 <view class="picker-choice"> 109 <view class="picker-choice">
110 <view class="choice-left"> 110 <view class="choice-left">
111 <text class="p11">{{pickerInfoList[2].nameC}}</text> 111 <text class="p11">{{pickerInfoList[2].nameC}}</text>
112 <text class="p12">{{pickerInfoList[2].nameE}}</text> 112 <text class="p12">{{pickerInfoList[2].nameE}}</text>
113 </view> 113 </view>
114 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text> 114 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
115 <text class="p14">{{pickerInfoList[2].nameArray1[pickerInfoList[2].nameIndex1]}}</text> 115 <text class="p14">{{pickerInfoList[2].nameArray1[pickerInfoList[2].nameIndex1]}}</text>
116 <picker 116 <picker
117 @change="bindPickerChange21" 117 @change="bindPickerChange21"
118 :value="pickerInfoList[2].nameIndex1" 118 :value="pickerInfoList[2].nameIndex1"
119 :range="pickerInfoList[2].nameArray1" 119 :range="pickerInfoList[2].nameArray1"
120 > 120 >
121 <image src="../../static/detail-tabicon.png"></image> 121 <image src="../../static/detail-tabicon.png"></image>
122 </picker> 122 </picker>
123 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text> 123 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
124 <text class="p14">{{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}</text> 124 <text class="p14">{{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}</text>
125 <picker 125 <picker
126 @change="bindPickerChange22" 126 @change="bindPickerChange22"
127 :value="pickerInfoList[2].nameIndex2" 127 :value="pickerInfoList[2].nameIndex2"
128 :range="pickerInfoList[2].nameArray2" 128 :range="pickerInfoList[2].nameArray2"
129 > 129 >
130 <image src="../../static/detail-tabicon.png"></image> 130 <image src="../../static/detail-tabicon.png"></image>
131 </picker> 131 </picker>
132 </view> 132 </view>
133 </view> 133 </view>
134 <view class="picker"> 134 <view class="picker">
135 <view class="picker-choice"> 135 <view class="picker-choice">
136 <view class="choice-left"> 136 <view class="choice-left">
137 <text class="p11">{{pickerInfoList[3].nameC}}</text> 137 <text class="p11">{{pickerInfoList[3].nameC}}</text>
138 <text class="p12">{{pickerInfoList[3].nameE}}</text> 138 <text class="p12">{{pickerInfoList[3].nameE}}</text>
139 </view> 139 </view>
140 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text> 140 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
141 <text class="p14">{{pickerInfoList[3].nameArray1[pickerInfoList[3].nameIndex1]}}</text> 141 <text class="p14">{{pickerInfoList[3].nameArray1[pickerInfoList[3].nameIndex1]}}</text>
142 <picker 142 <picker
143 @change="bindPickerChange31" 143 @change="bindPickerChange31"
144 :value="pickerInfoList[3].nameIndex1" 144 :value="pickerInfoList[3].nameIndex1"
145 :range="pickerInfoList[3].nameArray1" 145 :range="pickerInfoList[3].nameArray1"
146 > 146 >
147 <image src="../../static/detail-tabicon.png"></image> 147 <image src="../../static/detail-tabicon.png"></image>
148 </picker> 148 </picker>
149 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text> 149 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
150 <text class="p14">{{pickerInfoList[3].nameArray2[pickerInfoList[3].nameIndex2]}}</text> 150 <text class="p14">{{pickerInfoList[3].nameArray2[pickerInfoList[3].nameIndex2]}}</text>
151 <picker 151 <picker
152 @change="bindPickerChange32" 152 @change="bindPickerChange32"
153 :value="pickerInfoList[3].nameIndex2" 153 :value="pickerInfoList[3].nameIndex2"
154 :range="pickerInfoList[3].nameArray2" 154 :range="pickerInfoList[3].nameArray2"
155 > 155 >
156 <image src="../../static/detail-tabicon.png"></image> 156 <image src="../../static/detail-tabicon.png"></image>
157 </picker> 157 </picker>
158 </view> 158 </view>
159 </view> 159 </view>
160 <view class="picker"> 160 <view class="picker">
161 <view class="picker-choice"> 161 <view class="picker-choice">
162 <view class="choice-left"> 162 <view class="choice-left">
163 <text class="p11">{{pickerInfoList[4].nameC}}</text> 163 <text class="p11">{{pickerInfoList[4].nameC}}</text>
164 </view> 164 </view>
165 <text class="p13-date">年&nbsp;&nbsp;&nbsp;(Y)</text> 165 <text class="p13-date">年&nbsp;&nbsp;&nbsp;(Y)</text>
166 <text 166 <text
167 class="p14" 167 class="p14"
168 style="width: 34px;" 168 style="width: 34px;"
169 >{{pickerInfoList[4].nameArray1[pickerInfoList[4].nameIndex1]}}</text> 169 >{{pickerInfoList[4].nameArray1[pickerInfoList[4].nameIndex1]}}</text>
170 <picker 170 <picker
171 @change="bindPickerChange41" 171 @change="bindPickerChange41"
172 :value="pickerInfoList[4].nameIndex1" 172 :value="pickerInfoList[4].nameIndex1"
173 :range="pickerInfoList[4].nameArray1" 173 :range="pickerInfoList[4].nameArray1"
174 > 174 >
175 <image src="../../static/detail-tabicon.png"></image> 175 <image src="../../static/detail-tabicon.png"></image>
176 </picker> 176 </picker>
177 <text class="p13-date">月&nbsp;&nbsp;&nbsp;(M)</text> 177 <text class="p13-date">月&nbsp;&nbsp;&nbsp;(M)</text>
178 <text 178 <text
179 class="p14" 179 class="p14"
180 style="width: 30px;" 180 style="width: 30px;"
181 >{{pickerInfoList[4].nameArray2[pickerInfoList[4].nameIndex2]}}</text> 181 >{{pickerInfoList[4].nameArray2[pickerInfoList[4].nameIndex2]}}</text>
182 <picker 182 <picker
183 @change="bindPickerChange42" 183 @change="bindPickerChange42"
184 :value="pickerInfoList[4].nameIndex2" 184 :value="pickerInfoList[4].nameIndex2"
185 :range="pickerInfoList[4].nameArray2" 185 :range="pickerInfoList[4].nameArray2"
186 > 186 >
187 <image src="../../static/detail-tabicon.png"></image> 187 <image src="../../static/detail-tabicon.png"></image>
188 </picker> 188 </picker>
189 <text class="p13-date">日&nbsp;&nbsp;&nbsp;(D)</text> 189 <text class="p13-date">日&nbsp;&nbsp;&nbsp;(D)</text>
190 <text 190 <text
191 class="p14" 191 class="p14"
192 style="width: 30px;" 192 style="width: 30px;"
193 >{{pickerInfoList[4].nameArray3[pickerInfoList[4].nameIndex3]}}</text> 193 >{{pickerInfoList[4].nameArray3[pickerInfoList[4].nameIndex3]}}</text>
194 <picker 194 <picker
195 @change="bindPickerChange43" 195 @change="bindPickerChange43"
196 :value="pickerInfoList[4].nameIndex3" 196 :value="pickerInfoList[4].nameIndex3"
197 :range="pickerInfoList[4].nameArray3" 197 :range="pickerInfoList[4].nameArray3"
198 > 198 >
199 <image src="../../static/detail-tabicon.png"></image> 199 <image src="../../static/detail-tabicon.png"></image>
200 </picker> 200 </picker>
201 </view> 201 </view>
202 </view> 202 </view>
203 <view class="confirm"> 203 <view class="confirm">
204 <image 204 <image
205 :src="tablist.confirm ? tabicon[0] : tabicon[1]" 205 :src="tablist.confirm ? tabicon[0] : tabicon[1]"
206 @click="changeConfirm" 206 @click="changeConfirm"
207 ></image> 207 ></image>
208 <text>确认以上输入信息来源于我的验光数据!</text> 208 <text>确认以上输入信息来源于我的验光数据!</text>
209 </view> 209 </view>
210 </view> 210 </view>
211 211
212 </template> 212 </template>
213 <template v-else> 213 <template v-else>
214 <view 214 <view
215 v-for="item in pickerInfoList" 215 v-for="item in pickerInfoList"
216 :key="item.key" 216 :key="item.key"
217 class="bodyBox" 217 class="bodyBox"
218 > 218 >
219 <template v-if="item.nameC==='验光日期'"> 219 <template v-if="item.nameC==='验光日期'">
220 <text class="names">{{item.nameC}}</text> 220 <text class="names">{{item.nameC}}</text>
221 <text style="margin-right: 5px;">{{item.nameArray1[item.nameIndex1]}}年</text> 221 <text style="margin-right: 5px;">{{item.nameArray1[item.nameIndex1]}}年</text>
222 <text style="margin-right: 5px;">{{item.nameArray2[item.nameIndex2]}}月</text> 222 <text style="margin-right: 5px;">{{item.nameArray2[item.nameIndex2]}}月</text>
223 <text>{{item.nameArray3[item.nameIndex2]}}日</text> 223 <text>{{item.nameArray3[item.nameIndex2]}}日</text>
224 </template> 224 </template>
225 <template v-else> 225 <template v-else>
226 <template v-if="item.nameC==='度数'"> 226 <template v-if="item.nameC==='度数'">
227 <text style="display: inline;">*</text> 227 <text style="display: inline;">*</text>
228 </template> 228 </template>
229 229
230 <text class="names">{{item.nameC}}</text> 230 <text class="names">{{item.nameC}}</text>
231 <text style="margin-right: 10px;">左&nbsp;{{item.nameArray1[item.nameIndex1]}}</text> 231 <text style="margin-right: 10px;">左&nbsp;{{item.nameArray1[item.nameIndex1]}}</text>
232 <text>右&nbsp;{{item.nameArray2[item.nameIndex2]}}</text> 232 <text>右&nbsp;{{item.nameArray2[item.nameIndex2]}}</text>
233 </template> 233 </template>
234 </view> 234 </view>
235 </template> 235 </template>
236 </view> 236 </view>
237 </view> 237 </view>
238 </view> 238 </view>
239 <view class="choose"> 239 <view class="choose">
240 <view 240 <view
241 class="chooseItem_1_content" 241 class="chooseItem_1_content"
242 v-for="(item,index) in attrList" 242 v-for="(item,index) in attrList"
243 :key="index" 243 :key="index"
244 > 244 >
245 <UniCollapse @change="change(index)"> 245 <UniCollapse @change="change(index)">
246 <UniCollapseItem 246 <UniCollapseItem
247 :open="show[index]" 247 :open="show[index]"
248 :title="item.meta_name" 248 :title="item.meta_name"
249 showAnimation=false 249 showAnimation=false
250 > 250 >
251 <view class="chooseItem_1_content"> 251 <view class="chooseItem_1_content">
252 <view class="itemsWrap"> 252 <view class="itemsWrap">
253 <view 253 <view
254 class="item2" 254 class="item2"
255 v-for="(one,i) in item.attr" 255 v-for="(one,i) in item.attr"
256 :key="i" 256 :key="i"
257 :class="{ active2: current[index] === i }" 257 :class="{ active2: current[index] === i }"
258 @click="onClickItem(index, i)" 258 @click="onClickItem(index, i)"
259 >{{one.name}}</view> 259 >{{one.name}}</view>
260 </view> 260 </view>
261 </view> 261 </view>
262 </UniCollapseItem> 262 </UniCollapseItem>
263 </UniCollapse> 263 </UniCollapse>
264 <view 264 <view
265 class="chooseRes" 265 class="chooseRes"
266 v-show="!show[index]" 266 v-show="!show[index]"
267 >* {{attrList[index].attr[current[index]].name}}</view> 267 >* {{attrList[index].attr[current[index]].name}}</view>
268 </view> 268 </view>
269 <!-- <view class="chooseItem_1 chooseItem"> 269 <!-- <view class="chooseItem_1 chooseItem">
270 <UniCollapse @change="change(1)"> 270 <UniCollapse @change="change(1)">
271 <UniCollapseItem 271 <UniCollapseItem
272 open=true 272 open=true
273 title="款式挑选" 273 title="款式挑选"
274 showAnimation=false 274 showAnimation=false
275 > 275 >
276 <view 276 <view
277 class="chooseRes" 277 class="chooseRes"
278 v-show="show[1]" 278 v-show="show[1]"
279 >* {{chooseRes1}}</view> 279 >* {{chooseRes1}}</view>
280 <view class="chooseItem_1_content"> 280 <view class="chooseItem_1_content">
281 <view class="itemsWrap"> 281 <view class="itemsWrap">
282 <view 282 <view
283 class="item1" 283 class="item1"
284 v-for="(item,index) in chooseItem1" 284 v-for="(item,index) in chooseItem1"
285 :key="index" 285 :key="index"
286 :style="item.style" 286 :style="item.style"
287 :class="{ active1: current1 === index }" 287 :class="{ active1: current1 === index }"
288 @click="onClickItem1(index)" 288 @click="onClickItem1(index)"
289 ></view> 289 ></view>
290 </view> 290 </view>
291 </view> 291 </view>
292 </UniCollapseItem> 292 </UniCollapseItem>
293 </UniCollapse> 293 </UniCollapse>
294 <view 294 <view
295 class="chooseRes" 295 class="chooseRes"
296 v-show="show[1]" 296 v-show="show[1]"
297 >* {{chooseRes1}}</view> 297 >* {{chooseRes1}}</view>
298 </view> 298 </view>
299 <view class="chooseItem_2 chooseItem "> 299 <view class="chooseItem_2 chooseItem ">
300 <UniCollapse @change="change(2)"> 300 <UniCollapse @change="change(2)">
301 <UniCollapseItem 301 <UniCollapseItem
302 open=true 302 open=true
303 title="直径" 303 title="直径"
304 showAnimation=false 304 showAnimation=false
305 > 305 >
306 <view class="chooseItem_1_content"> 306 <view class="chooseItem_1_content">
307 <view class="itemsWrap"> 307 <view class="itemsWrap">
308 <view 308 <view
309 class="item2" 309 class="item2"
310 v-for="(item,index) in chooseItem2" 310 v-for="(item,index) in chooseItem2"
311 :key="index" 311 :key="index"
312 :class="{ active2: current2 === index }" 312 :class="{ active2: current2 === index }"
313 @click="onClickItem2(index)" 313 @click="onClickItem2(index)"
314 >{{item.num}}</view> 314 >{{item.num}}</view>
315 </view> 315 </view>
316 </view> 316 </view>
317 </UniCollapseItem> 317 </UniCollapseItem>
318 </UniCollapse> 318 </UniCollapse>
319 <view 319 <view
320 class="chooseRes" 320 class="chooseRes"
321 v-show="show[2]" 321 v-show="show[2]"
322 >* {{chooseRes2}}</view> 322 >* {{chooseRes2}}</view>
323 </view> 323 </view>
324 <view class="chooseItem_3 chooseItem"> 324 <view class="chooseItem_3 chooseItem">
325 <UniCollapse @change="change(3)"> 325 <UniCollapse @change="change(3)">
326 <UniCollapseItem 326 <UniCollapseItem
327 open=true 327 open=true
328 title="度数" 328 title="度数"
329 showAnimation=false 329 showAnimation=false
330 > 330 >
331 <view class="chooseItem_1_content"> 331 <view class="chooseItem_1_content">
332 <view class="itemsWrap"> 332 <view class="itemsWrap">
333 <view 333 <view
334 class="item2" 334 class="item2"
335 v-for="(item,index) in chooseItem3" 335 v-for="(item,index) in chooseItem3"
336 :key="index" 336 :key="index"
337 :class="{ active2: current3 === index }" 337 :class="{ active2: current3 === index }"
338 @click="onClickItem3(index)" 338 @click="onClickItem3(index)"
339 >{{item}}</view> 339 >{{item}}</view>
340 </view> 340 </view>
341 </view> 341 </view>
342 </UniCollapseItem> 342 </UniCollapseItem>
343 </UniCollapse> 343 </UniCollapse>
344 <view 344 <view
345 class="chooseRes" 345 class="chooseRes"
346 v-show="show[3]" 346 v-show="show[3]"
347 >* {{chooseRes3}}</view> 347 >* {{chooseRes3}}</view>
348 </view> --> 348 </view> -->
349 </view> 349 </view>
350 <view 350 <view
351 class="button" 351 class="button"
352 @click="toComfirmOrder" 352 @click="toComfirmOrder"
353 > 353 >
354 立即结算 354 立即结算
355 </view> 355 </view>
356 </view> 356 </view>
357 </template> 357 </template>
358 358
359 <script> 359 <script>
360 import UniCollapse from '@/components/UniCollapse/UniCollapse.vue' 360 import UniCollapse from '@/components/UniCollapse/UniCollapse.vue'
361 import UniCollapseItem from '@/components/UniCollapseItem/UniCollapseItem.vue' 361 import UniCollapseItem from '@/components/UniCollapseItem/UniCollapseItem.vue'
362 import store from '@/store' 362 import store from '@/store'
363 363
364 export default { 364 export default {
365 components: { 365 components: {
366 UniCollapse, 366 UniCollapse,
367 UniCollapseItem 367 UniCollapseItem
368 }, 368 },
369 data() { 369 data() {
370 return { 370 return {
371 count: 1, 371 count: 1,
372 pid: 0, 372 pid: 0,
373 maxCount: 20, 373 maxCount: 20,
374 isShow: true, 374 isShow: true,
375 opIsOpen: true, 375 opIsOpen: true,
376 addDisabled: false, 376 addDisabled: false,
377 desDisabled: false, 377 desDisabled: false,
378 current1: 0, 378 current1: 0,
379 current2: 0, 379 current2: 0,
380 current3: 0, 380 current3: 0,
381 current: [], 381 current: [],
382 show: [], 382 show: [],
383 chooseRes1: { 383 chooseRes1: {
384 sku_name: 'Miss 黑二代【减龄自然】', 384 sku_name: 'Miss 黑二代【减龄自然】',
385 sk_id: '128' 385 sk_id: '128'
386 }, 386 },
387 chooseRes2: '14.0', 387 chooseRes2: '14.0',
388 chooseRes3: 0, 388 chooseRes3: 0,
389 chooseItem1: [ 389 chooseItem1: [
390 { style: 'opacity: 0.7;background-image: radial-gradient(50% 148%, #ECEAEA 50%, #8D8C8C 100%);', describ: 'Miss 黑1代【减龄自然】' }, 390 { style: 'opacity: 0.7;background-image: radial-gradient(50% 148%, #ECEAEA 50%, #8D8C8C 100%);', describ: 'Miss 黑1代【减龄自然】' },
391 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑二代【防紫外线】' }, 391 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑二代【防紫外线】' },
392 { style: 'background-image: radial-gradient(50% 148%, #FDF8F6 50%, #94380B 100%);', describ: 'Miss 黑3代【防紫外线】' }, 392 { style: 'background-image: radial-gradient(50% 148%, #FDF8F6 50%, #94380B 100%);', describ: 'Miss 黑3代【防紫外线】' },
393 { style: 'background-image: radial-gradient(50% 148%, #FFFFFF 50%, #324A05 100%);', describ: 'Miss 黑4代【防紫外线】' }, 393 { style: 'background-image: radial-gradient(50% 148%, #FFFFFF 50%, #324A05 100%);', describ: 'Miss 黑4代【防紫外线】' },
394 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑5代【防紫外线】' }, 394 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑5代【防紫外线】' },
395 { style: 'opacity: 0.7;background-image: radial-gradient(50% 150%, #F0EEE7 50%, #6F0838 100%);', describ: 'Miss 黑6代【防紫外线】' }, 395 { style: 'opacity: 0.7;background-image: radial-gradient(50% 150%, #F0EEE7 50%, #6F0838 100%);', describ: 'Miss 黑6代【防紫外线】' },
396 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #370B4E 100%);', describ: 'Miss 黑7代【防紫外线】' }, 396 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #370B4E 100%);', describ: 'Miss 黑7代【防紫外线】' },
397 { style: 'background-image: radial-gradient(50% 148%, #FFFFFF 50%, #324A05 100%);', describ: 'Miss 黑4代【防紫外线】' }, 397 { style: 'background-image: radial-gradient(50% 148%, #FFFFFF 50%, #324A05 100%);', describ: 'Miss 黑4代【防紫外线】' },
398 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑5代【防紫外线】' }, 398 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑5代【防紫外线】' },
399 { style: 'opacity: 0.7;background-image: radial-gradient(50% 150%, #F0EEE7 50%, #6F0838 100%);', describ: 'Miss 黑6代【防紫外线】' }, 399 { style: 'opacity: 0.7;background-image: radial-gradient(50% 150%, #F0EEE7 50%, #6F0838 100%);', describ: 'Miss 黑6代【防紫外线】' },
400 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #370B4E 100%);', describ: 'Miss 黑7代【防紫外线】' }, 400 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #370B4E 100%);', describ: 'Miss 黑7代【防紫外线】' },
401 { style: 'background-image: radial-gradient(50% 148%, #FFFFFF 50%, #324A05 100%);', describ: 'Miss 黑4代【防紫外线】' }, 401 { style: 'background-image: radial-gradient(50% 148%, #FFFFFF 50%, #324A05 100%);', describ: 'Miss 黑4代【防紫外线】' },
402 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑5代【防紫外线】' }, 402 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑5代【防紫外线】' },
403 { style: 'opacity: 0.7;background-image: radial-gradient(50% 150%, #F0EEE7 50%, #6F0838 100%);', describ: 'Miss 黑6代【防紫外线】' }, 403 { style: 'opacity: 0.7;background-image: radial-gradient(50% 150%, #F0EEE7 50%, #6F0838 100%);', describ: 'Miss 黑6代【防紫外线】' },
404 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #370B4E 100%);', describ: 'Miss 黑7代【防紫外线】' } 404 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #370B4E 100%);', describ: 'Miss 黑7代【防紫外线】' }
405 ], 405 ],
406 chooseItem2: [ 406 chooseItem2: [
407 { num: '14.0' }, 407 { num: '14.0' },
408 { num: '14.2' }, 408 { num: '14.2' },
409 { num: '14.4' }, 409 { num: '14.4' },
410 { num: '14.5' } 410 { num: '14.5' }
411 ], 411 ],
412 chooseItem3: [0, 100, 125, 150, 175, 200, 225, 250, 275, 300, 325, 350, 375, 400, 425, 450, 470, 500, 525, 550, 575, 600, 1000], 412 chooseItem3: [0, 100, 125, 150, 175, 200, 225, 250, 275, 300, 325, 350, 375, 400, 425, 450, 470, 500, 525, 550, 575, 600, 1000],
413 // 度数相关数据 413 // 度数相关数据
414 pickerInfoList: [ 414 pickerInfoList: [
415 { nameC: '度数', nameE: '(SPH)', nameArray1: [1.5, 2.5, 3.5, 4.5], nameIndex1: 0, nameArray2: [1.5, 2.5, 3.5, 4.5], nameIndex2: 0, key: 0 }, 415 { nameC: '度数', nameE: '(SPH)', nameArray1: [1.5, 2.5, 3.5, 4.5], nameIndex1: 0, nameArray2: [1.5, 2.5, 3.5, 4.5], nameIndex2: 0, key: 0 },
416 { nameC: '散光', nameE: '(CYL)', nameArray1: [1.5, 2.5, 3.5, 4.5], nameIndex1: 0, nameArray2: [1.5, 2.5, 3.5, 4.5], nameIndex2: 0, key: 1 }, 416 { nameC: '散光', nameE: '(CYL)', nameArray1: [1.5, 2.5, 3.5, 4.5], nameIndex1: 0, nameArray2: [1.5, 2.5, 3.5, 4.5], nameIndex2: 0, key: 1 },
417 { nameC: '散光轴位', nameE: '(AXI)', nameArray1: [1.5, 2.5, 3.5, 4.5], nameIndex1: 0, nameArray2: [1.5, 2.5, 3.5, 4.5], nameIndex2: 0, key: 2 }, 417 { nameC: '散光轴位', nameE: '(AXI)', nameArray1: [1.5, 2.5, 3.5, 4.5], nameIndex1: 0, nameArray2: [1.5, 2.5, 3.5, 4.5], nameIndex2: 0, key: 2 },
418 { nameC: '双眼瞳距', nameE: '(PD)', nameArray1: [1.5, 2.5, 3.5, 4.5], nameIndex1: 0, nameArray2: [1.5, 2.5, 3.5, 4.5], nameIndex2: 0, key: 3 }, 418 { nameC: '双眼瞳距', nameE: '(PD)', nameArray1: [1.5, 2.5, 3.5, 4.5], nameIndex1: 0, nameArray2: [1.5, 2.5, 3.5, 4.5], nameIndex2: 0, key: 3 },
419 { nameC: '验光日期', nameE: '', nameArray1: [2017, 2018, 2019, 2020, 2021], nameIndex1: 0, nameArray2: [1, 2, 3, 4, 5, 6, 7], nameIndex2: 0, nameArray3: [1, 2, 3, 4, 5, 6], nameIndex3: 0 } 419 { nameC: '验光日期', nameE: '', nameArray1: [2017, 2018, 2019, 2020, 2021], nameIndex1: 0, nameArray2: [1, 2, 3, 4, 5, 6, 7], nameIndex2: 0, nameArray3: [1, 2, 3, 4, 5, 6], nameIndex3: 0 }
420 ] 420 ]
421 } 421 }
422 }, 422 },
423 computed: { 423 computed: {
424 attrList() { 424 attrList() {
425 return this.$store.state.read.goodInfo.attrList 425 return this.$store.state.read.goodInfo.attrList
426 }, 426 },
427 skuList() { 427 skuList() {
428 return this.$store.state.read.goodInfo.skuList 428 return this.$store.state.read.goodInfo.skuList
429 } 429 }
430 }, 430 },
431 onLoad({ pid }) { 431 onLoad({ pid }) {
432 this.pid = pid 432 this.pid = pid
433 store.dispatch('read/fetch', { 433 store.dispatch('read/fetch', {
434 pid 434 pid
435 }).then(() => { 435 }).then(() => {
436 const current = [] 436 const current = []
437 const show = [] 437 const show = []
438 for (let index = 0; index < this.attrList.length; index++) { 438 for (let index = 0; index < this.attrList.length; index++) {
439 current.push(0) 439 current.push(0)
440 show.push(true) 440 show.push(true)
441 } 441 }
442 this.current = current 442 this.current = current
443 this.show = show 443 this.show = show
444 }) 444 })
445 }, 445 },
446 methods: { 446 methods: {
447 change(num) { 447 change(num) {
448 this.show[num] = !this.show[num] 448 this.show[num] = !this.show[num]
449 this.$forceUpdate() 449 this.$forceUpdate()
450 }, 450 },
451 onClickItem(index, i) { 451 onClickItem(index, i) {
452 if (this.current[index] !== i) { 452 if (this.current[index] !== i) {
453 this.current[index] = i 453 this.current[index] = i
454 } 454 }
455 this.$forceUpdate() 455 this.$forceUpdate()
456 }, 456 },
457 onClickItem1(index) { 457 onClickItem1(index) {
458 if (this.current1 !== index) { 458 if (this.current1 !== index) {
459 this.current1 = index 459 this.current1 = index
460 this.chooseRes1 = this.chooseItem1[index].describ 460 this.chooseRes1 = this.chooseItem1[index].describ
461 } 461 }
462 }, 462 },
463 onClickItem2(index) { 463 onClickItem2(index) {
464 if (this.current2 !== index) { 464 if (this.current2 !== index) {
465 this.current2 = index 465 this.current2 = index
466 this.chooseRes2 = this.chooseItem2[index].num 466 this.chooseRes2 = this.chooseItem2[index].num
467 } 467 }
468 }, 468 },
469 onClickItem3(index) { 469 onClickItem3(index) {
470 if (this.current3 !== index) { 470 if (this.current3 !== index) {
471 this.current3 = index 471 this.current3 = index
472 this.chooseRes3 = this.chooseItem3[index] 472 this.chooseRes3 = this.chooseItem3[index]
473 } 473 }
474 }, 474 },
475 counter(isadd) { 475 counter(isadd) {
476 if (isadd) { 476 if (isadd) {
477 this.count >= this.maxCount ? this.addDisabled = true : this.count++ 477 this.count >= this.maxCount ? this.addDisabled = true : this.count++
478 } else { 478 } else {
479 this.count <= 1 ? this.desDisabled = true : this.count-- 479 this.count <= 1 ? this.desDisabled = true : this.count--
480 } 480 }
481 }, 481 },
482 toComfirmOrder() { 482 toComfirmOrder() {
483 store.dispatch('order/saveParams', { 483 store.dispatch('order/saveParams', {
484 current: this.current 484 current: this.current
485 }) 485 })
486 uni.navigateTo({ 486 uni.navigateTo({
487 url: `../confirmOrder/confirmOrder?pid=${this.pid}` 487 url: `../confirmOrder/confirmOrder?pid=${this.pid}`
488 }) 488 })
489 } 489 }
490 } 490 }
491 } 491 }
492 </script> 492 </script>
493 493
494 <style lang="scss"> 494 <style lang="scss">
495 .content { 495 .content {
496 min-height: 100vh; 496 min-height: 100vh;
497 background-color: #f2f2f2; 497 background-color: #f2f2f2;
498 // padding-top: 20rpx; 498 // padding-top: 20rpx;
499 .goodInfo { 499 .goodInfo {
500 width: 100%; 500 width: 100%;
501 height: 272rpx; 501 height: 272rpx;
502 border-radius: 16rpx; 502 border-radius: 16rpx;
503 background-color: #ffffff; 503 background-color: #ffffff;
504 box-sizing: border-box; 504 box-sizing: border-box;
505 padding: 36rpx; 505 padding: 36rpx;
506 display: flex; 506 display: flex;
507 flex-direction: row; 507 flex-direction: row;
508 justify-content: flex-start; 508 justify-content: flex-start;
509 .imageWrap { 509 .imageWrap {
510 height: 188rpx; 510 height: 188rpx;
511 width: 188rpx; 511 width: 188rpx;
512 margin-right: 28rpx; 512 margin-right: 28rpx;
513 image { 513 image {
514 height: 188rpx; 514 height: 188rpx;
515 width: 188rpx; 515 width: 188rpx;
516 } 516 }
517 } 517 }
518 .infoRight { 518 .infoRight {
519 display: flex; 519 display: flex;
520 flex-direction: column; 520 flex-direction: column;
521 align-items: flex-start; 521 align-items: flex-start;
522 justify-content: space-between; 522 justify-content: space-between;
523 .goodName { 523 .goodName {
524 font-size: 28rpx; 524 font-size: 28rpx;
525 color: #333333; 525 color: #333333;
526 } 526 }
527 .remarks { 527 .remarks {
528 font-size: 20rpx; 528 font-size: 20rpx;
529 color: #999999; 529 color: #999999;
530 } 530 }
531 .priceBox { 531 .priceBox {
532 display: flex; 532 display: flex;
533 justify-content: space-between; 533 justify-content: space-between;
534 align-items: center; 534 align-items: center;
535 width: 100%; 535 width: 100%;
536 font-size: 14px; 536 font-size: 14px;
537 color: #999999; 537 color: #999999;
538 .price { 538 .price {
539 color: #ff6b4a; 539 color: #ff6b4a;
540 font-size: 28rpx; 540 font-size: 28rpx;
541 } 541 }
542 .counter { 542 .counter {
543 display: flex; 543 display: flex;
544 flex-direction: row; 544 flex-direction: row;
545 justify-content: space-between; 545 justify-content: space-between;
546 align-items: center; 546 align-items: center;
547 font-size: 28rpx; 547 font-size: 28rpx;
548 color: #333333; 548 color: #333333;
549 width: 122rpx; 549 width: 122rpx;
550 .btn { 550 .btn {
551 display: flex; 551 display: flex;
552 justify-content: center; 552 justify-content: center;
553 line-height: 32rpx; 553 line-height: 32rpx;
554 height: 32rpx; 554 height: 32rpx;
555 width: 32rpx; 555 width: 32rpx;
556 background-color: #f2f2f2; 556 background-color: #f2f2f2;
557 color: #cfcfcf; 557 color: #cfcfcf;
558 } 558 }
559 } 559 }
560 } 560 }
561 } 561 }
562 } 562 }
563 .goods-data { 563 .goods-data {
564 width: 100%; 564 width: 100%;
565 box-sizing: border-box; 565 box-sizing: border-box;
566 padding: 37rpx 40rpx 0 40rpx; 566 padding: 37rpx 40rpx 0 40rpx;
567 background: #ffffff; 567 background: #ffffff;
568 border-radius: 12rpx; 568 border-radius: 12rpx;
569 .opCollapse { 569 .opCollapse {
570 width: 100%; 570 width: 100%;
571 padding-bottom: 28rpx; 571 padding-bottom: 28rpx;
572 margin-top: 7px; 572 margin-top: 7px;
573 border-bottom: 1px solid #e9e9e9; 573 border-bottom: 1px solid #e9e9e9;
574 .head { 574 .head {
575 display: flex; 575 display: flex;
576 justify-content: space-between; 576 justify-content: space-between;
577 height: 24px; 577 height: 24px;
578 // font-family: PingFangSC-Medium; 578 // font-family: PingFangSC-Medium;
579 font-size: 16px; 579 font-size: 16px;
580 color: #333333; 580 color: #333333;
581 letter-spacing: -0.3px; 581 letter-spacing: -0.3px;
582 text-align: justify; 582 text-align: justify;
583 line-height: 24px; 583 line-height: 24px;
584 margin-bottom: 18rpx; 584 margin-bottom: 18rpx;
585 .headRighted { 585 .headRighted {
586 width: 0; 586 width: 0;
587 height: 0; 587 height: 0;
588 border-left: 4px solid transparent; 588 border-left: 4px solid transparent;
589 border-right: 4px solid transparent; 589 border-right: 4px solid transparent;
590 border-bottom: 4px solid #cfcfcf; 590 border-bottom: 4px solid #cfcfcf;
591 transform: scaleY(-1); 591 transform: scaleY(-1);
592 margin-top: 10px; 592 margin-top: 10px;
593 } 593 }
594 .headMid { 594 .headMid {
595 // font-family: PingFangSC-Regular; 595 // font-family: PingFangSC-Regular;
596 font-size: 10px; 596 font-size: 10px;
597 color: #999999; 597 color: #999999;
598 letter-spacing: -0.19px; 598 letter-spacing: -0.19px;
599 margin-left: -120rpx; 599 margin-left: -120rpx;
600 } 600 }
601 .headRight { 601 .headRight {
602 width: 0; 602 width: 0;
603 height: 0; 603 height: 0;
604 border-left: 4px solid transparent; 604 border-left: 4px solid transparent;
605 border-right: 4px solid transparent; 605 border-right: 4px solid transparent;
606 border-bottom: 4px solid #cfcfcf; 606 border-bottom: 4px solid #cfcfcf;
607 margin-top: 10px; 607 margin-top: 10px;
608 } 608 }
609 } 609 }
610 .body { 610 .body {
611 // font-family: PingFangSC-Regular; 611 // font-family: PingFangSC-Regular;
612 font-size: 12px; 612 font-size: 12px;
613 color: #666666; 613 color: #666666;
614 letter-spacing: 0; 614 letter-spacing: 0;
615 .bodyBox { 615 .bodyBox {
616 margin-top: 15px; 616 margin-top: 15px;
617 .names { 617 .names {
618 // font-family: PingFangSC-Regular; 618 // font-family: PingFangSC-Regular;
619 font-size: 12px; 619 font-size: 12px;
620 color: #151515; 620 color: #151515;
621 letter-spacing: 0; 621 letter-spacing: 0;
622 text-align: justify; 622 text-align: justify;
623 line-height: 17px; 623 line-height: 17px;
624 margin-left: 5px; 624 margin-left: 5px;
625 margin-right: 10px; 625 margin-right: 10px;
626 } 626 }
627 text { 627 text {
628 // font-family: PingFangSC-Regular; 628 // font-family: PingFangSC-Regular;
629 font-size: 12px; 629 font-size: 12px;
630 color: #666666; 630 color: #666666;
631 letter-spacing: 0; 631 letter-spacing: 0;
632 text-align: justify; 632 text-align: justify;
633 } 633 }
634 } 634 }
635 } 635 }
636 .goods-form { 636 .goods-form {
637 display: flex; 637 display: flex;
638 flex-direction: column; 638 flex-direction: column;
639 align-items: center; 639 align-items: center;
640 justify-content: center; 640 justify-content: center;
641 background-color: #fff; 641 background-color: #fff;
642 width: 100%; 642 width: 100%;
643 .p1 { 643 .p1 {
644 font-size: 16px; 644 font-size: 16px;
645 color: #333333; 645 color: #333333;
646 letter-spacing: -0.3px; 646 letter-spacing: -0.3px;
647 text-align: justify; 647 text-align: justify;
648 line-height: 24px; 648 line-height: 24px;
649 margin: 4px 0; 649 margin: 4px 0;
650 } 650 }
651 .p2 { 651 .p2 {
652 font-size: 12px; 652 font-size: 12px;
653 color: #999999; 653 color: #999999;
654 letter-spacing: -0.23px; 654 letter-spacing: -0.23px;
655 margin-bottom: 18rpx; 655 margin-bottom: 18rpx;
656 } 656 }
657 image { 657 image {
658 width: 28rpx; 658 width: 28rpx;
659 height: 26rpx; 659 height: 26rpx;
660 } 660 }
661 .confirm { 661 .confirm {
662 display: flex; 662 display: flex;
663 align-items: center; 663 align-items: center;
664 font-size: 12px; 664 font-size: 12px;
665 color: #666666; 665 color: #666666;
666 letter-spacing: -0.23px; 666 letter-spacing: -0.23px;
667 width: 684rpx; 667 width: 684rpx;
668 image { 668 image {
669 margin-right: 25rpx; 669 margin-right: 25rpx;
670 } 670 }
671 } 671 }
672 .picker { 672 .picker {
673 display: flex; 673 display: flex;
674 flex-direction: column; 674 flex-direction: column;
675 justify-content: center; 675 justify-content: center;
676 align-items: center; 676 align-items: center;
677 width: 100%; 677 width: 100%;
678 image { 678 image {
679 width: 10px; 679 width: 10px;
680 height: 10px; 680 height: 10px;
681 margin-right: 5px; 681 margin-right: 5px;
682 } 682 }
683 .picker-choice { 683 .picker-choice {
684 display: flex; 684 display: flex;
685 width: 684rpx; 685 width: 684rpx;
686 align-items: center; 686 align-items: center;
687 margin-bottom: 40rpx; 687 margin-bottom: 40rpx;
688 .choice-left { 688 .choice-left {
689 width: 210rpx; 689 width: 210rpx;
690 .p11 { 690 .p11 {
691 font-size: 14px; 691 font-size: 14px;
692 color: #333333; 692 color: #333333;
693 letter-spacing: -0.26px; 693 letter-spacing: -0.26px;
694 text-align: justify; 694 text-align: justify;
695 line-height: 24px; 695 line-height: 24px;
696 } 696 }
697 .p12 { 697 .p12 {
698 font-size: 10px; 698 font-size: 10px;
699 color: #3f3f3f; 699 color: #3f3f3f;
700 letter-spacing: -0.19px; 700 letter-spacing: -0.19px;
701 text-align: justify; 701 text-align: justify;
702 line-height: 24px; 702 line-height: 24px;
703 } 703 }
704 } 704 }
705 .p13 { 705 .p13 {
706 font-size: 10px; 706 font-size: 10px;
707 color: #999999; 707 color: #999999;
708 letter-spacing: -0.19px; 708 letter-spacing: -0.19px;
709 margin-right: 10px; 709 margin-right: 10px;
710 } 710 }
711 .p13-date { 711 .p13-date {
712 font-size: 10px; 712 font-size: 10px;
713 color: #999999; 713 color: #999999;
714 letter-spacing: -0.19px; 714 letter-spacing: -0.19px;
715 margin-right: 5px; 715 margin-right: 5px;
716 } 716 }
717 .p14 { 717 .p14 {
718 font-size: 14px; 718 font-size: 14px;
719 color: #666666; 719 color: #666666;
720 letter-spacing: -0.26px; 720 letter-spacing: -0.26px;
721 text-align: center; 721 text-align: center;
722 width: 124rpx; 722 width: 124rpx;
723 border-bottom: 1px solid #cfcfcf; 723 border-bottom: 1px solid #cfcfcf;
724 } 724 }
725 } 725 }
726 } 726 }
727 } 727 }
728 } 728 }
729 } 729 }
730 .choose { 730 .choose {
731 width: 100%; 731 width: 100%;
732 background: #ffffff; 732 background: #ffffff;
733 border-radius: 12rpx; 733 border-radius: 12rpx;
734 margin-top: 20rpx; 734 margin-top: 20rpx;
735 padding: 40rpx 40rpx 112rpx 40rpx; 735 padding: 40rpx 40rpx 112rpx 40rpx;
736 box-sizing: border-box; 736 box-sizing: border-box;
737 .chooseItem { 737 .chooseItem {
738 width: 100%; 738 width: 100%;
739 padding-bottom: 32rpx; 739 padding-bottom: 32rpx;
740 border-bottom: 1px solid #e9e9e9; 740 border-bottom: 1px solid #e9e9e9;
741 margin-bottom: 28rpx; 741 margin-bottom: 28rpx;
742 } 742 }
743 .chooseRes { 743 .chooseRes {
744 font-size: 12px; 744 font-size: 12px;
745 color: #666666; 745 color: #666666;
746 } 746 }
747 .itemsWrap { 747 .itemsWrap {
748 display: flex; 748 display: flex;
749 flex-direction: row; 749 flex-direction: row;
750 flex-wrap: wrap; 750 flex-wrap: wrap;
751 justify-content: flex-start; 751 justify-content: flex-start;
752 align-items: center; 752 align-items: center;
753 padding-top: 24rpx; 753 padding-top: 24rpx;
754 .item1 { 754 .item1 {
755 width: 64rpx; 755 width: 64rpx;
756 height: 64rpx; 756 height: 64rpx;
757 border-radius: 32rpx; 757 border-radius: 32rpx;
758 margin: 0 36rpx 24rpx 0; 758 margin: 0 36rpx 24rpx 0;
759 transition: all 0.3s; 759 transition: all 0.3s;
760 border: 1px solid #ffffff; 760 border: 1px solid #ffffff;
761 } 761 }
762 .item2 { 762 .item2 {
763 // width: 100rpx; 763 // width: 100rpx;
764 padding: 0 30rpx; 764 padding: 0 30rpx;
765 height: 60rpx; 765 height: 60rpx;
766 margin: 0 20rpx 20rpx 0; 766 margin: 0 20rpx 20rpx 0;
767 transition: all 0.3s; 767 transition: all 0.3s;
768 background: #f2f2f2; 768 background: #f2f2f2;
769 border-radius: 2px; 769 border-radius: 2px;
770 border-radius: 2px; 770 border-radius: 2px;
771 line-height: 60rpx; 771 line-height: 60rpx;
772 text-align: center; 772 text-align: center;
773 color: #666666; 773 color: #666666;
774 font-size: 12px; 774 font-size: 12px;
775 } 775 }
776 .active1 { 776 .active1 {
777 opacity: 0.7; 777 opacity: 0.7;
778 border: 1px solid #ff6b4a; 778 border: 1px solid #ff6b4a;
779 } 779 }
780 .active2 { 780 .active2 {
781 background: rgba(255, 107, 74, 0.15); 781 background: rgba(255, 107, 74, 0.15);
782 color: #ff6b4a; 782 color: #ff6b4a;
783 } 783 }
784 } 784 }
785 } 785 }
786 .button { 786 .button {
787 width: 100%; 787 width: 100%;
788 height: 112rpx; 788 height: 112rpx;
789 background-color: #ff6b4a; 789 background-color: #ff6b4a;
790 font-size: 16px; 790 font-size: 16px;
791 color: #ffffff; 791 color: #ffffff;
792 line-height: 112rpx; 792 line-height: 112rpx;
793 text-align: center; 793 text-align: center;
794 position: fixed; 794 position: fixed;
795 bottom: 0; 795 bottom: 0;
796 left: 0; 796 left: 0;
797 } 797 }
798 } 798 }
799 </style> 799 </style>
800 800
src/pages/user/user.vue
1 <template> 1 <template>
2 <view class="wrap"> 2 <view class="wrap">
3 <!-- 弹窗 -->
4 <uni-popup
5 ref="popup"
6 type="center"
7 >
8 <!-- 给一个左边弹窗的样式 -->
9 <!-- 关闭弹窗按钮 -->
10 <view
11 class="closeBtn"
12 @tap="this.$refs.popup.close()"
13 >x</view>
14 <view
15 class="popUpWrap"
16 v-if="whichTap==0"
17 >
18 <text>这是一款眼镜及周边产品的销售平台,我们将帮您进行建立全球销售网络,欢迎入驻。</text>
19
20 <!-- 左 -->
21 <!-- <image class="glassInfo" src="../../static/img/myOpticsData/glassInfo.png" v-if="whichTap == 0" mode="aspectFit"></image> -->
22 <!-- 右 -->
23 <!-- <image class="dataInfo" src="../../static/img/myOpticsData/dataInfo.png" v-else mode="aspectFit"></image> -->
3 <view 24 </view>
4 v-if="isAuth" 25 <view
5 class="content" 26 class="popUpWrap"
6 > 27 v-if="whichTap==1"
7 <view class="userInfo"> 28 >
8 <view class="info"> 29 <text>本平台欢迎全国各地的眼镜工厂、品牌、眼镜店加入。请联系我们申请注册账号。</text>
9 <image 30 </view>
10 :src="headerphoto" 31 <view
11 mode="aspectFill" 32 class="popUpWrap"
12 ></image> 33 v-if="whichTap==2"
13 <view class="infoText"> 34 >
14 <text class="userName">{{nickName}}</text> 35 <button @tap="chatOur(1)">客服1</button>
15 </view> 36 <button @tap="chatOur(2)">客服2</button>
16 </view> 37 </view>
17 <!-- <view class="service"> 38 </uni-popup>
18 <image src="../../static/serviceLogo.png" mode="aspectFill"></image> 39 <view
19 </view> --> 40 v-if="isAuth"
20 </view> 41 class="content"
21 <view 42 >
22 class="myOpticsData" 43 <view class="userInfo">
23 @click="toOpticsData" 44 <view class="info">
24 > 45 <image
25 <view class="left"> 46 :src="headerphoto"
26 <image 47 mode="aspectFill"
27 src="../../static/img/user/dataWrite.png" 48 ></image>
28 mode="aspectFit" 49 <view class="infoText">
29 ></image> 50 <text class="userName">{{nickName}}</text>
30 <text>验光数据</text> 51 </view>
31 </view> 52 </view>
32 <image 53 <!-- <view class="service">
33 src="../../static/right.png" 54 <image src="../../static/serviceLogo.png" mode="aspectFill"></image>
34 mode="aspectFit" 55 </view> -->
35 ></image> 56 </view>
36 </view> 57 <view
37 <view class="myOrder"> 58 class="myOpticsData"
38 <view class="orderHeader"> 59 @tap="toOpticsData"
39 <text>全部订单</text> 60 >
40 <view 61 <view class="left">
41 class="btn" 62 <image
42 @click="toMyOrder('10')" 63 src="../../static/img/user/dataWrite.png"
43 > 64 mode="aspectFit"
44 全部 65 ></image>
45 <image 66 <text>验光数据</text>
46 src="../../static/right.png" 67 </view>
47 mode="aspectFit" 68 <image
48 ></image> 69 src="../../static/right.png"
49 </view> 70 mode="aspectFit"
50 </view> 71 ></image>
51 <view class="orderBody"> 72 </view>
52 <view 73 <view class="myOrder">
53 class="item waitPay" 74 <view class="orderHeader">
54 @click="toMyOrder('0')" 75 <text>全部订单</text>
55 > 76 <view
56 <image 77 class="btn"
57 src="../../static/img/user/waitDeliver.png" 78 @click="toMyOrder('10')"
58 mode="aspectFit" 79 >
59 ></image> 80 全部
60 <text>待付款</text> 81 <image
61 </view> 82 src="../../static/right.png"
62 <view 83 mode="aspectFit"
63 class="item waitDeliver" 84 ></image>
64 @click="toMyOrder('1')" 85 </view>
65 > 86 </view>
66 <image 87 <view class="orderBody">
67 src="../../static/img/user/waitPay.png" 88 <view
68 mode="aspectFit" 89 class="item waitPay"
69 ></image> 90 @click="toMyOrder('0')"
70 <text>待收货</text> 91 >
71 </view> 92 <image
72 <view 93 src="../../static/img/user/waitDeliver.png"
73 class="item waitReceive" 94 mode="aspectFit"
74 @click="toMyOrder('2')" 95 ></image>
75 > 96 <text>待付款</text>
76 <image 97 </view>
77 src="../../static/img/user/waitReceive.png" 98 <view
78 mode="aspectFit" 99 class="item waitDeliver"
79 ></image> 100 @click="toMyOrder('1')"
80 <text>已完成</text> 101 >
81 </view> 102 <image
82 <!-- <view class="item service" @click="toMyOrder('3')"> 103 src="../../static/img/user/waitPay.png"
83 <image src="../../static/img/user/refound.png" mode="aspectFit"></image> 104 mode="aspectFit"
84 <text>已评价</text> 105 ></image>
85 </view> --> 106 <text>待收货</text>
86 </view> 107 </view>
87 </view> 108 <view
88 <view class="someItem"> 109 class="item waitReceive"
89 <!-- <view class="item"> 110 @click="toMyOrder('2')"
90 <view class="left"> 111 >
91 <image src="../../static/img/user/shouyi.png" mode="aspectFit"></image> 112 <image
92 <text>推广记录与收益</text> 113 src="../../static/img/user/waitReceive.png"
93 </view> 114 mode="aspectFit"
94 <image src="../../static/right.png" mode="aspectFit"></image> 115 ></image>
95 </view> --> 116 <text>已完成</text>
96 <view class="item"> 117 </view>
97 <view class="left"> 118 <!-- <view class="item service" @click="toMyOrder('3')">
98 <image 119 <image src="../../static/img/user/refound.png" mode="aspectFit"></image>
99 src="../../static/address-icon.png" 120 <text>已评价</text>
100 mode="aspectFit" 121 </view> -->
101 ></image> 122 </view>
102 <text @tap="toAddress">地址管理</text> 123 </view>
103 </view> 124 <view class="someItem">
104 <image 125 <!-- <view class="item">
105 src="../../static/right.png" 126 <view class="left">
106 mode="aspectFit" 127 <image src="../../static/img/user/shouyi.png" mode="aspectFit"></image>
107 ></image> 128 <text>推广记录与收益</text>
108 </view> 129 </view>
109 <view class="item"> 130 <image src="../../static/right.png" mode="aspectFit"></image>
110 <view class="left"> 131 </view> -->
111 <image 132 <view class="item">
112 src="../../static/img/user/introduce.png" 133 <view class="left">
113 mode="aspectFit" 134 <image
114 ></image> 135 src="../../static/address-icon.png"
136 mode="aspectFit"
115 <text @tap="introduce">系统介绍</text> 137 ></image>
116 </view> 138 <text @tap="toAddress">地址管理</text>
117 <image 139 </view>
118 src="../../static/right.png" 140 <image
141 src="../../static/right.png"
119 mode="aspectFit" 142 mode="aspectFit"
120 ></image> 143 ></image>
121 </view> 144 </view>
122 <view class="item"> 145 <view class="item">
123 <view class="left"> 146 <view class="left">
147 <image
124 <image 148 src="../../static/img/user/introduce.png"
125 src="../../static/img/user/joinUs.png" 149 mode="aspectFit"
126 mode="aspectFit" 150 ></image>
127 ></image> 151 <text @tap="introduce">系统介绍</text>
128 <text @tap="joinUs">加入我们</text> 152 </view>
129 </view> 153 <image
130 <image 154 src="../../static/right.png"
131 src="../../static/right.png" 155 mode="aspectFit"
132 mode="aspectFit" 156 ></image>
133 ></image> 157 </view>
134 </view> 158 <view class="item">
135 <view class="item"> 159 <view class="left">
136 <view class="left"> 160 <image
137 <image 161 src="../../static/img/user/joinUs.png"
138 src="../../static/img/user/service.png" 162 mode="aspectFit"
139 mode="aspectFit" 163 ></image>
140 ></image> 164 <text @tap="joinUs">加入我们</text>
141 <text>联系客服</text> 165 </view>
142 </view> 166 <image
143 <image 167 src="../../static/right.png"
144 src="../../static/right.png" 168 mode="aspectFit"
145 mode="aspectFit" 169 ></image>
146 ></image> 170 </view>
147 </view> 171 <view class="item">
148 </view> 172 <view class="left">
149 <view class="recommend"> 173 <image
150 <view class="title"> 174 src="../../static/img/user/service.png"
151 <view class="line"></view> 175 mode="aspectFit"
152 <view class="text">精选推荐</view> 176 ></image>
153 <view class="line"></view> 177 <text>联系客服</text>
154 </view> 178 </view>
155 <!-- 商品列表 --> 179 <image
156 <view class="goods-list"> 180 src="../../static/right.png"
157 <scroll-view 181 mode="aspectFit"
158 enable-flex 182 ></image>
159 @scrolltolower="handleScrolltolower" 183 </view>
160 scroll-y 184 </view>
161 class="product-list" 185 <view class="recommend">
162 > 186 <view class="title">
163 <view 187 <view class="line"></view>
164 class="product" 188 <view class="text">精选推荐</view>
165 v-for="(item, index) in userRecommandList" 189 <view class="line"></view>
190 </view>
191 <!-- 商品列表 -->
192 <view class="goods-list">
193 <scroll-view
194 enable-flex
195 @scrolltolower="handleScrolltolower"
196 scroll-y
197 class="product-list"
198 >
199 <view
200 class="product"
201 v-for="(item, index) in userRecommandList"
202 :key="index"
203 >
204 <Card :goods="item"></Card>
205 </view>
166 :key="index" 206 </scroll-view>
167 > 207 <view class="loading-text">{{loadingText}}</view>
168 <Card :goods="item"></Card> 208 </view>
169 </view> 209 </view>
170 </scroll-view> 210 </view>
171 <view class="loading-text">{{loadingText}}</view> 211 <view
172 </view> 212 v-else
173 </view> 213 class="auth"
174 </view> 214 >
175 <view 215 <view class="icon"></view>
176 v-else 216 <view class="divider"></view>
177 class="auth" 217 <view class="title">申请获取以下权限</view>
178 > 218 <view class="text">获得您的公开信息(昵称、头像等)</view>
179 <view class="icon"></view> 219 <button
180 <view class="divider"></view> 220 type="primary"
181 <view class="title">申请获取以下权限</view> 221 open-type="getUserInfo"
182 <view class="text">获得您的公开信息(昵称、头像等)</view> 222 @getuserinfo="onGotUserInfo"
183 <button 223 >授权登陆</button>
184 type="primary" 224 </view>
185 open-type="getUserInfo" 225 </view>
186 @getuserinfo="onGotUserInfo" 226 </template>
187 >授权登陆</button> 227
188 </view> 228 <script>
189 </view> 229 import Card from '@/components/CommodityCard/CommodityCard.vue'
190 </template> 230 import store from '@/store'
191 231 import UniPopup from '@/components/UniPopup/uni-popup.vue'
192 <script> 232
193 import Card from '@/components/CommodityCard/CommodityCard.vue' 233 export default {
194 import store from '@/store' 234 components: {
195 235 Card,
196 export default { 236 UniPopup
197 components: { 237 },
198 Card: Card 238 data() {
199 }, 239 return {
200 data() { 240 isAuth: true, // 是否显示授权页面,
201 return { 241 pagesnum: 1, // 分页请求初始值
202 isAuth: true, // 是否显示授权页面, 242 whichTap: 0 // 弹窗渲染选择条件
203 pagesnum: 1 // 分页请求初始值 243 }
204 } 244 },
205 }, 245 onLoad() {
206 onLoad() { 246 // 判断是否授权
207 // 判断是否授权 247 uni.getSetting({
208 uni.getSetting({ 248 success(res) {
209 success(res) { 249 console.log('authSetting', res.authSetting)
210 console.log('authSetting', res.authSetting) 250 if (res.authSetting['scope.userInfo'] === true) {
211 if (res.authSetting['scope.userInfo'] === true) { 251 this.isAuth = true
212 this.isAuth = true 252 } else {
213 } else { 253 this.isAuth = false
214 this.isAuth = false 254 }
215 } 255 }
216 } 256 })
217 }) 257 store.dispatch('userRecommand/getRecommandList', {
218 store.dispatch('userRecommand/getRecommandList', { 258 uid: this.$store.state.user.userInfo.uid,
219 uid: this.$store.state.user.userInfo.uid, 259 openid: this.$store.state.user.userInfo.openid,
220 openid: this.$store.state.user.userInfo.openid, 260 page: this.pagesnum
221 page: this.pagesnum 261 })
222 }) 262 },
223 }, 263 computed: {
224 computed: { 264 nickName() {
225 nickName() { 265 return this.$store.state.user.userInfo.nickName
226 return this.$store.state.user.userInfo.nickName 266 },
227 }, 267 headerphoto() {
228 headerphoto() { 268 return this.$store.state.user.userInfo.headerphoto
229 return this.$store.state.user.userInfo.headerphoto 269 },
230 }, 270 userRecommandList() {
231 userRecommandList() { 271 return this.$store.state.userRecommand.recommandList
232 return this.$store.state.userRecommand.recommandList 272 }
233 } 273 },
234 }, 274 methods: {
235 methods: { 275 // 弹窗
236 // 授权 276 changeTap(item) {
237 onGotUserInfo(e) { 277 this.whichTap = item
238 if (e.detail.errMsg === 'getUserInfo:ok') { 278 this.$refs.popup.open()
239 const { fromInfo } = this.$store.state.user 279 },
240 // 用户授权成功 280 chatOur(item) {
241 store.dispatch('user/getUserInfo', fromInfo) 281 if (item === 1) {
242 this.isAuth = true 282 uni.makePhoneCall({
243 } 283 phoneNumber: 13376189297 // 客服1 电话
244 }, 284 })
245 toAddress() { 285 } else {
246 uni.navigateTo({ 286 uni.makePhoneCall({
247 url: '../address/addressList', 287 phoneNumber: 18014995101 // 客服2 电话
248 success: res => {}, 288 })
249 fail: () => {}, 289 }
250 complete: () => {} 290 },
251 }) 291 // 授权
252 }, 292 onGotUserInfo(e) {
253 introduce() { 293 if (e.detail.errMsg === 'getUserInfo:ok') {
254 uni.showModal({ 294 const { fromInfo } = this.$store.state.user
255 content: '这是一款眼镜及周边产品的销售平台,我们将帮您进行建立全球销售网络,欢迎入住。', 295 // 用户授权成功
256 showCancel: false 296 store.dispatch('user/getUserInfo', fromInfo)
257 }) 297 this.isAuth = true
258 }, 298 }
259 joinUs() { 299 },
260 uni.showModal({ 300 toAddress() {
261 content: '本平台欢迎全国各地的眼镜工厂、品牌、眼镜店加入。请联系我们申请注册账号', 301 uni.navigateTo({
262 showCancel: false 302 url: '../address/addressList',
263 }) 303 success: res => {},
264 }, 304 fail: () => {},
265 toMyOrder(status) { 305 complete: () => {}
266 uni.navigateTo({ 306 })
267 url: `../myOrder/myOrder?status=${status}`, 307 },
268 success: res => {}, 308 introduce() {
269 fail: () => {}, 309 uni.showModal({
270 complete: () => {} 310 content: '这是一款眼镜及周边产品的销售平台,我们将帮您进行建立全球销售网络,欢迎入住。',
271 }) 311 showCancel: false
272 }, 312 })
273 toOpticsData() { 313 },
274 uni.navigateTo({ 314 joinUs() {
275 url: '../addOpticsData/addOpticsData' 315 uni.showModal({
276 }) 316 content: '本平台欢迎全国各地的眼镜工厂、品牌、眼镜店加入。请联系我们申请注册账号',
277 }, 317 showCancel: false
278 handleScrolltolower() { 318 })
279 // console.log('usr-my',this.$store.state.user.userInfo) 319 },
280 this.pagesnum++ 320 toMyOrder(status) {
281 store.dispatch('userRecommand/getRecommandList', { 321 uni.navigateTo({
282 uid: this.$store.state.user.userInfo.uid, 322 url: `../myOrder/myOrder?status=${status}`,
283 openid: this.$store.state.user.userInfo.openid, 323 success: res => {},
284 page: this.pagesnum 324 fail: () => {},
285 }) 325 complete: () => {}
286 } 326 })
287 } 327 },
288 } 328 toOpticsData() {
289 </script> 329 uni.navigateTo({
290 330 url: '../addOpticsData/addOpticsData'
291 <style lang="scss"> 331 })
292 .warp { 332 },
293 font-size: 24rpx; 333 handleScrolltolower() {
294 background-color: #f2f2f2; 334 // console.log('usr-my',this.$store.state.user.userInfo)
295 height: 100vh; 335 this.pagesnum++
296 } 336 store.dispatch('userRecommand/getRecommandList', {
297 .content { 337 uid: this.$store.state.user.userInfo.uid,
298 display: flex; 338 openid: this.$store.state.user.userInfo.openid,
299 flex-direction: column; 339 page: this.pagesnum
300 align-items: center; 340 })
301 justify-content: center; 341 }
302 background-color: #f2f2f2; 342 }
303 } 343 }
304 .userInfo { 344 </script>
305 background-image: linear-gradient(270deg, #ffa481 0%, #ff6b4a 66%); 345
306 width: 100%; 346 <style lang="scss">
307 height: 240rpx; 347 .warp {
308 color: #ffffff; 348 font-size: 24rpx;
309 padding: 60rpx 82rpx 80rpx 44rpx; 349 background-color: #f2f2f2;
310 box-sizing: border-box; 350 height: 100vh;
311 display: flex; 351 }
312 flex-direction: row; 352 .content {
313 justify-content: space-between; 353 display: flex;
314 align-items: flex-start; 354 flex-direction: column;
315 .info { 355 align-items: center;
316 display: flex; 356 justify-content: center;
317 flex-direction: row; 357 background-color: #f2f2f2;
318 justify-content: space-between; 358 }
319 align-items: center; 359 .userInfo {
320 image { 360 background-image: linear-gradient(270deg, #ffa481 0%, #ff6b4a 66%);
321 border-radius: 50rpx; 361 width: 100%;
322 height: 100rpx; 362 height: 240rpx;
323 width: 100rpx; 363 color: #ffffff;
324 margin-right: 40rpx; 364 padding: 60rpx 82rpx 80rpx 44rpx;
325 } 365 box-sizing: border-box;
326 .infoText { 366 display: flex;
327 display: flex; 367 flex-direction: row;
328 flex-direction: column; 368 justify-content: space-between;
329 justify-content: space-between; 369 align-items: flex-start;
330 align-items: flex-scetart; 370 .info {
331 .userName { 371 display: flex;
332 font-size: 18px; 372 flex-direction: row;
333 color: #ffffff; 373 justify-content: space-between;
334 margin-bottom: 8rpx; 374 align-items: center;
335 } 375 image {
336 .nickName { 376 border-radius: 50rpx;
337 font-size: 12px; 377 height: 100rpx;
338 color: #ffffff; 378 width: 100rpx;
339 } 379 margin-right: 40rpx;
340 } 380 }
341 } 381 .infoText {
342 // .service { 382 display: flex;
343 // margin-top: 20rpx; 383 flex-direction: column;
344 // image { 384 justify-content: space-between;
345 // height: 36rpx; 385 align-items: flex-scetart;
346 // width: 36rpx; 386 .userName {
347 // } 387 font-size: 18px;
348 // } 388 color: #ffffff;
349 } 389 margin-bottom: 8rpx;
350 .myOpticsData { 390 }
351 width: 670rpx; 391 .nickName {
352 height: 120rpx; 392 font-size: 12px;
353 background-color: #ffffff; 393 color: #ffffff;
354 border-radius: 6px; 394 }
355 box-shadow: 1px 1px 7px 0 rgba(133, 107, 107, 0.1); 395 }
356 position: relative; 396 }
357 bottom: 44rpx; 397 // .service {
358 padding: 40rpx; 398 // margin-top: 20rpx;
359 box-sizing: border-box; 399 // image {
360 display: flex; 400 // height: 36rpx;
361 justify-content: space-between; 401 // width: 36rpx;
362 align-items: center; 402 // }
363 .left { 403 // }
364 font-size: 14px; 404 }
365 color: #333333; 405 .myOpticsData {
366 display: flex; 406 width: 670rpx;
367 align-items: center; 407 height: 120rpx;
368 image { 408 background-color: #ffffff;
369 margin-right: 32rpx; 409 border-radius: 6px;
370 width: 30rpx; 410 box-shadow: 1px 1px 7px 0 rgba(133, 107, 107, 0.1);
371 height: 34rpx; 411 position: relative;
372 } 412 bottom: 44rpx;
373 } 413 padding: 40rpx;
374 image { 414 box-sizing: border-box;
375 height: 16px; 415 display: flex;
376 width: 8px; 416 justify-content: space-between;
377 } 417 align-items: center;
378 } 418 .left {
379 .myOrder { 419 font-size: 14px;
380 width: 100%; 420 color: #333333;
381 height: 296rpx; 421 display: flex;
382 // margin-top: 116rpx; 422 align-items: center;
383 margin-bottom: 20rpx; 423 image {
384 padding: 0 40rpx; 424 margin-right: 32rpx;
385 box-sizing: border-box; 425 width: 30rpx;
386 background: #ffffff; 426 height: 34rpx;
387 box-shadow: 0 0 4px 0 rgba(133, 107, 107, 0.1); 427 }
388 border-radius: 6px; 428 }
389 border-radius: 6px; 429 image {
390 display: flex; 430 height: 16px;
391 flex-direction: column; 431 width: 8px;
392 justify-content: space-around; 432 }
393 align-items: center; 433 }
394 .orderHeader { 434 .myOrder {
395 width: 100%; 435 width: 100%;
396 height: 100rpx; 436 height: 296rpx;
397 display: flex; 437 // margin-top: 116rpx;
398 flex-direction: row; 438 margin-bottom: 20rpx;
399 justify-content: space-between; 439 padding: 0 40rpx;
400 align-items: center; 440 box-sizing: border-box;
401 border-bottom: 1px solid #e9e9e9; 441 background: #ffffff;
402 font-weight: bold; 442 box-shadow: 0 0 4px 0 rgba(133, 107, 107, 0.1);
403 font-size: 18px; 443 border-radius: 6px;
404 color: #333333; 444 border-radius: 6px;
405 .btn { 445 display: flex;
406 font-size: 12px; 446 flex-direction: column;
407 color: #999999; 447 justify-content: space-around;
408 display: flex; 448 align-items: center;
409 align-items: center; 449 .orderHeader {
410 image { 450 width: 100%;
411 margin-left: 20rpx; 451 height: 100rpx;
412 height: 32rpx; 452 display: flex;
413 width: 16rpx; 453 flex-direction: row;
414 } 454 justify-content: space-between;
415 } 455 align-items: center;
416 } 456 border-bottom: 1px solid #e9e9e9;
417 .orderBody { 457 font-weight: bold;
418 width: 100%; 458 font-size: 18px;
419 display: flex; 459 color: #333333;
420 flex-direction: row; 460 .btn {
421 justify-content: space-around; 461 font-size: 12px;
422 align-items: center; 462 color: #999999;
423 .item { 463 display: flex;
424 display: flex; 464 align-items: center;
425 flex-direction: column; 465 image {
426 align-items: center; 466 margin-left: 20rpx;
427 image { 467 height: 32rpx;
428 width: 62rpx; 468 width: 16rpx;
429 height: 46rpx; 469 }
430 } 470 }
431 text { 471 }
432 margin-top: 24rpx; 472 .orderBody {
433 font-size: 12px; 473 width: 100%;
434 color: #333333; 474 display: flex;
435 } 475 flex-direction: row;
436 } 476 justify-content: space-around;
437 } 477 align-items: center;
438 } 478 .item {
439 .someItem { 479 display: flex;
440 width: 100%; 480 flex-direction: column;
441 height: 336rpx; 481 align-items: center;
442 background: #ffffff; 482 image {
443 box-shadow: 0 0 4px 0 rgba(133, 107, 107, 0.1); 483 width: 62rpx;
444 border-radius: 6px; 484 height: 46rpx;
445 border-radius: 6px; 485 }
446 margin-bottom: 18rpx; 486 text {
447 box-sizing: border-box; 487 margin-top: 24rpx;
448 padding: 21rpx 48rpx 21rpx 42rpx; 488 font-size: 12px;
449 box-sizing: border-box; 489 color: #333333;
450 display: flex; 490 }
451 flex-direction: column; 491 }
452 justify-content: space-between; 492 }
453 align-items: center; 493 }
454 .item { 494 .someItem {
455 display: flex; 495 width: 100%;
456 justify-content: space-between; 496 height: 336rpx;
457 border-bottom: 1px solid #f2f2f2; 497 background: #ffffff;
458 align-items: center; 498 box-shadow: 0 0 4px 0 rgba(133, 107, 107, 0.1);
459 height: 72rpx; 499 border-radius: 6px;
460 width: 100%; 500 border-radius: 6px;
461 .left { 501 margin-bottom: 18rpx;
462 font-size: 14px; 502 box-sizing: border-box;
463 color: #333333; 503 padding: 21rpx 48rpx 21rpx 42rpx;
464 display: flex; 504 box-sizing: border-box;
465 align-items: center; 505 display: flex;
466 image { 506 flex-direction: column;
467 margin-right: 32rpx; 507 justify-content: space-between;
468 width: 30rpx; 508 align-items: center;
469 height: 34rpx; 509 .item {
470 } 510 display: flex;
471 } 511 justify-content: space-between;
472 image { 512 border-bottom: 1px solid #f2f2f2;
473 height: 16px; 513 align-items: center;
474 width: 8px; 514 height: 72rpx;
475 } 515 width: 100%;
476 } 516 .left {
477 } 517 font-size: 14px;
478 .recommend { 518 color: #333333;
479 background: #ffffff; 519 display: flex;
520 align-items: center;
521 image {
522 margin-right: 32rpx;
523 width: 30rpx;
524 height: 34rpx;
525 }
526 }
527 image {
528 height: 16px;
529 width: 8px;
530 }
531 }
532 }
533 .recommend {
534 background: #ffffff;
535 box-shadow: 0 0 4px 0 rgba(133, 107, 107, 0.1);
536 border-radius: 6px;
537 border-radius: 6px;
538 width: 100%;
539 .title {
540 display: flex;
541 flex-direction: row;
542 align-items: center;
543 justify-content: space-between;
544 padding: 20rpx 40rpx;
545 .line {
546 width: 264rpx;
547 height: 1rpx;
548 border-bottom: 1px solid #eaeaea;
549 }
550 .text {
551 font-family: PingFangSC-Medium;
552 font-size: 14px;
553 color: #333333;
554 letter-spacing: -0.26px;
480 box-shadow: 0 0 4px 0 rgba(133, 107, 107, 0.1); 555 text-align: justify;
481 border-radius: 6px; 556 line-height: 24px;
482 border-radius: 6px; 557 }
483 width: 100%; 558 }
484 .title { 559 .goods-list {
485 display: flex; 560 .loading-text {
486 flex-direction: row; 561 width: 100%;
487 align-items: center; 562 display: flex;
488 justify-content: space-between; 563 justify-content: center;
489 padding: 20rpx 40rpx; 564 align-items: center;
490 .line { 565 height: 30px;
491 width: 264rpx; 566 color: #979797;
492 height: 1rpx; 567 font-size: 12px;
493 border-bottom: 1px solid #eaeaea; 568 }
494 } 569 .product-list {
495 .text { 570 width: 92%;
496 font-family: PingFangSC-Medium; 571 padding: 0 4% 3vw 4%;
497 font-size: 14px; 572 display: flex;
498 color: #333333; 573 justify-content: space-between;
499 letter-spacing: -0.26px; 574 flex-wrap: wrap;
500 text-align: justify; 575 .product {
501 line-height: 24px; 576 width: 48%;
502 } 577 margin: 0 0 20rpx 0;
503 } 578 background: #ffffff;
504 .goods-list { 579 border: 1px solid #f2f2f2;
505 .loading-text { 580 }
506 width: 100%; 581 }
507 display: flex; 582 }
508 justify-content: center; 583 }
509 align-items: center; 584 .auth {
510 height: 30px; 585 height: 100vh;
511 color: #979797; 586 display: flex;
512 font-size: 12px; 587 flex-direction: column;
513 } 588 align-items: center;
514 .product-list { 589 .icon {
515 width: 92%; 590 width: 140rpx;
516 padding: 0 4% 3vw 4%; 591 height: 140rpx;
517 display: flex; 592 border-radius: 50%;
518 justify-content: space-between; 593 margin-top: 100rpx;
519 flex-wrap: wrap; 594 background-color: grey;
520 .product { 595 }
521 width: 48%; 596 .divider {
522 margin: 0 0 20rpx 0; 597 height: 1rpx;
523 background: #ffffff; 598 width: 600rpx;
524 border: 1px solid #f2f2f2; 599 margin-top: 80rpx;
525 } 600 background-color: #e6e3e3;
526 } 601 }
527 } 602 .title {
528 } 603 width: 600rpx;
529 .auth { 604 margin-top: 50rpx;
530 height: 100vh; 605 text-align: left;
531 display: flex; 606 }
532 flex-direction: column; 607 .text {
533 align-items: center; 608 width: 600rpx;
534 .icon { 609 margin-top: 30rpx;
535 width: 140rpx; 610 text-align: left;
536 height: 140rpx; 611 color: #e6e3e3;
537 border-radius: 50%; 612 }
538 margin-top: 100rpx; 613 button {
539 background-color: grey; 614 width: 450rpx;
540 } 615 height: 80rpx;
541 .divider { 616 line-height: 80rpx;
542 height: 1rpx; 617 margin-top: 80rpx;
543 width: 600rpx; 618 border-radius: 30rpx;
544 margin-top: 80rpx; 619 }
545 background-color: #e6e3e3; 620 }
546 } 621 .closeBtn {
547 .title { 622 height: 28rpx;
548 width: 600rpx; 623 width: 28rpx;
549 margin-top: 50rpx; 624 // border: 1px solid red;
550 text-align: left; 625 position: absolute;
551 } 626 top: 20rpx;
552 .text { 627 right: 10rpx;
553 width: 600rpx; 628 }
554 margin-top: 30rpx; 629 </style>
555 text-align: left; 630
src/static/img/detail/right.png

475 Bytes

src/static/img/detail/xiala.png

438 Bytes | W: | H:

470 Bytes | W: | H:

  • 2-up
  • Swipe
  • Onion skin
src/store/modules/myLoveList.js
1 import urlAlias from '../url'; 1 import urlAlias from '../url';
2 import request from '../request'; 2 import request from '../request';
3 3
4 const { 4 const {
5 mylovelist 5 mylovelist,
6 myloveadd,
7 myloveupdate
6 } = urlAlias; 8 } = urlAlias;
7 9
8 const state = { 10 const state = {
9 loveList: [], 11 loveList: [],
10 }; 12 };
11 13
12 const mutations = { 14 const mutations = {
13 INIT: (state, data) => { 15 INIT: (state, data) => {
14 state.loveList = data; 16 state.loveList = data;
15 }, 17 },
18 // 更新关心人验光单
19 UPDATE:(state, data) => {
20 // state.loveList.push(data)
21 // console.log('UPDATA=====>',data)
22 }
16 }; 23 };
17 24
18 const actions = { 25 const actions = {
19 getLoveList({ commit }, param) { 26 getLoveList({ commit }, param) {
20 request({ 27 request({
21 url: mylovelist, 28 url: mylovelist,
22 data: param, 29 data: param,
23 success: (res) => { 30 success: (res) => {
24 // console.log(res.data); 31 // console.log(res.data);
25 commit("INIT", res.data.data); 32 commit("INIT", res.data.data);
26 }, 33 },
27 }) 34 })
28 } 35 },
36 addMylove({ commit }, param) {
37
38 console.log('myloveupdate-parm====>',param)
39 request({
40 url: myloveadd,
41 data: param,
42 success: (res) => {
43 console.log('addMylove-parm====>',param)
44 console.log(res.data);
45 // commit("ADD", args);
46 },
47 })
48 },
49 updateMylove({ commit }, param) {
50 request({
51 url: myloveupdate,
52 data: param,
53 success: (res) => {
54 console.log('myloveupdate-parm====>',param)
55 console.log(res);
56 // commit("UPDATE", param);
57 },
58 })
59 },
60
29 } 61 }
30 62
31 export default { 63 export default {
32 namespaced: true, 64 namespaced: true,
33 state, 65 state,
34 mutations, 66 mutations,
35 actions, 67 actions,
36 } 68 }
1 const urlAlias = { 1 const urlAlias = {
2 // 详情 2 // 详情
3 read: '/app/prod/read', // 获取商品信息 3 read: '/app/prod/read', // 获取商品信息
4 4
5 // 首页 5 // 首页
6 shopList: '/app/prod/list', // 获取首页商品列表 6 shopList: '/app/prod/list', // 获取首页商品列表
7 category: '/app/prod/category2', // 获取首页商品分类 7 category: '/app/prod/category2', // 获取首页商品分类
8 search: '/app/prod/search', // 首页搜索商品 8 search: '/app/prod/search', // 首页搜索商品
9 9
10 // 登陆 10 // 登陆
11 login: '/app/glass/getOpenId', // 登陆 11 login: '/app/glass/getOpenId', // 登陆
12 getUserInfo: '/app/glass/userinfo', // 获取用户信息 12 getUserInfo: '/app/glass/userinfo', // 获取用户信息
13 13
14 // 我的订单 14 // 我的订单
15 orderList: '/app/order/list', // 获取订单列表 15 orderList: '/app/order/list', // 获取订单列表
16 myOrderList: '/app/order/list3', // 获取订单列表 16 myOrderList: '/app/order/list3', // 获取订单列表
17 orderRead: '/app/order/read', // 获取订单详情 17 orderRead: '/app/order/read', // 获取订单详情
18 cancelOrder: '/app/order/wait/del', // 取消订单 18 cancelOrder: '/app/order/wait/del', // 取消订单
19 statusConfirm: '/app/order/statusConfirm', // 订单操作 19 statusConfirm: '/app/order/statusConfirm', // 订单操作
20 payLog: '/app/pay/log', // 调起支付 20 payLog: '/app/pay/log', // 调起支付
21 orderBuild: '/app/order/build', // 生成订单 21 orderBuild: '/app/order/build', // 生成订单
22 22
23 // 购物车 23 // 购物车
24 cartList: '/app/cart/list', // 获取购物车列表 24 cartList: '/app/cart/list', // 获取购物车列表
25 cartModi: '/app/cart/modi', // 修改购物车 25 cartModi: '/app/cart/modi', // 修改购物车
26 cartDel: '/app/cart/del', // 删除购物车 26 cartDel: '/app/cart/del', // 删除购物车
27 cartAdd: '/app/cart/add', // 添加购物车 27 cartAdd: '/app/cart/add', // 添加购物车
28 28
29 // 我的 29 // 我的
30 recommandList: '/app/prod/recommand', // 获取用户个性化推荐商品 30 recommandList: '/app/prod/recommand', // 获取用户个性化推荐商品
31 31
32 // 镜框选购页 32 // 镜框选购页
33 detailStandardList: '/app/prod/read', // 获取商品的详细信息 33 detailStandardList: '/app/prod/read', // 获取商品的详细信息
34 // 选购页 34 // 选购页
35 detailStandardUrl: '/app/prod/read', // 获取商品的详细信息 35 detailStandardUrl: '/app/prod/read', // 获取商品的详细信息
36 36
37 // 地址管理 37 // 地址管理
38 editAddress: '/app/address/edit_address', // 编辑地址 38 editAddress: '/app/address/edit_address', // 编辑地址
39 addressList: '/app/address/get_address_list', // 获取用户地址列表 39 addressList: '/app/address/get_address_list', // 获取用户地址列表
40 getAddress: '/app/address/get_address_by_id', // 获取用户某一地址信息 40 getAddress: '/app/address/get_address_by_id', // 获取用户某一地址信息
41 getDefaultAddress: '/app/address/get_default_address', // 获取用户默认地址信息 41 getDefaultAddress: '/app/address/get_default_address', // 获取用户默认地址信息
42 42
43 // 用户数据 43 // 用户数据
44 mylovelist: '/app/user/mylovelist', // 关心的人的数据
44 mylovelist: '/app/user/mylovelist', // 关心的人的数据 45 myloveadd: '/app/user/myloveadd', // 添加关心的人
45 myloveadd: '/app/user/myloveadd' // 添加关心的人 46 myloveupdate: '/app/user/myloveupdate' // 更新关心人的数据
46 } 47 }
47 48
48 export default urlAlias 49 export default urlAlias
49 50