刘文博 / gulu-vue

Blame view

src/pages/addOpticsData/addOpticsData.vue 6.18 KB
edit raw normal view history
156736a2e   尹聃   样式修改 
1
 
  <template>
863d3aa95   BigBoss   新增验光数据页面 
2
 
  	<view class="wrap">
e477b7dc7   BigBoss   修改冲突 
3
 
  		<!-- 弹窗 -->
863d3aa95   BigBoss   新增验光数据页面 
4
 
  		<uni-popup ref="popup" type="center">
e477b7dc7   BigBoss   修改冲突 
5
 
  			<!-- 给一个左边弹窗的样式 -->
863d3aa95   BigBoss   新增验光数据页面 
6
7
8
 
  			<view class="popUpWrap" :class="{'popUpWrap1': whichTap == 0}">
  				<!-- 关闭弹窗按钮 -->
  				<view class="closeBtn" @click="this.$refs.popup.close()"></view>
e477b7dc7   BigBoss   修改冲突 
9
 
  				<!-- 左 -->
863d3aa95   BigBoss   新增验光数据页面 
10
 
  				<image class="glassInfo" src="../../static/img/myOpticsData/glassInfo.png" v-if="whichTap == 0" mode="aspectFit"></image>
e477b7dc7   BigBoss   修改冲突 
11
 
  				<!-- 右 -->
863d3aa95   BigBoss   新增验光数据页面 
12
13
 
  				<image class="dataInfo" src="../../static/img/myOpticsData/dataInfo.png" v-else mode="aspectFit"></image>
  			</view>
e477b7dc7   BigBoss   修改冲突 
14
 
  		</uni-popup>
156736a2e   尹聃   样式修改 
15
 
  		<!-- 点击弹窗部分 -->
5b513503f   BigBoss   验光数据页面 
16
 
  		<view class="header">
156736a2e   尹聃   样式修改 
17
 
  			<view class="headerLeft" @click=changeTap(1)>
5b513503f   BigBoss   验光数据页面 
18
19
20
 
  				<text>如何查看验光单？</text>
  				<image src="../../static/dataLook.png" mode="aspectFit"></image>
  			</view>
156736a2e   尹聃   样式修改 
21
 
  			<view class="headerRight" @click=changeTap(0)>
5b513503f   BigBoss   验光数据页面 
22
23
24
25
 
  				<text>如何查看眼镜框架？</text>
  				<image src="../../static/glassLook.png" mode="aspectFit"></image>
  			</view>
  		</view>
e477b7dc7   BigBoss   修改冲突 
26
 
  		<!-- 数据展示部分 -->
5b513503f   BigBoss   验光数据页面 
27
28
 
  		<view class="dataMenu">
  			<uni-collapse accordion="true">
31dea37da   喻鹏   新增验光单和修改验光单 
29
 
  				<view class="item" v-for="(loveItem,index) in loveList" :key="index" >
5b513503f   BigBoss   验光数据页面 
30
 
  					<uni-collapse-item :title='loveItem.name' :time='getRightTime(loveItem.in_time)' :iconText='getFirstName(loveItem.name)' showAnimation='true'>
31dea37da   喻鹏   新增验光单和修改验光单 
31
 
  					    <view class="loveDataInfo" @click="toNewData(2,index)">
5b513503f   BigBoss   验光数据页面 
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
 
  							<view class="dataInfoItem">
  								<text>度数（SPH）：</text><text>左：{{loveItem.leftSph}}</text><text>右：{{loveItem.rightSph}}</text>
  							</view>
  							<view class="dataInfoItem">
  								<text>散光（CYL）：</text><text>左：{{loveItem.leftCyl}}</text><text>右：{{loveItem.rightCyl}}</text>
  							</view>
  							<view class="dataInfoItem">
  								<text>轴位（AXI）：</text><text>左：{{loveItem.leftAxi}}</text><text>右：{{loveItem.rightAxi}}</text>
  							</view>
  							<view class="dataInfoItem">
  								<text>瞳距（PD）：</text><text>{{loveItem.pd}}</text>
  							</view>
  					    </view>
  					</uni-collapse-item>
  				</view>
  			</uni-collapse>
  		</view>
  		<view class="footer">
31dea37da   喻鹏   新增验光单和修改验光单 
50
 
  			<button class="btn" type="default" @click="toNewData(1)">新建验光单</button>
156736a2e   尹聃   样式修改 
51
52
53
54
 
  		</view>
  	</view>
  </template>
5b513503f   BigBoss   验光数据页面 
55
56
57
 
  <script>
  	import UniCollapse from '@/components/UniCollapse/UniCollapse.vue'
  	import UniCollapseItem from '@/components/UniCollapseItem/UniCollapseItem.vue'
863d3aa95   BigBoss   新增验光数据页面 
58
 
  	import UniPopup from '@/components/UniPopup/uni-popup.vue'
5b513503f   BigBoss   验光数据页面 
59
60
 
  	import store from '@/store';
  	export default {
156736a2e   尹聃   样式修改 
61
62
63
64
65
 
  		components: {UniCollapse,UniCollapseItem,UniPopup},
  		data() {
  			return {
  				whichTap:0
  			};
5b513503f   BigBoss   验光数据页面 
66
67
68
69
 
  		},
  		onLoad: function(option) {
  			//获取关心的人列表
  			store.dispatch('myLoveList/getLoveList', {
31dea37da   喻鹏   新增验光单和修改验光单 
70
 
  				uid: this.$store.state.user.userInfo.uid,
5b513503f   BigBoss   验光数据页面 
71
72
73
74
75
76
77
78
79
 
  			}); 
  		},
  		computed:{
  			loveList() {
  				console.log(this.$store.state.myLoveList.loveList)
  				return this.$store.state.myLoveList.loveList || []
  			},
  		},
  		methods:{
863d3aa95   BigBoss   新增验光数据页面 
80
81
82
 
  			changeTap(item){
  				this.whichTap = item
  				this.$refs.popup.open()
5b513503f   BigBoss   验光数据页面 
83
84
85
86
 
  			},
  			//给时间搞一个nice的格式
  			getRightTime(time){
  				//如果小于10 则返回'0'+m
863d3aa95   BigBoss   新增验光数据页面 
87
88
89
90
91
92
93
94
 
  				// function add(m){return m<10?'0'+m:m}
  				//传给我的带有时分秒，想去除一下，但是完事IOS显示NaN，暂时不用吧
  				// const oldTime = (new Date(time)).getTime()
  				// const year = new Date(oldTime).getFullYear()
  				// const month = new Date(oldTime).getMonth()+1
  				// const day = new Date(oldTime).getDate()
  				// const newTime = add(year)+'-'+add(month)+'-'+add(day)
d1ce60f3d   BigBoss   合并冲突 
95
 
  				// console.log(newTime)
863d3aa95   BigBoss   新增验光数据页面 
96
97
 
  				// return newTime.replace(/-/g, '/')
  				return time
5b513503f   BigBoss   验光数据页面 
98
99
 
  			},
  			getFirstName(name){
5b513503f   BigBoss   验光数据页面 
100
 
  				return name.substring(0,1)
863d3aa95   BigBoss   新增验光数据页面 
101
 
  			},
31dea37da   喻鹏   新增验光单和修改验光单 
102
103
104
105
106
107
108
109
110
111
112
 
  			toNewData(item,index){
  				// const args={
  				// 	name:loveItem.name,
  				// 	pd:loveItem.pd,
  				// 	leftSph:loveItem.leftSph,
  				// 	rightSph:loveItem.rightSph,
  				// 	leftCyl:loveItem.leftCyl,
  				// 	rightCyl:loveItem.rightCyl,
  				// 	leftAxi:loveItem.leftAxi,
  				// 	rightAxi:loveItem.rightAxi
  				// }
863d3aa95   BigBoss   新增验光数据页面 
113
 
  				uni.navigateTo({
31dea37da   喻鹏   新增验光单和修改验光单 
114
115
116
 
  					// kinds 参数为 1 表示添加新的验光单， 2 表示更新验光单
  					// name 表示修改的人名儿，pd瞳距
  					url:'../newOpticsData/newOpticsData?kinds='+item+'&index='+index
863d3aa95   BigBoss   新增验光数据页面 
117
 
  				})
5b513503f   BigBoss   验光数据页面 
118
 
  			}
156736a2e   尹聃   样式修改 
119
120
121
122
123
 
  		}
  	}
  </script>
  
  <style lang="scss">
5b513503f   BigBoss   验光数据页面 
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
 
  	.wrap{
  		min-height: 100vh;
  		width: 100%;
  		background-color: #F2F2F2;
  		.header{
  			height: 304rpx;
  			width: 100%;
  			background-color: #FFFFFF;
  			display: flex;
  			justify-content: space-around;	
  			align-items: center;
  			view{
  				height: 210rpx;
  				width: 304rpx;
  				background: #FDF7F5;
  				border-radius: 4px;
  				border-radius: 4px;
  				display: flex;
  				flex-direction: column;
  				align-items: center;
  				justify-content: center;
  				text{
  					font-size: 12px;
  					color: #333333;
  				}
  				image{
  					height: 144rpx;
  					width: 144rpx;
  				}
  			}
  		}
  		.dataMenu{
  			margin-top: 20rpx;
  			box-shadow: 0 0 4px 0 rgba(133,107,107,0.10);
  			width: 100%;
  			background-color: #FFFFFF;
31dea37da   喻鹏   新增验光单和修改验光单 
160
 
  			margin-bottom: 120rpx;
5b513503f   BigBoss   验光数据页面 
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
 
  			.item{
  				padding: 0 40rpx;
  				.loveDataInfo{
  					padding: 0 44rpx 0 70rpx;
  					display: flex;
  					justify-content: space-around;
  					flex-direction: column;
  					align-items: flex-start;
  					.dataInfoItem{
  						font-size: 12px;
  						color: #333333;
  						margin-bottom: 34rpx;
  						text{
  							font-size: 12px;
  							color: #2A2A2A;
  							margin-right: 20rpx;
  						}
  					}
  				}
  			}
  		}
  		.footer{
  			width: 100%;
  			position: fixed;
  			bottom: 0;
  			left: 0;
  			.btn{
  				width: 100%;
  				height: 112rpx;
  				line-height: 112rpx;
  				background: #FF6B4A;
  				font-size: 16px;
  				color: #FFFFFF;
  			}
  		}
  	}
863d3aa95   BigBoss   新增验光数据页面 
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
 
  	.popUpWrap{
  		height: 850rpx;
  		width: 542rpx;
  		background-color: #FFFFFF;
  		border-radius: 4px;
  		border: 1px solid #979797;
  		.closeBtn{
  			height: 28rpx;
  			width: 28rpx;
  			// border: 1px solid red;
  			position: absolute;
  			top: 20rpx;
  			right: 20rpx;
  		}
  		.glassInfo{
  			height: 474rpx;
  			width: 528rpx;
  		}
  		.dataInfo{
  			height: 850rpx;
  			width: 542rpx;
  		}
  	}
  	.popUpWrap1{
  		height: 474rpx;
  		width: 528rpx;
  		border-radius: 4px;
  		border: 1px solid #979797;
  	}
156736a2e   尹聃   样式修改 
226
227
 
  	
  </style>