吉鹏 / gulu-vue

Browse Code »

Commit a196efbcb1d6ec5de5a3a758bbcd0050fa67f721

Authored by 范牧 2020-06-09 23:40:00 +0800

2 parents bd002a8ecb c4494f932d

Exists in master

合并冲突

Showing 6 changed files Show diff stats

src/components/BottomSheet/BottomSheet.vue

Diff comments View file @a196efb

 <template>
 	<view class="BottomSheetContent">
 		<view class="sheet" :class="{sheetShow:isShowBottom,sheeHide:!isShowBottom}"    @touchmove.stop.prevent="moveHandle"  @click="closeSheet()">
 			<scroll-view scroll-y="true"  class="sheetView"   :class="{sheetView_active:isShowBottom}"   @click.stop="stopEvent()" >
 				<view class="BottomSheetContent">
 				  <view class="goodInfo">
 				    <view class="imageWrap">
 				      <image
 				        :src="skuItem.pic"
 				        mode="aspectFill"
 				        style="width: 188rpx;height: 168rpx;"
 				      ></image>
 				    </view>
 				    <view class="infoRight">
 				      <text class="goodName">{{goodInfo.p_name}}</text>
 				      <text class="remarks">支持7天无理由退货  顺丰发货</text>
 				      <view class="priceBox">
 				        <view class="price">￥{{skuItem.real_price || '暂无'}}</view>
 				        <text>(限购{{maxCount}}副)</text>
 				        <view class="counter">
 				          <view
 				            class="btn"
 				            disabled="this.addDisabled"
 				            type="default"
 				            @click="counter(false)"
 				          >-</view>
 				          <text>{{count}}</text>
 				          <view
 				            class="btn"
 				            disabled="this.desDisabled"
 				            type="default"
 				            @click="counter(true)"
 				          >+</view>
 				        </view>
 				      </view>
 				    </view>
 				  </view>
 				  <view class="peopleChoose">
 					  <view class="title">选择使用人</view>
 					  <view class="loveList">
 					  	<view class="peopleName" v-for="(item,index) in loveList" :key='index' :class="{ active2: loveCurrent === index }"
 				                @click="onClickLoveItem(index,item.name)">
 					  		{{item.name}}
 					  	</view>
 					  </view>
 				  </view>
 				  <view class="goods-data" v-if="isCart !== 3">
 				    <view class="opCollapse">
 				      <view class="body">
 				        <template v-if="opIsOpen">
 				    <view class="goods-form">
 				      <view class="p1">
 				        <image class="image2" src="../../static/img/myOpticsData/dataWrite.png" mode="aspectFit"></image>
 				        填写验光数据
 				      </view>
 				      <text class="p2">没有验光数据？请到线下眼镜店验光哦～</text>
 				      <view class="picker">
 				        <view class="picker-choice">
 				          <view class="choice-left">
 				            <text class="pd">验光单取名:</text>
 				          </view>
 				          <input type="text" @blur="handleInput" class="input"
 				          placeholder="请输入名称" maxlength="20" :value="name" />
 				        </view>
 				      </view>
 				      <view class="picker" >
 				        <view class="picker-choice">
 				          <view class="choice-left">
 				            <text class="p11">{{pickerInfoList[0].nameC}}</text>
 				            <text class="p12">{{pickerInfoList[0].nameE}}</text>
 				          </view>
 				          <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
 				          <!-- <text class="p14">{{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}</text> -->
 				          <picker  @change="bindPickerChange01" :value="pickerInfoList[0].nameIndex1" :range="pickerInfoList[0].nameArray1">
 				            <view class="p14">
 				            {{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}
 				            <image src="../../static/detail-tabicon.png" ></image>
 				            </view>
 				            <!-- <image src="../../static/detail-tabicon.png" ></image> -->
 				          </picker>
 				          <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
 				          <!-- <text class="p14">{{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}</text> -->
 				          <picker @change="bindPickerChange02" :value="pickerInfoList[0].nameIndex2" :range="pickerInfoList[0].nameArray2">
 				            <view class="p14">
 				            {{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}
 				            <image src="../../static/detail-tabicon.png" ></image>
 				            </view>
 				            <!-- <image src="../../static/detail-tabicon.png" ></image> -->
 				          </picker>
 				        </view>
 				      </view>
 				      <view class="picker" >
 				        <view class="picker-choice">
 				          <view class="choice-left">
 				            <text class="p11">{{pickerInfoList[1].nameC}}</text>
 				            <text class="p12">{{pickerInfoList[1].nameE}}</text>
 				          </view>
 				          <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
 				          <!-- <text class="p14">{{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}</text> -->
 				          <picker @change="bindPickerChange11" :value="pickerInfoList[1].nameIndex1" :range="pickerInfoList[1].nameArray1">
 				            <view class="p14">
 				              {{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}
 				              <image src="../../static/detail-tabicon.png" ></image>
 				            </view>
 				            <!-- <image src="../../static/detail-tabicon.png" ></image> -->
 				          </picker>
 				          <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
 				          <!-- <text class="p14">{{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}</text> -->
 				          <picker @change="bindPickerChange12" :value="pickerInfoList[1].nameIndex2" :range="pickerInfoList[1].nameArray2">
 				            <view class="p14">
 				              {{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}
 				              <image src="../../static/detail-tabicon.png" ></image>
 				            </view>
 				            <!-- <image src="../../static/detail-tabicon.png" ></image> -->
 				          </picker>
 				        </view>
 				      </view>
 				      <view class="picker" >
 				        <view class="picker-choice">
 				          <view class="choice-left">
 				            <text class="p11">{{pickerInfoList[2].nameC}}</text>
 				            <text class="p12">{{pickerInfoList[2].nameE}}</text>
 				          </view>
 				          <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
 				          <picker @change="bindPickerChange21" :value="pickerInfoList[2].nameIndex1" :range="pickerInfoList[2].nameArray1">
 				            <view class="p14">
 				              {{pickerInfoList[2].nameArray1[pickerInfoList[2].nameIndex1]}}
 				              <image src="../../static/detail-tabicon.png" ></image>
 				            </view>
 				          </picker>
 				          <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
 				          <!-- <text class="p14">{{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}</text> -->
 				          <picker @change="bindPickerChange22" :value="pickerInfoList[2].nameIndex2" :range="pickerInfoList[2].nameArray2">
 				            <view class="p14">
 				              {{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}
 				              <image src="../../static/detail-tabicon.png" ></image>
 				            </view>
 				            <!-- <image src="../../static/detail-tabicon.png" ></image> -->
 				          </picker>
 				        </view>
 				      </view>
 				      <view class="picker">
 				        <view class="picker-choice">
 				          <view class="choice-left">
 				            <text class="pd">瞳距:</text>
 				          </view>
 				          <input type="digit" @change="handleInputPd" class="input"
 				          placeholder="请输入瞳距,单位cm" maxlength="20" :value="pd" />
 				        </view>
 				      </view>
 				      <view class="picker" >
 				        <view class="picker-choice">
 				          <view class="choice-left">
 				            <text class="p11">{{pickerInfoList[3].nameC}}</text>
 				          </view>
 				          <text class="p13-date">年&nbsp;&nbsp;&nbsp;(Y)</text>
 				          <picker @change="bindPickerChange41" :value="pickerInfoList[3].nameIndex1" :range="pickerInfoList[3].nameArray1">
 				            <view class="p14" style="width: 30px;">
 				              {{pickerInfoList[3].nameArray1[pickerInfoList[3].nameIndex1]}}
 				              <image src="../../static/detail-tabicon.png" ></image>
 				            </view>
 				          </picker>
 				          <text class="p13-date">月&nbsp;&nbsp;&nbsp;(M)</text>
 				          <picker @change="bindPickerChange42" :value="pickerInfoList[3].nameIndex2" :range="pickerInfoList[3].nameArray2">
 				            <view class="p14" style="width: 30px;">
 				              {{pickerInfoList[3].nameArray2[pickerInfoList[3].nameIndex2]}}
 				              <image src="../../static/detail-tabicon.png" ></image>
 				            </view>
 				          </picker>
 				          <text class="p13-date">日&nbsp;&nbsp;&nbsp;(D)</text>
 				          <picker @change="bindPickerChange43" :value="pickerInfoList[3].nameIndex3" :range="pickerInfoList[3].nameArray3">
 				            <view class="p14" style="width: 30px;">
 				              {{pickerInfoList[3].nameArray3[pickerInfoList[3].nameIndex3]}}
 				              <image src="../../static/detail-tabicon.png" ></image>
 				            </view>
 				          </picker>
 				        </view>
 				      </view>
+					  <view class="ipts">
+					  	<view class="inputItem">
+					  		<text class="text">镜片宽度</text>
+					  		<input class="input" @input="glassInfoInput($event,0)" type="text" :value="glassInfo.glassWidth" placeholder="请输入镜片宽度"/>
+					  	</view>
+					  	<view class="inputItem">
+					  		<text class="text">鼻梁宽度</text>
+					  		<input class="input" @input="glassInfoInput($event,1)" type="text" :value="glassInfo.norseWidth" placeholder="请输入鼻梁宽度"/>
+					  	</view>
+					  	<view class="inputItem">
+					  		<text class="text">镜腿长度</text>
+					  		<input class="input" @input="glassInfoInput($event,2)" type="text" :value="glassInfo.legWidth" placeholder="请输入镜腿长度"/>
+					  	</view>
+					  </view>
 				      <view class="confirm">
 				        <image class="image1" :src="confirm ? tabicon[0] : tabicon[1]" @tap="changeConfirm"></image>
 				        <text>确认以上输入信息来源于我的验光数据!</text>
 				      </view>
 				    </view>
 				        </template>
 				        <template v-else>
 				          <view
 				            v-for="item in pickerInfoList"
 				            :key="item.key"
 				            class="bodyBox"
 				          >
 				            <template v-if="item.nameC==='验光日期'">
 				              <text class="names">{{item.nameC}}</text>
 				              <text style="margin-right: 5px;">{{item.nameArray1[item.nameIndex1]}}年</text>
 				              <text style="margin-right: 5px;">{{item.nameArray2[item.nameIndex2]}}月</text>
 				              <text>{{item.nameArray3[item.nameIndex2]}}日</text>
 				            </template>
 				            <template v-else>
 				              <template v-if="item.nameC==='度数'">
 				                <text style="display: inline;">*</text>
 				              </template>
 				              <text class="names">{{item.nameC}}</text>
 				              <text style="margin-right: 10px;">左&nbsp;{{item.nameArray1[item.nameIndex1]}}</text>
 				              <text>右&nbsp;{{item.nameArray2[item.nameIndex2]}}</text>
 				            </template>
 				          </view>
 				        </template>
 				      </view>
 				    </view>
 				  </view>
 				  <view class="choose">
 				    <view
 				      class="chooseItem_1_content"
 				      v-for="(item,index) in attrList"
 				      :key="index"
 				    >
 				      <UniCollapse @change="changeShow(index)">
 				        <UniCollapseItem
 				          :open="show[index]"
 				          :title="item.meta_name"
 				          showAnimation=false
 				        >
 				          <view class="chooseItem_1_content">
 				            <view class="itemsWrap" 	v-if="isCart ==3">
 				              <view
 				                class="item2"
 				                v-for="(one,i) in item.attr"
 				                :key="i"
 				                :class="{ active2: current[index] === i}"
 				                @click="cartOnClickItem(index, i,one.aid)"
 				              >{{one.name}}</view>
 				            </view>
 							<view class="itemsWrap" 	v-else>
 							  <view
 							    class="item2"
 							    v-for="(one,i) in item.attr"
 							    :key="i"
 							    :class="{ active2: current[index] === i }"
 							    @click="cartOnClickItem(index, i,one.aid)"
 							  >{{one.name}}</view>
 							</view>
 				          </view>
 				        </UniCollapseItem>
 				      </UniCollapse>
 				      <view
 				        class="chooseRes"
 				        v-show="!show[index]"
 				      >* {{attrList[index].attr[current[index]].name}}</view>
 				    </view>
 				  </view>
 				  <view
 				    class="button"
 				    @click.native="addCart"
 					v-if="isCart == 1"
 				  >
 				    加入购物车
 				  </view>
 				  <view
 				    class="button"
 				    @click="toComfirmOrder"
 					v-if="isCart == 2"
 				  >
 				    立即结算
 				  </view>
 				  <view
 				    class="button"
 				    @click="comfirmChoose"
 				  	v-if="isCart == 3"
 				  >
 				    确定
 				  </view>
 				</view>
 			</scroll-view>
 		</view>
 	</view>
 </template>
 <script>
 import UniCollapse from '@/components/UniCollapse/UniCollapse.vue'
 import UniCollapseItem from '@/components/UniCollapseItem/UniCollapseItem.vue'
 import store from '@/store'
 	export default {
 		components: {
 			UniCollapse,
 			UniCollapseItem,
 		},
 		props: {
 			isShowBottom : Boolean,
 			pid: Number,
 			sk_id:String,
 			propMpId:String,
 			goodInfo:Object,
 			isCart:Number,
 			cart_id:Number,
 			index:Number
 		},
 		data() {
 		  return {
 			loveCurrent:Number,
 		    count: 1,
 		    // pid: 0,
 		    maxCount: 20,
 		    dataName: '', // 验光数据人员名称
 		    isDataName: false, // 是否是已存在的人员数据
 		    dataConfirm: false, // 已确认所输入验光数据
 		    opIsOpen: true,
 		    addDisabled: false,
 		    desDisabled: false,
 		    current: [],
 		    show: [true,true],
 		    checkedData: {},
 		    // 度数相关数据
 		    pickerInfoList: [
 		      { nameC: '度数', nameE: '(SPH)', nameArray1: [''], nameIndex1: 0, nameArray2: [''], nameIndex2: 0, key: 0 },
 		      { nameC: '散光', nameE: '(CYL)', nameArray1: [''], nameIndex1: 0, nameArray2: [''], nameIndex2: 0, key: 1 },
 		      { nameC: '散光轴位', nameE: '(AXI)', nameArray1: [''], nameIndex1: 0, nameArray2: [''], nameIndex2: 0, key: 2 },
 		      { nameC: '验光日期', nameE: '', nameArray1: [''], nameIndex1: 0, nameArray2: ['', 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12], nameIndex2: 0, nameArray3: [''], nameIndex3: 0 },
 		    ],
 		    confirm: false, // 用户是否确认
 		    tabicon: ['/static/detail-button.png', '/static/detail-button-unselected.png'],
 		    name: '',
 		    oldname: '', // 用于判读用户是否改变名字
 		    pickerInfoChioce: {
 		      leftSph: '',
 		      rightSph: '',
 		      leftCyl: '',
 		      rightCyl: '',
 		      leftAxi: '',
 		      rightAxi: '',
 		      time: {
 		        year: 0,
 		        month: 0,
 		        day: 0,
 		      },
 		    },
+			glassInfo:{
+				norseWidth:Number,//鼻宽
+				glassWidth:Number,//镜片宽度
+				legWidth:Number//镜腿长度
+			},
 		    pd: '', // 瞳距
 		    oldpd: '', // 用于判断用户是否改变瞳距
 		    kinds: 1, // kinds=1，提交为新增验光，2为修改
 		    mp_id: Number,
 			skuValueArray:[],
 			skId:String
 		  }
 		},
 		computed: {
 			//进购物车选择的人的index
 			p_current(){
 					const getLoveItemIndex = (item) => item.mp_id == this.propMpId
 					const p_current = this.$store.state.myLoveList.loveList.findIndex(getLoveItemIndex )
 					if(this.isCart == 3){
 						this.loveCurrent = p_current
 					}
 					return p_current
 			},
 			arr_current(){
 				if(this.isCart == 3){
 					const skId = this.sk_id
 					const skuValue = this.skuItem.sku_value
 					const skuValueArray = skuValue.split('_')
 					this.skuValueArray = skuValueArray
 					const attrList = this.$store.state.read.goodInfo.attrList
 					for (let i = 0;i<attrList.length;i++) {
 						const getArrIndex = (item) => item.aid == skuValueArray[i]
 						const arr_current = this.$store.state.read.goodInfo.attrList[i].attr.findIndex(getArrIndex )
 						// console.log('arr_current',arr_current)
 						this.current.push(arr_current)
 					}
 				}else{
 					return null
 				}
 			},
 			loveList() {
 				return this.$store.state.myLoveList.loveList || []
 			},
 		  attrList() {
 			  // console.log('attrList',this.$store.state.read.goodInfo.attrList)
 			  let attrList =  this.$store.state.read.goodInfo.attrList
 			  if(attrList !== undefined){
 				return attrList
 			  }else{
 				  return []
 			  }
 		  },
 		  skuList() {
 			  // console.log('skuList',this.$store.state.read.goodInfo.skuList)
 		    return this.$store.state.read.goodInfo.skuList
 		  },
 		  skuItem(){
 			  // if(this.isCart == 3){
 				  const skuList =  this.$store.state.read.goodInfo.skuList
 				  const skuItem = skuList.filter(item => item.sk_id === this.skId)[0]
 				  return skuItem
 			  // }else{
 				 //  const skuList =  this.$store.state.read.goodInfo.skuList
 				 //  const skuItem = skuList[0]
 				 //  return skuItem
 			  // }
 		  },
 		  mpList() {
 		    return this.$store.state.myLoveList.loveList
 		  },
 		},
 		created() {
 			this.skuValueArray = this.skuList[0].sku_value.split("_")
 			// console.log(this.sk_id)
 			this.mp_id = this.propMpId
 		  const pid = this.pid
 		  if(this.isCart!==3){
 			this.skId = this.skuList[0].sk_id
 			const current = []
 			const show = []
 			for (let index = 0; index < this.attrList.length; index++) {
 			  current.push(0)
 			  show.push(true)
 			}
 			this.current = current
 			this.show = show
 		  }else{
 			this.skId = this.sk_id
 		  }
 		  	//获取关心的人列表
 		  	store.dispatch('myLoveList/getLoveList', {
 		  		uid: this.$store.state.user.userInfo.uid,
 		  	});
 		  // 初始化SPL、CYL、AXI的值
 		  for (let j = 0; j < 3; j++) {
 		    for (let i = -12; i < 6; i++) {
 		      this.pickerInfoList[j].nameArray1.push(i)
 		      this.pickerInfoList[j].nameArray1.push(i + 0.5)
 		      this.pickerInfoList[j].nameArray2.push(i)
 		      this.pickerInfoList[j].nameArray2.push(i + 0.5)
 		      if (i >= -6) {
 		        this.pickerInfoList[j].nameArray1.push(i + 0.25)
 		        this.pickerInfoList[j].nameArray1.push(i + 0.75)
 		        this.pickerInfoList[j].nameArray2.push(i + 0.25)
 		        this.pickerInfoList[j].nameArray2.push(i + 0.75)
 		      }
 		      if (i === 5) {
 		        this.pickerInfoList[j].nameArray1.push(i + 1)
 		        this.pickerInfoList[j].nameArray2.push(i + 1)
 		      }
 		    }
 		  }
 		  // 初始化日期值
 		  for (let i = 1; i < 32; i++) {
 		    this.pickerInfoList[3].nameArray3.push(i)
 		  }
 		  // 初始化年份前后五年
 		  const myDate = new Date()
 		  const nowYear = myDate.getFullYear()
 		  for (let i = 0; i < 5; i++) {
 		    this.pickerInfoList[3].nameArray1.push(nowYear - i)
 		  }
 		},
 		name : "bottomSheet",
 		methods: {
+			checkGlassInfo(){
+				const glassInfoArr = Object.values(this.glassInfo)
+				// console.log(glassInfoArr)
+				if(glassInfoArr.find(item => item == '0') !=='undefind'){
+					uni.showToast({
+						title:'请完善镜框数据~'
+					})
+				}
+			},
+			updateMylove(){
+				const loveItem = this.loveList[this.loveCurrent]
+				const glassWidth = this.glassInfo.glassWidth
+				const norseWidth = this.glassInfo.norseWidth
+				const legWidth = this.glassInfo.legWidth
+				console.log(loveItem.glassWidth)
+				console.log(glassWidth)
+				if(loveItem.glassWidth !== glassWidth){
+					store.dispatch('myLoveList/updateMylove', {
+						uid: this.$store.state.user.userInfo.uid,
+						openid: this.$store.state.user.userInfo.openid,
+						mp_id: this.mp_id,
+						keyname: 'glassWidth',
+						keyvalue: glassWidth
+					});
+				}
+				if(loveItem.norseWidth !== norseWidth){
+					store.dispatch('myLoveList/updateMylove', {
+						uid: this.$store.state.user.userInfo.uid,
+						openid: this.$store.state.user.userInfo.openid,
+						mp_id: this.mp_id,
+						keyname: 'norseWidth',
+						keyvalue: norseWidth
+					});
+				}
+				if(loveItem.legWidth !== legWidth){
+					store.dispatch('myLoveList/updateMylove', {
+						uid: this.$store.state.user.userInfo.uid,
+						openid: this.$store.state.user.userInfo.openid,
+						mp_id: this.mp_id,
+						keyname: 'legWidth',
+						keyvalue: legWidth
+					});
+				}
+			},
+			glassInfoInput(e,type){
+				switch(type){
+					case 0:
+						this.glassInfo.glassWidth = e.detail.value
+					break;
+					case 1:
+						this.glassInfo.norseWidth = e.detail.value
+					break;
+					case 2:
+						this.glassInfo.legWidth = e.detail.value
+					break;
+					default:
+					break;
+				}
+			},
 			//参数点击事件==》改变对应图片
 			cartOnClickItem(index, i,aid) {
 				//根据aid拼接skuValue
 				this.skuValueArray[index] = aid
 				const sku_value = this.skuValueArray.join('_')
 				//根据sku_value获取对应的sk_id
 				const itemSk_id =  this.skuList.filter(item=>item.sku_value == sku_value)[0].sk_id
 				//修改sk_id
 				this.skId = itemSk_id
 			  if (this.current[index] !== i) {
 			    this.current[index] = i
 			  }
 			  this.$forceUpdate()
 			},
 			comfirmChoose(){
+				this.checkGlassInfo()
+				this.updateMylove()
 				const price = this.skuList.filter(item=>item.sk_id == this.skId)[0].real_price
 				this.$emit("chooseCartModi",this.mp_id,this.skId,price,this.pid,this.count,this.cart_id,this.index)//添加购物车
 				this.$emit("closeBottom")
 			},
 			addCart(){
+				this.checkGlassInfo()
+				this.updateMylove()
 				const that = this
 				const checkedSKUName = [that.goodInfo.attrList[0].meta_name,that.goodInfo.attrList[1].meta_name]
 				const checkedSKU = []
 				let j;
 				for (let i = 0;i<that.current.length;i++) {
 					checkedSKU.push(that.goodInfo.attrList[i].attr[that.current[i]])
 					// console.log('i', i, j, i !== this.current.length - 1)
 					  if (i !== this.current.length - 1) {
 					    // 后续需修改算法：目前暂定只有两个参数选择，后续若有多个参数需要修改实现自适应
 					    j = this.current[i] * this.attrList[1].attr.length
 					  } else {
 					    j += this.current[i]
 					  }
 				}
 				const price = this.skuList.filter(item=>item.sk_id == this.skuList[j].sk_id)[0].real_price
 				let sk_id = this.skuList[j].sk_id
 				// console.log('选择的商品sk_id',sk_id,'选择的商品参数',checkedSKU)
 				// console.log('mp_id',this.mp_id,'数量',this.count)
 				this.$emit("addCart",this.mp_id,this.count,checkedSKU,sk_id,price)//添加购物车
 				this.$emit("closeBottom")//关闭弹窗
 			},
 			onClickLoveItem(index,name){
 				const loveList = this.loveList
+				this.glassInfo.glassWidth = loveList[index].glassWidth
+				this.glassInfo.norseWidth = loveList[index].norseWidth
+				this.glassInfo.legWidth = loveList[index].legWidth
 				for (let index = 0; index < loveList.length; index++) {
 				  if (name === loveList[index].name && name!==this.name) {
 				    this.isDataName = true
 				          this.kinds = 2
 				          this.name = loveList[index].name
 				          this.pd = loveList[index].pd
 				          this.mp_id = loveList[index].mp_id
 				          this.oldname = loveList[index].name
 				          this.oldpd = loveList[index].pd
 				          this.pickerInfoList[0].nameArray1.unshift(loveList[index].leftSph)
 				          this.pickerInfoList[0].nameArray2.unshift(loveList[index].rightSph)
 				          this.pickerInfoList[1].nameArray1.unshift(loveList[index].leftCyl)
 				          this.pickerInfoList[1].nameArray2.unshift(loveList[index].rightCyl)
 				          this.pickerInfoList[2].nameArray1.unshift(loveList[index].leftAxi)
 				          this.pickerInfoList[2].nameArray2.unshift(loveList[index].rightAxi)
 				          this.pickerInfoList[3].nameArray1.unshift(loveList[index].in_time.toString().slice(0, 4))
 				          if (loveList[index].in_time.toString().slice(5, 6) === 0) {
 				            this.pickerInfoList[3].nameArray2.unshift(loveList[index].in_time.toString().slice(6, 7))
 				          } else {
 				            this.pickerInfoList[3].nameArray2.unshift(loveList[index].in_time.toString().slice(5, 7))
 				          }
 				          if (loveList[index].in_time.toString().slice(8, 9) === 0) {
 				            this.pickerInfoList[3].nameArray3.unshift(loveList[index].in_time.toString().slice(9, 10))
 				          } else {
 				            this.pickerInfoList[3].nameArray3.unshift(loveList[index].in_time.toString().slice(8, 10))
 				          }
 				  }
 				}
 					this.name = name;
 					this.loveCurrent = index;
 			},
 			closeSheet(){
 				this.$emit('closeBottom');
 			},
 			stopEvent(){						//@click.stop防止事件冒泡
 			},
 			moveHandle(){						//不让页面滚动
 			},
 			// picker相关功能
 			handleInput(e) {
 			  this.name = e.target.value
 			  this.isDataName = false
 			  const mpList = this.mpList
 			  // console.log('mpList===>', mpList)
 			  for (let index = 0; index < mpList.length; index++) {
 			    if (e.detail.value === mpList[index].name) {
 			      this.isDataName = true
 			      uni.showModal({
 			        title: '提示',
 			        content: `是否填充已有的"${e.detail.value}"的数据`,
 			        success: (res) => {
 			          if (res.confirm) {
 			            this.kinds = 2
 			            // console.log('args===>', index)
 			            // const mpList=Object.assign({},this.$store.state.mympList.mpList)
 			            this.name = mpList[index].name
 			            this.pd = mpList[index].pd
 			            this.mp_id = mpList[index].mp_id
 			            this.oldname = mpList[index].name
 			            this.oldpd = mpList[index].pd
 			            // 将kinds =2时的值传到该页面
 			            this.pickerInfoList[0].nameArray1.unshift(mpList[index].leftSph)
 			            this.pickerInfoList[0].nameArray2.unshift(mpList[index].rightSph)
 			            this.pickerInfoList[1].nameArray1.unshift(mpList[index].leftCyl)
 			            this.pickerInfoList[1].nameArray2.unshift(mpList[index].rightCyl)
 			            this.pickerInfoList[2].nameArray1.unshift(mpList[index].leftAxi)
 			            this.pickerInfoList[2].nameArray2.unshift(mpList[index].rightAxi)
 			            this.pickerInfoList[3].nameArray1.unshift(mpList[index].in_time.toString().slice(0, 4))
 			            if (mpList[index].in_time.toString().slice(5, 6) === 0) {
 			              this.pickerInfoList[3].nameArray2.unshift(mpList[index].in_time.toString().slice(6, 7))
 			            } else {
 			              this.pickerInfoList[3].nameArray2.unshift(mpList[index].in_time.toString().slice(5, 7))
 			            }
 			            if (mpList[index].in_time.toString().slice(8, 9) === 0) {
 			              this.pickerInfoList[3].nameArray3.unshift(mpList[index].in_time.toString().slice(9, 10))
 			            } else {
 			              this.pickerInfoList[3].nameArray3.unshift(mpList[index].in_time.toString().slice(8, 10))
 			            }
 			          // this.checkedData = mpList[index]
 			          // console.log('checkedData', this.checkedData)
 			          } else if (res.cancel) {
 			            this.kinds = 2
 			          }
 			        },
 			      })
 			    }
 			  }
 			},
 			handleInputPd(e) {
 			  // 只能输入正浮点数或正数
 			  if (/^\d+(\.\d+)?$/.test(e.target.value)) {
 			    this.pd = e.target.value
 			  } else {
 			    uni.showToast({
 			      title: '请输入有效数据;示例:89',
 			      icon: 'none',
 			      duration: 2000,
 			    })
 			    this.pd = ''
 			  }
 			},
 			changeConfirm() {
 			  this.confirm = !this.confirm
 			},
 			bindPickerChange01: function(e) {
 			  this.pickerInfoList[0].nameIndex1 = e.target.value
 			  this.pickerInfoChioce.leftSph = this.pickerInfoList[0].nameArray1[e.target.value]
 			},
 			bindPickerChange02: function(e) {
 			  this.pickerInfoList[0].nameIndex2 = e.target.value
 			  this.pickerInfoChioce.rightSph = this.pickerInfoList[0].nameArray2[e.target.value]
 			},
 			bindPickerChange11: function(e) {
 			  this.pickerInfoList[1].nameIndex1 = e.target.value
 			  this.pickerInfoChioce.leftCyl = this.pickerInfoList[1].nameArray1[e.target.value]
 			},
 			bindPickerChange12: function(e) {
 			  this.pickerInfoList[1].nameIndex2 = e.target.value
 			  this.pickerInfoChioce.rightCyl = this.pickerInfoList[1].nameArray2[e.target.value]
 			},
 			bindPickerChange21: function(e) {
 			  this.pickerInfoList[2].nameIndex1 = e.target.value
 			  this.pickerInfoChioce.leftAxi = this.pickerInfoList[2].nameArray1[e.target.value]
 			},
 			bindPickerChange22: function(e) {
 			  this.pickerInfoList[2].nameIndex2 = e.target.value
 			  this.pickerInfoChioce.rightAxi = this.pickerInfoList[2].nameArray2[e.target.value]
 			},
 			bindPickerChange41: function(e) {
 			  this.pickerInfoList[3].nameIndex1 = e.target.value
 			  this.pickerInfoChioce.time.year = this.pickerInfoList[3].nameArray1[e.target.value]
 			},
 			bindPickerChange42: function(e) {
 			  this.pickerInfoList[3].nameIndex2 = e.target.value
 			  this.pickerInfoChioce.time.month = this.pickerInfoList[3].nameArray2[e.target.value]
 			},
 			bindPickerChange43: function(e) {
 			  this.pickerInfoList[3].nameIndex3 = e.target.value
 			  this.pickerInfoChioce.time.day = this.pickerInfoList[3].nameArray3[e.target.value]
 			},
 			changeShow(num) {
 			  this.show[num] = !this.show[num]
 			  this.$forceUpdate()
 			},
 			counter(isadd) {
 			  if (isadd) {
 			    this.count >= this.maxCount ? this.addDisabled = true : this.count++
 			  } else {
 			    this.count <= 1 ? this.desDisabled = true : this.count--
 			  }
 			},
 			toComfirmOrder() {
+				this.updateMylove()
 			  // 先处理验光部分的逻辑，如果ok在跳转
 			  let flag = 0
 			  if (this.name === '') {
 			    uni.showToast({
 			      title: '请输入验光单取名',
 			      icon: 'none',
 			      duration: 2000,
 			    })
 			  } else {
 			    if (this.pd === '') {
 			      uni.showToast({
 			        title: '请输入瞳距',
 			        icon: 'none',
 			        duration: 2000,
 			      })
 			    } else {
 			      if (this.kinds === 1) {
 			        // 添加用户验光单
 			        console.log('kinds====>', this.pickerInfoChioce.leftSph)
 			        console.log('kinds====>', this.pickerInfoChioce.leftSph === Number)
 			        console.log('kinds====>', this.pickerInfoChioce.rightSph === Number)
 			        if (this.pickerInfoChioce.rightSph === '' || this.pickerInfoChioce.leftSph === '' ||
 			        this.pickerInfoChioce.leftCyl === '' || this.pickerInfoChioce.rightCyl === '' ||
 			        this.pickerInfoChioce.leftAxi === '' || this.pickerInfoChioce.rightAxi === ''
 			        ) {
 			          uni.showToast({
 			            title: '请输入您的验光数据',
 			            icon: 'none',
 			            duration: 2000,
 			          })
 			        } else {
 			          if (this.confirm) {
 			            store.dispatch('myLoveList/addMylove', {
 			              uid: this.$store.state.user.userInfo.uid,
 			              openid: this.$store.state.user.userInfo.openid,
 			              // mp_name: this.$store.state.user.userInfo.mp_name,
 			              leftSph: this.pickerInfoChioce.leftSph,
 			              rightSph: this.pickerInfoChioce.rightSph,
 			              leftCyl: this.pickerInfoChioce.leftCyl,
 			              rightCyl: this.pickerInfoChioce.rightCyl,
 			              leftAxi: this.pickerInfoChioce.leftAxi,
 			              rightAxi: this.pickerInfoChioce.rightAxi,
 			              pd: this.pd, // 瞳距
 			              mp_name: this.name,
 			            // time: this.pickerInfoChioce.time,
 			            // img_url2: "http://localhost:8087/images/shop_1/1/",
 			            }).then(({ mp_id: mpId }) => {
 			              this.mp_id = mpId
 			            })
 			            flag = 1
 			          } else {
 			            uni.showToast({
 			              title: '请确认您的验光数据',
 			              icon: 'none',
 			              duration: 3000,
 			            })
 			          }
 			        }
 			      }
 			      if (this.kinds === 2) {
 			        if (this.confirm) {
 			          const leftList = ['leftSph', 'leftCyl', 'leftAxi']
 			          const rightList = ['rightSph', 'rightCyl', 'rightAxi']
 			          // let flag=0;
 			          if (this.name !== this.oldname) {
 			            store.dispatch('myLoveList/updateMylove', {
 			              uid: this.$store.state.user.userInfo.uid,
 			              openid: this.$store.state.user.userInfo.openid,
 			              mp_id: this.mp_id,
 			              keyname: 'name',
 			              keyvalue: this.name,
 			            })
 			            flag = 1
 			          }
 			          if (this.pd !== this.oldpd) {
 			            store.dispatch('myLoveList/updateMylove', {
 			              uid: this.$store.state.user.userInfo.uid,
 			              openid: this.$store.state.user.userInfo.openid,
 			              mp_id: this.mp_id,
 			              keyname: 'pd',
 			              keyvalue: this.pd,
 			            })
 			            flag = 1
 			          }
 			          //  先验证是否输入有无空
 			          let q = true
 			          for (let k = 0; k < 3; k++) {
 			            q = q && (this.pickerInfoList[k].nameArray1[this.pickerInfoList[k].nameIndex1] !== '' &&
 			            this.pickerInfoList[k].nameArray2[this.pickerInfoList[k].nameIndex2] !== '')
 			          }
 			          if (q) {
 			            for (let j = 0; j < 3; j++) {
 			              if (this.pickerInfoList[j].nameIndex1 !== 0) {
 			                store.dispatch('myLoveList/updateMylove', {
 			                  uid: this.$store.state.user.userInfo.uid,
 			                  openid: this.$store.state.user.userInfo.openid,
 			                  mp_id: this.mp_id,
 			                  keyname: leftList[j],
 			                  keyvalue: this.pickerInfoList[j].nameArray1[this.pickerInfoList[j].nameIndex1],
 			                })
 			              }
 			              if (this.pickerInfoList[j].nameIndex2 !== 0) {
 			                store.dispatch('myLoveList/updateMylove', {
 			                  uid: this.$store.state.user.userInfo.uid,
 			                  openid: this.$store.state.user.userInfo.openid,
 			                  mp_id: this.mp_id,
 			                  keyname: rightList[j],
 			                  keyvalue: this.pickerInfoList[j].nameArray2[this.pickerInfoList[j].nameIndex2],
 			                })
 			              }
 			              flag = 1
 			            }
 			          } else {
 			            flag = 0
 			            uni.showToast({
 			              title: '请输入您的验光数据',
 			              icon: 'none',
 			              duration: 2000,
 			            })
 			          }
 			          if (flag !== 0) {
 			            store.dispatch('myLoveList/getLoveList', {
 			              uid: this.$store.state.user.userInfo.uid,
 			            })
 			          }
 			        } else {
 			          uni.showToast({
 			            title: '请确认您的验光数据',
 			            icon: 'none',
 			            duration: 3000,
 			          })
 			        }
 			      }
 			    }
 			  }
 			  if (flag !== 0) {
 			    // 如果数据验证无误，那么更新验光单的数据
 			    store.dispatch('myLoveList/getLoveList', {
 			      uid: this.$store.state.user.userInfo.uid,
 			    })
 			    let i = 0
 			    // 判断出是哪一个sku被选中
 			    for (let index = 0; index < this.current.length; index++) {
 			      // console.log('index', index, i, index !== this.current.length - 1)
 			      if (index !== this.current.length - 1) {
 			        // 后续需修改算法：目前暂定只有两个参数选择，后续若有多个参数需要修改实现自适应
 			        i = this.current[index] * this.attrList[1].attr.length
 			      } else {
 			        i += this.current[index]
 			      }
 			    }
 			    // 判断是否其输入的人员数据是否已存在
 			    store.dispatch('order/saveParams', {
 			      sk_id_arr: this.skuList[i],
 			      current: this.current,
 			      mp_id: this.mp_id,
 			      attrList: this.attrList,
 			    })
 				this.$store.state.cart.buyItem = this.skuItem
 			    // 跳转到确认订单页面
 			    uni.navigateTo({
 			      url: `../confirmOrder/confirmOrder?pid=${this.pid}&count=${this.count}&name=${this.name}&isCart=false`,
 			    })
 			  }
 			},
 		}
 	}
 </script>
 <style lang="scss">
 	.BottomSheetContent {
 	  min-height: 100vh;
 	  background-color: #f2f2f2;
 	  // padding-top: 20rpx;
 	  .goodInfo {
 	    width: 100%;
 	    height: 272rpx;
 	    border-radius: 16rpx;
 	    background-color: #ffffff;
 	    box-sizing: border-box;
 	    padding: 36rpx;
 	    display: flex;
 	    flex-direction: row;
 	    justify-content: flex-start;
 		position: sticky;
 		top: 0rpx;
 		left: 0rpx;
 		z-index: 99999;
 	    .imageWrap {
 	      height: 188rpx;
 	      width: 188rpx;
 	      margin-right: 28rpx;
 	      image {
 	        height: 188rpx;
 	        width: 188rpx;
 	      }
 	    }
 	    .infoRight {
 	      display: flex;
 	      flex-direction: column;
 	      align-items: flex-start;
 	      justify-content: space-between;
 		  width: 100%;
 	      .goodName {
 	        font-size: 28rpx;
 	        color: #333333;
 	      }
 	      .remarks {
 	        font-size: 20rpx;
 	        color: #999999;
 	      }
 	      .priceBox {
 	        display: flex;
 	        justify-content: space-between;
 	        align-items: center;
 	        width: 100%;
 	        font-size: 14px;
 	        color: #999999;
 	        .price {
 	          color: #ff6b4a;
 	          font-size: 28rpx;
 	        }
 	        .counter {
 	          display: flex;
 	          flex-direction: row;
 	          justify-content: space-between;
 	          align-items: center;
 	          font-size: 28rpx;
 	          color: #333333;
 	          width: 122rpx;
 	          .btn {
 	            display: flex;
 	            justify-content: center;
 	            line-height: 32rpx;
 	            height: 32rpx;
 	            width: 32rpx;
 	            background-color: #f2f2f2;
 	            color: #cfcfcf;
 	          }
 	        }
 	      }
 	    }
 	  }
 	  .peopleChoose{
 		    width: 100%;
 		    min-height: 200rpx;
 		    border-radius: 16rpx;
 		    background-color: #ffffff;
 		    box-sizing: border-box;
 		    padding: 36rpx;
 			margin: 10px 0;
 		    display: flex;
 		    flex-direction: column;
 		    justify-content: flex-start;
 			align-items: center;
 			.title{
 				font-size: 16px;
 				color: #333333;
 				letter-spacing: -0.3px;
 				text-align: justify;
 				line-height: 24px;
 				margin: 4px 0;
 			}
 			.loveList{
 				display: flex;
 				flex-direction: row;
 				flex-wrap: wrap;
 				justify-content: flex-start;
 				align-items: center;
 				padding-top: 24rpx;
 				width: 100%;
 				.peopleName {
 				  padding: 0 30rpx;
 				  height: 60rpx;
 				  margin: 0 20rpx 20rpx 0;
 				  transition: all 0.3s;
 				  background: #f2f2f2;
 				  border-radius: 2px;
 				  border-radius: 2px;
 				  line-height: 60rpx;
 				  text-align: center;
 				  color: #666666;
 				  font-size: 12px;
 				}
 				.active2 {
 				  background: rgba(255, 107, 74, 0.15);
 				  color: #ff6b4a;
 				}
 			}
 	  }
 	  .goods-data {
 	    width: 100%;
 	    box-sizing: border-box;
 	    padding: 37rpx 40rpx 0 40rpx;
 	    background: #ffffff;
 	    border-radius: 12rpx;
 	    .opCollapse {
 	      width: 100%;
 	      padding-bottom: 28rpx;
 	      margin-top: 7px;
 	      border-bottom: 1px solid #e9e9e9;
 	      .head {
 	        display: flex;
 	        justify-content: space-between;
 	        height: 24px;
 	        // font-family: PingFangSC-Medium;
 	        font-size: 16px;
 	        color: #333333;
 	        letter-spacing: -0.3px;
 	        text-align: justify;
 	        line-height: 24px;
 	        margin-bottom: 18rpx;
 	        .headRighted {
 	          width: 0;
 	          height: 0;
 	          border-left: 4px solid transparent;
 	          border-right: 4px solid transparent;
 	          border-bottom: 4px solid #cfcfcf;
 	          transform: scaleY(-1);
 	          margin-top: 10px;
 	        }
 	        .headMid {
 	          font-size: 10px;
 	          color: #999999;
 	          letter-spacing: -0.19px;
 	          margin-left: -120rpx;
 	        }
 	        .headRight {
 	          width: 0;
 	          height: 0;
 	          border-left: 4px solid transparent;
 	          border-right: 4px solid transparent;
 	          border-bottom: 4px solid #cfcfcf;
 	          margin-top: 10px;
 	        }
 	      }
 	      .body {
 	        font-size: 12px;
 	        color: #666666;
 	        letter-spacing: 0;
 	        .bodyBox {
 	          margin-top: 15px;
 	          .names {
 	            font-size: 12px;
 	            color: #151515;
 	            letter-spacing: 0;
 	            text-align: justify;
 	            line-height: 17px;
 	            margin-left: 5px;
 	            margin-right: 10px;
 	          }
 	          text {
 	            font-size: 12px;
 	            color: #666666;
 	            letter-spacing: 0;
 	            text-align: justify;
 	          }
 	        }
 	      }
 	    .goods-form {
 	      display: flex;
 	      flex-direction: column;
 	      align-items: center;
 	      justify-content: center;
 	      background-color: #fff;
 	        width: 100%;
 	        padding: 40rpx 0;
 	      .p1 {
 	            font-size: 16px;
 	            color: #333333;
 	            letter-spacing: -0.3px;
 	            text-align: justify;
 	            line-height: 24px;
 	            margin: 4px 0;
 	        }
 	        .p2 {
 	            font-size: 12px;
 	            color: #999999;
 	            letter-spacing: -0.23px;
 	            margin-bottom: 32rpx;
 	        }
 	        .image2{
 	            width: 42rpx;
 	            height: 34rpx;
 	        margin-right: 12rpx;
 	        }
 	        .confirm {
 	            display: flex;
 	            align-items: center;
 	            font-size: 12px;
 	            color: #666666;
 	            letter-spacing: -0.23px;
 	            width: 684rpx;
 	            .image1{
 	                margin-right:25rpx;
 	          width: 42rpx;
 	          height: 38rpx;
 	            }
 	        }
 	        .picker{
 	      display: flex;
 	      flex-direction: column;
 	      justify-content: center;
 	      align-items: center;
 	      width: 100%;
 	      .picker-choice{
 	        display: flex;
 	        width: 684rpx;
 	        align-items: center;
 	            margin-bottom: 40rpx;
 	        .input{
 	          border-bottom: 1px solid #CFCFCF;
 	          height: 40rpx;
 	        }
 	        .choice-left{
 	          width: 210rpx;
 	          .pd{
 	            font-size: 14px;
 	            color: #333333;
 	            letter-spacing: -0.26px;
 	            text-align: justify;
 	            line-height: 24px;
 	            margin-right: 44rpx;
 	          }
 	          .p11 {
 	            font-size: 14px;
 	            color: #333333;
 	            letter-spacing: -0.26px;
 	            text-align: justify;
 	            line-height: 24px;
 	            // margin-right: 10px;
 	          }
 	          .p12 {
 	            font-size: 10px;
 	            color: #3F3F3F;
 	            letter-spacing: -0.19px;
 	            text-align: justify;
 	            line-height: 24px;
 	          }
 	        }
 	        .p13 {
 	          font-size: 10px;
 	          color: #999999;
 	          letter-spacing: -0.19px;
 	          margin-right: 10px;
 	        }
 	            .p13-date {
 	                font-size: 10px;
 	          color: #999999;
 	          letter-spacing: -0.19px;
 	          margin-right: 5px;
 	            }
 	        picker{
 	          width: 144rpx;
 	          height: 40rpx;
 	          display: flex;
 	          position: relative;
 	          .p14 {
 	            font-size: 14px;
 	            color: #666666;
 	            letter-spacing: -0.26px;
 	            text-align: center;
 	            width: 124rpx;
 	            border-bottom: 1px solid #CFCFCF;
 	            height: 38rpx;
 	          }
 	          image{
 	            width: 20rpx;
 	            height: 20rpx;
 	            position: absolute;
 	            right: 20rpx;
 	            top: 8rpx;
 	          }
 	        }
 	      }
 	    }
+		.ipts{
+			width: 100%;
+			display: flex;
+			flex-direction: column;
+			justify-content: center;
+			align-items: flex-start;
+			// padding: 20rpx 36rpx;
+			box-sizing: border-box;
+			.inputItem{
+				display: flex;
+				flex-direction: row;
+				justify-content: center;
+				align-items: center;
+				margin-bottom: 36rpx;
+				.text{
+					margin-right: 100rpx;
+				}
+				.input{
+					border-bottom: 1px solid #CFCFCF;
+				}
+			}
+		}
 	    }
 	    }
 	  }
 	  .choose {
 	    width: 100%;
 	    background: #ffffff;
 	    border-radius: 12rpx;
 	    margin-top: 20rpx;
 	    padding: 40rpx 40rpx 112rpx 40rpx;
 	    box-sizing: border-box;
 	    .chooseItem {
 	      width: 100%;
 	      padding-bottom: 32rpx;
 	      border-bottom: 1px solid #e9e9e9;
 	      margin-bottom: 28rpx;
 	    }
 	    .chooseRes {
 	      font-size: 12px;
 	      color: #666666;
 	    }
 	    .itemsWrap {
 	      display: flex;
 	      flex-direction: row;
 	      flex-wrap: wrap;
 	      justify-content: flex-start;
 	      align-items: center;
 	      padding-top: 24rpx;
 	      .item1 {
 	        width: 64rpx;
 	        height: 64rpx;
 	        border-radius: 32rpx;
 	        margin: 0 36rpx 24rpx 0;
 	        transition: all 0.3s;
 	        border: 1px solid #ffffff;
 	      }
 	      .item2 {
 	        // width: 100rpx;
 	        padding: 0 30rpx;
 	        height: 60rpx;
 	        margin: 0 20rpx 20rpx 0;
 	        transition: all 0.3s;
 	        background: #f2f2f2;
 	        border-radius: 2px;
 	        border-radius: 2px;
 	        line-height: 60rpx;
 	        text-align: center;
 	        color: #666666;
 	        font-size: 12px;
 	      }
 	      .active1 {
 	        opacity: 0.7;
 	        border: 1px solid #ff6b4a;
 	      }
 	      .active2 {
 	        background: rgba(255, 107, 74, 0.15);
 	        color: #ff6b4a;
 	      }
 	    }
 	  }
 	  .button {
 	    width: 100%;
 	    height: 112rpx;
 	    background-color: #ff6b4a;
 	    font-size: 16px;
 	    color: #ffffff;
 	    line-height: 112rpx;
 	    text-align: center;
 	    position: sticky;
 	    bottom: 0rpx;
 	    left: 0rpx;
+		z-index: 9999;
 	  }
 	}
 	/* sheet弹窗 */
 	.sheet{
 		width: 100%;
 		height: 100%;
 		position: fixed;
 		top: 150%;
 		left: 0upx;
 		bottom: 0upx;
 		right: 0upx;
 		background:rgba(0,0,0,0.3);
 		z-index: 10000;
 	}
 	/* 显示时候的动画默认0.5s */
 	.sheetView{
 		width: 100%;
 		height: 0upx;
 		position: absolute;
 		bottom: 0upx;
 		background: white;
 		z-index: 10001;
 		transition: all 0.5s;
 	}
 	.sheetShow{
 		top:0upx !important;
 	}
 	/* 关闭时的动画，时间自己可以设置0.5s*/
 	.sheeHide{
 		top:120% !important;
 		transition: all 0.5s;
 	}
 	/* 项目需求根据设计稿要展示的高度,超出这个高度就自动滚动*/
 	.sheetView_active{
 		height: 1042upx;
 	}
 </style>

src/pages.json

Diff comments View file @a196efb

 {
     "pages": [
         {
             "path": "pages/index/index",
             "style": {
                 "navigationBarTitleText": "商城一览"
             }
         },
         {
             "path": "pages/user/user",
             "style": {
                 "navigationBarTitleText": "我的"
             }
         },
         {
             "path": "pages/addOpticsData/addOpticsData",
             "style": {
                 "navigationBarTitleText": "验光数据"
             }
         },
         // {
         //     "path": "pages/detailsChoiceArgs/detailsChoiceArgs",
         //     "style": {
         //         "navigationBarTitleText": "镜片名称名称"
         //     }
         // },
         // {
         //     "path": "pages/purchaseLenses/purchaseLenses",
         //     "style": {
         //         "navigationBarTitleText": "参数选择"
         //     }
         // },
         // {
         //     "path": "pages/lensDetails/lensDetails",
         //     "style": {
         //         "navigationBarTitleText": "产品详情"
         //     }
         // },
         {
             "path": "pages/details/details",
             "style": {
                 "navigationBarTitleText": "产品详情"
             }
         },
         {
             "path": "pages/myOrderPaying/myOrderPaying",
             "style": {
                 "navigationBarTitleText": "我的订单"
             }
         },
         {
             "path": "pages/myOrder/myOrder",
             "style": {
                 "navigationBarTitleText": "我的订单"
             }
         },
         {
             "path": "pages/cart/cart",
             "style": {
                 "navigationBarTitleText": "购物车",
                 // "disableScroll":true,
                 "app-plus": {
                     "bounce": "none"
                 }
             }
         },
         // {
         //     "path": "pages/frameDetail/frameDetail",
         //     "style": {
         //         "navigationBarTitleText": "产品详情"
         //     }
         // },
         // {
         //     "path": "pages/refundProgress/refundProgress",
         //     "style": {
         //         "navigationBarTitleText": "申请退款"
         //     }
         // },
         {
             "path": "pages/address/addAddress",
             "style": {
                 "navigationBarTitleText": "新增地址"
             }
         },
         {
             "path": "pages/address/addressList",
             "style": {
                 "navigationBarTitleText": "地址管理"
             }
         },
         {
             "path": "pages/confirmOrder/confirmOrder",
             "style": {
                 "navigationBarTitleText": "确认订单"
             }
         },
         // {
         //     "path": "pages/refundment/refundWays",
         //     "style": {
         //         "navigationBarTitleText": "退款方式"
         //     }
         // },
         // {
         //     "path": "pages/refundment/refundment",
         //     "style": {
         //         "navigationBarTitleText": "申请退款"
         //     }
         // },
         {
             "path": "pages/predelivery/predelivery",
             "style": {
                 "navigationBarTitleText": "待发货"
             }
         },
         // {
         //     "path": "pages/customerService/customerService",
         //     "style": {
         //         "navigationBarTitleText": "在线客服"
         //     }
         // },
         // {
         //     "path": "pages/detailStandard/detailStandard_sun",
         //     "style": {
         //         "navigationBarTitleText": "太阳镜选购页"
         //     }
         // },
         // {
         //     "path": "pages/detailStandard/detailStandard_k",
         //     "style": {
         //         "navigationBarTitleText": "镜框选购页"
         //     }
         // },
         {
             "path": "pages/newOpticsData/newOpticsData",
             "style": {
                 "navigationBarTitleText": "验光数据"
             }
         }
     ],
     "subpackages": [
         {
             "root": "refundment",
             "pages": [
                 {
                     "path": "refundWays",
                     "style": {}
                 },
                 {
                     "path": "refundment",
                     "style": {}
                 },
                 {
                     "path": "/pages/refundProgress/refundProgress",
                     "style": {}
                 }
             ]
         },
         {
             "root": "address",
             "name": "pack2",
             "pages": [
                 {
                     "path": "addAddress",
                     "style": {}
                 },
                 {
                     "path": "addressList",
                     "style": {}
                 }
             ]
         }
         // {
         //     "root": "pages/myOrder",
         //     "name": "pack3",
         //     "pages": [
         //         {
         //             "path": "pages/myOrder/myOrder",
         //             "style": {}
         //         },
         //         {
         //             "path": "pages/myOrderPaying/myOrderPaying",
         //             "style": {}
         //         }
         //     ]
         // }
     ],
     "globalStyle": {
         "navigationBarTextStyle": "black",
         "navigationBarTitleText": "uni-app",
         "navigationBarBackgroundColor": "#F8F8F8",
         "backgroundColor": "#F8F8F8"
     },
     "tabBar": {
         "color": "#C0C4CC",
         "selectedColor": "#fa436a",
         "borderStyle": "black",
         "backgroundColor": "#ffffff",
         "list": [
             {
                 "pagePath": "pages/index/index",
                 "iconPath": "static/tab-home.png",
                 "selectedIconPath": "static/tab-home-current.png",
                 "text": "首页"
             },
             {
                 "pagePath": "pages/cart/cart",
                 "iconPath": "static/tab-cart.png",
                 "selectedIconPath": "static/tab-cart-current.png",
                 "text": "购物车"
             },
             {
                 "pagePath": "pages/user/user",
                 "iconPath": "static/tab-my.png",
                 "selectedIconPath": "static/tab-my-current.png",
                 "text": "我的"
             }
         ]
     },
     "condition": {
         "current": 0,
         "list": [
             // {
             //     "name": "首页",
             //     "path": "pages/test/index",
             //     "query": ""
             // },
             {
                 "name": "首页",
                 "path": "pages/index/index",
                 "query": ""
             },
             {
                 "name": "产品详情",
                 "path": "pages/details/details",
                 "query": ""
             },
             {
                 "name": "旧版产品详情",
                 "path": "pages/frameDetail/frameDetail",
                 "query": ""
             },
             {
                 "name": "镜片、美瞳参数选择",
                 "path": "pages/purchaseLenses/purchaseLenses",
                 "query": ""
             },
             {
                 "name": "确认订单",
                 "path": "pages/confirmOrder/confirmOrder",
                 "query": ""
             },
             {
                 "name": "新增地址",
                 "path": "pages/address/addAddress",
                 "query": ""
             },
             {
                 "name": "地址管理",
                 "path": "pages/address/addressList",
                 "query": ""
             },
             {
                 "name": "我的订单",
                 "path": "pages/myOrder/myOrder",
                 "query": ""
             },
             {
                 "name": "待付款订单详情",
                 "path": "pages/myOrderPaying/myOrderPaying",
                 "query": ""
             },
             {
                 "name": "我的",
                 "path": "pages/user/user",
                 "query": ""
-            }
+            },
+			{
+			    "name": "验光数据",
+			    "path": "pages/addOpticsData/addOpticsData",
+			    "query": ""
+			},
+			{
+			    "name": "新建验光数据",
+			    "path": "pages/newOpticsData/newOpticsData",
+			    "query": ""
+			}
         ]
     }
 }

src/pages/addOpticsData/addOpticsData.vue

Diff comments View file @a196efb

 <template>
 	<view class="wrap">
 		<!-- 弹窗 -->
 		<uni-popup ref="popup" type="center">
 			<!-- 给一个左边弹窗的样式 -->
 			<view class="popUpWrap" :class="{'popUpWrap1': whichTap == 0}">
 				<!-- 关闭弹窗按钮 -->
 				<view class="closeBtn" @click="this.$refs.popup.close()"></view>
 				<!-- 左 -->
 				<image class="glassInfo" src="../../static/img/myOpticsData/glassInfo.png" v-if="whichTap == 0" mode="aspectFit"></image>
 				<!-- 右 -->
 				<image class="dataInfo" src="../../static/img/myOpticsData/dataInfo.png" v-else mode="aspectFit"></image>
 			</view>
 		</uni-popup>
 		<!-- 点击弹窗部分 -->
 		<view class="header">
 			<view class="headerLeft" @click=changeTap(1)>
 				<text>如何查看验光单？</text>
 				<image src="../../static/dataLook.png" mode="aspectFit"></image>
 			</view>
 			<view class="headerRight" @click=changeTap(0)>
 				<text>如何查看眼镜框架？</text>
 				<image src="../../static/glassLook.png" mode="aspectFit"></image>
 			</view>
 		</view>
 		<!-- 数据展示部分 -->
 		<view class="dataMenu">
 			<uni-collapse accordion="true">
 				<view class="item" v-for="(loveItem,index) in loveList" :key="index" >
 					<uni-collapse-item :title='loveItem.name' :time='getRightTime(loveItem.in_time)' :iconText='getFirstName(loveItem.name)' showAnimation='true'>
 					    <view class="loveDataInfo" @click="toNewData(2,index)">
 							<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 class="dataInfoItem">
+								<text>镜片宽度：</text><text>{{loveItem.glassWidth!=='0'?loveItem.glassWidth:'暂无数据'}}</text>
+							</view>
+							<view class="dataInfoItem">
+								<text>鼻梁宽度：</text><text>{{loveItem.norseWidth!=='0'?loveItem.norseWidth:'暂无数据'}}</text>
+							</view>
+							<view class="dataInfoItem">
+								<text>镜腿长度：</text><text>{{loveItem.legWidth!=='0'?loveItem.legWidth:'暂无数据'}}</text>
+							</view>
 					    </view>
 					</uni-collapse-item>
 				</view>
 			</uni-collapse>
 		</view>
 		<view class="footer">
 			<button class="btn" type="default" @click="toNewData(1)">新建验光单</button>
 		</view>
 	</view>
 </template>
 <script>
 	import UniCollapse from '@/components/UniCollapse/UniCollapse.vue'
 	import UniCollapseItem from '@/components/UniCollapseItem/UniCollapseItem.vue'
 	import UniPopup from '@/components/UniPopup/uni-popup.vue'
 	import store from '@/store';
 	export default {
 		components: {UniCollapse,UniCollapseItem,UniPopup},
 		data() {
 			return {
 				whichTap:0
 			};
 		},
-		onLoad: function(option) {
+		onShow() {
 			//获取关心的人列表
 			store.dispatch('myLoveList/getLoveList', {
 				uid: this.$store.state.user.userInfo.uid,
 			});
 		},
+		onLoad: function(option) {
+			// //获取关心的人列表
+			// store.dispatch('myLoveList/getLoveList', {
+			// 	uid: this.$store.state.user.userInfo.uid,
+			// });
+		},
 		computed:{
 			loveList() {
 				console.log(this.$store.state.myLoveList.loveList)
 				return this.$store.state.myLoveList.loveList || []
 			},
 		},
 		methods:{
 			changeTap(item){
 				this.whichTap = item
 				this.$refs.popup.open()
 			},
 			//给时间搞一个nice的格式
 			getRightTime(time){
 				//如果小于10 则返回'0'+m
 				// 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)
 				// console.log(newTime)
 				// return newTime.replace(/-/g, '/')
 				return time
 			},
 			getFirstName(name){
 				return name.substring(0,1)
 			},
 			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
 				// }
 				uni.navigateTo({
 					// kinds 参数为 1 表示添加新的验光单， 2 表示更新验光单
 					// name 表示修改的人名儿，pd瞳距
 					url:'../newOpticsData/newOpticsData?kinds='+item+'&index='+index
 				})
 			}
 		}
 	}
 </script>
 <style lang="scss">
 	.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;
 			margin-bottom: 120rpx;
 			.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;
 			}
 		}
 	}
 	.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;
 	}
 </style>

src/pages/cart/cart.vue

Diff comments View file @a196efb

1	<template>	1	<template>
2	<view class="content">	2	<view class="content">
3	<block v-if="cartList.length==0">	3	<block v-if="cartList.length==0">
4		4
5	</block>	5	</block>
6	<block v-else>	6	<block v-else>
7	<view class="card">	7	<view class="card">
8	<view class="cardHeader">	8	<view class="cardHeader">
9	<view	9	<view
10	v-bind:class="pIsoPen? 'partentChecked' : 'partentCheck'"	10	v-bind:class="pIsoPen? 'partentChecked' : 'partentCheck'"
11	@click="pClick"	11	@click="pClick"
12	>	12	>
13	<span class="correct"></span>	13	<span class="correct"></span>
14	</view>	14	</view>
15	<image	15	<image
16	src="../../static/store.png"	16	src="../../static/store.png"
17	mode="aspectFill"	17	mode="aspectFill"
18	></image>	18	></image>
19	<text>非常戴镜</text>	19	<text>非常戴镜</text>
20	</view>	20	</view>
21	<view	21	<view
22	class="cardBody"	22	class="cardBody"
23	v-for="(item,index) in cartList"	23	v-for="(item,index) in cartList"
24	:key="index"	24	:key="index"
25	@longpress="delCart(item.cart_id,index)"	25	@longpress="delCart(item.cart_id,index)"
26	>	26	>
27	<view	27	<view
28	v-bind:class="cartList[index].isChecked? 'partentChecked':'partentCheck'"	28	v-bind:class="cartList[index].isChecked? 'partentChecked':'partentCheck'"
29	@click="childClick(cartList[index],index)"	29	@click="childClick(cartList[index],index)"
30	>	30	>
31	<span class="correct"></span>	31	<span class="correct"></span>
32	</view>	32	</view>
33	<view class="imageWrap">	33	<view class="imageWrap">
34	<image	34	<image
35	:src="item.img_index_url"	35	:src="item.img_index_url"
36	mode="aspectFit"	36	mode="aspectFit"
37	style="width: 188rpx;height: 168rpx;"	37	style="width: 188rpx;height: 168rpx;"
38	></image>	38	></image>
39	</view>	39	</view>
40	<view class="goodInfo">	40	<view class="goodInfo">
41	<!-- <view class="imageWrap">	41	<!-- <view class="imageWrap">
42	<image :src="item.img_index_url" mode="aspectFit" style="width: 188rpx;height: 168rpx;"></image>	42	<image :src="item.img_index_url" mode="aspectFit" style="width: 188rpx;height: 168rpx;"></image>
43	</view> -->	43	</view> -->
44	<view class="infoRight">	44	<view class="infoRight">
45	<view	45	<view
46	class="goodName"	46	class="goodName"
47	@tap="toGoods(item.pid,item.sk_id)"	47	@tap="toGoods(item.pid,item.sk_id)"
48	>{{item.p_name}}</view>	48	>{{item.p_name}}</view>
49	<view	49	<view
50	class="describ"	50	class="describ"
51	@click="showBottom(3,item.pid,item.sk_id,item.mp_id,item.cart_id,index)"	51	@click="showBottom(3,item.pid,item.sk_id,item.mp_id,item.cart_id,index)"
52	>	52	>
53	<view class="desL">	53	<view class="desL">
54	<view class="people">	54	<view class="people">
55	使用人：{{item.peopleName}}	55	使用人：{{item.peopleName}}
56	</view>	56	</view>
57	<view class="skuInfo">	57	<view class="skuInfo">
58	{{item.sku_name}}	58	{{item.sku_name}}
59	</view>	59	</view>
60	</view>	60	</view>
61	<view class="desR">	61	<view class="desR">
62	<image	62	<image
63	src="../../static/right.png"	63	src="../../static/right.png"
64	mode="aspectFit"	64	mode="aspectFit"
65	style="width: 18rpx;height: 18rpx;"	65	style="width: 18rpx;height: 18rpx;"
66	></image>	66	></image>
67	</view>	67	</view>
68	</view>	68	</view>
69	<view class="priceBox">	69	<view class="priceBox">
70	<view class="price">￥{{item.nowPrice*item.num}}</view>	70	<view class="price">￥{{item.nowPrice*item.num}}</view>
71	<text class="maxCount">(限购{{maxCount}}副)</text>	71	<text class="maxCount">(限购{{maxCount}}副)</text>
72	<view class="counter">	72	<view class="counter">
73	<view	73	<view
74	class="btn"	74	class="btn"
75	disabled="this.addDisabled"	75	disabled="this.addDisabled"
76	type="default"	76	type="default"
77	@tap="counter(index,false,item)"	77	@tap="counter(index,false,item)"
78	>-</view>	78	>-</view>
79	<text>{{item.num}}</text>	79	<text>{{item.num}}</text>
80	<view	80	<view
81	class="btn"	81	class="btn"
82	disabled="this.desDisabled"	82	disabled="this.desDisabled"
83	type="default"	83	type="default"
84	@tap="counter(index,true,item)"	84	@tap="counter(index,true,item)"
85	>+</view>	85	>+</view>
86	</view>	86	</view>
87	</view>	87	</view>
88	</view>	88	</view>
89	</view>	89	</view>
90	</view>	90	</view>
91	</view>	91	</view>
92	</block>	92	</block>
93	<view class="footer">	93	<view class="footer">
94	<view class="footerLeft">实付金额:<text>￥{{totalPrice}}</text></view>	94	<view class="footerLeft">实付金额:<text>￥{{totalPrice}}</text></view>
95	<view class="footerRight">	95	<view class="footerRight">
96	<view	96	<view
97	class="paybtn"	97	class="paybtn"
98	@click="toComfirmOrder"	98	@click="toComfirmOrder"
99	>立即结算</view>	99	>立即结算</view>
100	</view>	100	</view>
101	</view>	101	</view>
102	<BottomSheet	102	<BottomSheet
103	v-if="isShowBottom"	103	v-if="isShowBottom"
104	:isCart="isCart"	104	:isCart="isCart"
105	@addCart="addCart"	105	@addCart="addCart"
106	:sk_id="sk_id"	106	:sk_id="sk_id"
107	:propMpId="mp_id"	107	:propMpId="mp_id"
108	@chooseCartModi="chooseCartModi"	108	@chooseCartModi="chooseCartModi"
109	:cart_id="cart_id"	109	:cart_id="cart_id"
110	:index="cartIndex"	110	:index="cartIndex"
111	:pid="pid"	111	:pid="pid"
112	:goodInfo="goodInfo"	112	:goodInfo="goodInfo"
113	:isShowBottom="isShowBottom"	113	:isShowBottom="isShowBottom"
114	@closeBottom="closeBottom"	114	@closeBottom="closeBottom"
115	></BottomSheet>	115	></BottomSheet>
116	</view>	116	</view>
117	</template>	117	</template>
118		118
119	<script>	119	<script>
120		120
121	import store from '@/store'	121	import store from '@/store'
122	import BottomSheet from '../../components/BottomSheet/BottomSheet.vue'	122	import BottomSheet from '../../components/BottomSheet/BottomSheet.vue'
123	export default {	123	export default {
124	components: {	124	components: {
125	BottomSheet,	125	BottomSheet,
126	},	126	},
127	data() {	127	data() {
128	return {	128	return {
129	pid: Number,	129	pid: Number,
130	isCart: Number,	130	isCart: Number,
131	sk_id: String,	131	sk_id: String,
132	mp_id: String,	132	mp_id: String,
133	isShowBottom: false, // 底部弹窗开关	133	isShowBottom: false, // 底部弹窗开关
134	cart_id: Number,	134	cart_id: Number,
135	maxCount: 20,	135	maxCount: 20,
136	cartIndex: Number,	136	cartIndex: Number,
137	cartList: [],	137	cartList: [],
138	}	138	}
139	},	139	},
140	computed: {	140	computed: {
141	pIsoPen () {	141	pIsoPen () {
142	if (this.cartList.length > 0) {	142	if (this.cartList.length > 0) {
143	return !this.cartList.find(item => !item.isChecked)	143	return !this.cartList.find(item => !item.isChecked)
144	}	144	}
145	return false	145	return false
146	},	146	},
147	goodInfo () {	147	goodInfo () {
148	return this.$store.state.read.goodInfo	148	return this.$store.state.read.goodInfo
149	},	149	},
150	totalPrice() {	150	totalPrice() {
151	let totalPrice = 0	151	let totalPrice = 0
152	this.cartList.forEach((item) => {	152	this.cartList.forEach((item) => {
153	if (item.isChecked) {	153	if (item.isChecked) {
154	totalPrice += item.nowPrice * item.num	154	totalPrice += item.nowPrice * item.num
155	}	155	}
156	})	156	})
157	return totalPrice	157	return totalPrice
158	},	158	},
159	},	159	},
160	onShow() {	160	onShow() {
161	await this.$store.dispatch('cart/getCartList', {	161	await this.$store.dispatch('cart/getCartList', {
162	uid: this.$store.state.user.userInfo.uid, // 用户id	162	uid: this.$store.state.user.userInfo.uid, // 用户id
163	})	163	})
164		164
165	this.cartList = this.$store.state.cart.cartList	165	this.cartList = this.$store.state.cart.cartList
166	this.cartList.forEach((item) => {	166	this.cartList.forEach((item) => {
167	item.isChecked = false	167	item.isChecked = false
168	})	168	})
169	},	169	},
170	onLoad: async function() {	170	onLoad: async function() {
171	},	171	},
172	methods: {	172	methods: {
173	// 全选按钮	173	// 全选按钮
174	pClick() {	174	pClick() {
175	const pStatus = !this.cartList.find(item => !item.isChecked)	175	const pStatus = !this.cartList.find(item => !item.isChecked)
176	const oldList = this.cartList	176	const oldList = this.cartList
177	oldList.forEach((item, index) => {	177	oldList.forEach((item, index) => {
178	item.isChecked = !pStatus	178	item.isChecked = !pStatus
179	this.cartList.splice(index, 1, item)	179	this.cartList.splice(index, 1, item)
180	})	180	})
181	},	181	},
182	// 单选按钮	182	// 单选按钮
183	childClick(type, index) {	183	childClick(type, index) {
184	this.cartList[index].isChecked = !this.cartList[index].isChecked	184	this.cartList[index].isChecked = !this.cartList[index].isChecked
185	// vue没有办法监听数组内部值的变化，所以需要通过这个方法去触发	185	// vue没有办法监听数组内部值的变化，所以需要通过这个方法去触发
186	this.cartList.splice(index, 1, this.cartList[index])	186	this.cartList.splice(index, 1, this.cartList[index])
187	},	187	},
188	// 修改购物车	188	// 修改购物车
189	chooseCartModi(mp_id, sk_id, price, pid, num, cart_id, index) {	189	chooseCartModi(mp_id, sk_id, price, pid, num, cart_id, index) {
190	// console.log('modi',mp_id,sk_id,price,pid,num,cart_id)	190	// console.log('modi',mp_id,sk_id,price,pid,num,cart_id)
191	store.dispatch('cart/modiCart', {	191	store.dispatch('cart/modiCart', {
192	uid: this.$store.state.user.userInfo.uid,	192	uid: this.$store.state.user.userInfo.uid,
193	openid: this.$store.state.user.userInfo.openid,	193	openid: this.$store.state.user.userInfo.openid,
194	mp_id: mp_id,	194	mp_id: mp_id,
195	sk_id: sk_id,	195	sk_id: sk_id,
196	price: price,	196	price: price,
197	pid: pid,	197	pid: pid,
198	num: num,	198	num: num,
199	cart_id: cart_id,	199	cart_id: cart_id,
200	args: {	200	args: {
201	index: index,	201	index: index,
202	},	202	},
203	})	203	})
204	this.$nextTick(function() {	204	this.$nextTick(function() {
205	store.dispatch('cart/getCartList', {	205	store.dispatch('cart/getCartList', {
206	uid: this.$store.state.user.userInfo.uid, // 用户id	206	uid: this.$store.state.user.userInfo.uid, // 用户id
207	}).then(() => {	207	}).then(() => {
208	this.cartList = this.$store.state.cart.cartList	208	this.cartList = this.$store.state.cart.cartList
209	})	209	})
210	})	210	})
211	},	211	},
212	// 底部弹窗开关	212	// 底部弹窗开关
213	showBottom(isCart, pid, skId, mp_id, cart_id, index) {	213	showBottom(isCart, pid, skId, mp_id, cart_id, index) {
214	store.dispatch('read/fetch', {	214	store.dispatch('read/fetch', {
215	pid,	215	pid,
216	sk_id: skId,	216	sk_id: skId,
217	}).then(() => {	217	}).then(() => {
218	this.cartIndex = index	218	this.cartIndex = index
219	this.sk_id = skId	219	this.sk_id = skId
220	this.pid = pid	220	this.pid = pid
221	this.mp_id = mp_id	221	this.mp_id = mp_id
222	this.isCart = isCart	222	this.isCart = isCart
223	this.cart_id = cart_id	223	this.cart_id = cart_id
224	this.isShowBottom = true	224	this.isShowBottom = true
225	})	225	})
226	},	226	},
227	closeBottom() {	227	closeBottom() {
228	this.isShowBottom = false	228	this.isShowBottom = false
229	},	229	},
230	toGoods(id, skId) {	230	toGoods(id, skId) {
231	uni.navigateTo({	231	uni.navigateTo({
232	url: '../details/details?pid=' + id + '&sk_id=' + skId,	232	url: '../details/details?pid=' + id + '&sk_id=' + skId,
233	success: res => {},	233	success: res => {},
234	fail: () => {},	234	fail: () => {},
235	complete: () => {},	235	complete: () => {},
236	})	236	})
237	},	237	},
238	toComfirmOrder() {	238
		239	toComfirmOrder() {
239	this.$store.state.cart.checkedCartLst = this.cartList.filter(item => item.isChecked)	240	this.$store.state.cart.checkedCartLst = this.cartList.filter(item => item.isChecked)
240	if (this.$store.state.cart.checkedCartLst.length > 0) {	241	if (this.$store.state.cart.checkedCartLst.length > 0) {
241	uni.navigateTo({	242	uni.navigateTo({
242	url: '../confirmOrder/confirmOrder?isCart=true',	243	url: '../confirmOrder/confirmOrder?isCart=true',
243	})	244	})
244	} else {	245	} else {
245	uni.showToast({	246	uni.showToast({
246	title: '您还没有选择宝贝哦~',	247	title: '您还没有选择宝贝哦~',
247	icon: 'none',	248	icon: 'none',
248	})	249	})
249	}	250	}
250	},	251	},
251	counter(index, isadd, item) {	252	counter(index, isadd, item) {
252	// console.log('item=====>', item)	253	// console.log('item=====>', item)
253	// console.log('num=====>', item.num)	254	// console.log('num=====>', item.num)
254	const nums = parseInt(item.num)	255	const nums = parseInt(item.num)
255	if (isadd) {	256	if (isadd) {
256	if (nums >= this.maxCount) {	257	if (nums >= this.maxCount) {
257	this.addDisabled = true	258	this.addDisabled = true
258	} else {	259	} else {
259	this.addDisabled = true	260	this.addDisabled = true
260	store.dispatch('cart/modiCart', {	261	store.dispatch('cart/modiCart', {
261	uid: this.$store.state.user.userInfo.uid,	262	uid: this.$store.state.user.userInfo.uid,
262	openid: this.$store.state.user.userInfo.openid,	263	openid: this.$store.state.user.userInfo.openid,
263	mp_id: item.mp_id,	264	mp_id: item.mp_id,
264	sk_id: item.sk_id,	265	sk_id: item.sk_id,
265	price: item.nowPrice,	266	price: item.nowPrice,
266	pid: item.pid,	267	pid: item.pid,
267	num: nums + 1,	268	num: nums + 1,
268	cart_id: item.cart_id,	269	cart_id: item.cart_id,
269	args: {	270	args: {
270	index: index,	271	index: index,
271	isadd: isadd,	272	isadd: isadd,
272	},	273	},
273	})	274	})
274	this.addDisabled = false	275	this.addDisabled = false
275	}	276	}
276	} else {	277	} else {
277	if (nums <= 1) {	278	if (nums <= 1) {
278	this.desDisabled = true	279	this.desDisabled = true
279	} else {	280	} else {
280	this.desDisabled = false	281	this.desDisabled = false
281		282
282	store.dispatch('cart/modiCart', {	283	store.dispatch('cart/modiCart', {
283	uid: this.$store.state.user.userInfo.uid,	284	uid: this.$store.state.user.userInfo.uid,
284	openid: this.$store.state.user.userInfo.openid,	285	openid: this.$store.state.user.userInfo.openid,
285	mp_id: item.mp_id,	286	mp_id: item.mp_id,
286	sk_id: item.sk_id,	287	sk_id: item.sk_id,
287	price: item.nowPrice,	288	price: item.nowPrice,
288	pid: item.pid,	289	pid: item.pid,
289	num: nums - 1,	290	num: nums - 1,
290	cart_id: item.cart_id,	291	cart_id: item.cart_id,
291	args: {	292	args: {
292	index: index,	293	index: index,
293	isadd: isadd,	294	isadd: isadd,
294	},	295	},
295	})	296	})
296	this.desDisabled = true	297	this.desDisabled = true
297	}	298	}
298	}	299	}
299	},	300	},
300	delCart(cart_id, index) {	301	delCart(cart_id, index) {
301	cart_id = parseInt(cart_id)	302	cart_id = parseInt(cart_id)
302	uni.showModal({	303	uni.showModal({
303	title: '是否删除该商品',	304	title: '是否删除该商品',
304	success: function (res) {	305	success: function (res) {
305	if (res.confirm) {	306	if (res.confirm) {
306	store.dispatch('cart/delCart', {	307	store.dispatch('cart/delCart', {
307	uid: this.$store.state.user.userInfo.uid,	308	uid: this.$store.state.user.userInfo.uid,
308	openid: this.$store.state.user.userInfo.openid,	309	openid: this.$store.state.user.userInfo.openid,
309	cart_id: cart_id, // 要修改的购物车id	310	cart_id: cart_id, // 要修改的购物车id
310	arg: index, // 由于action 传参是能接收两参数，因此将index放入对象	311	arg: index, // 由于action 传参是能接收两参数，因此将index放入对象
311	})	312	})
312	}	313	}
313	}.bind(this),	314	}.bind(this),
314	})	315	})
315	// this.cartList.splice(index,1)	316	// this.cartList.splice(index,1)
316	},	317	},
317	},	318	},
318	}	319	}
319	</script>	320	</script>
320		321
321	<style lang="scss">	322	<style lang="scss">
322	.content {	323	.content {
323	min-height: 100vh;	324	min-height: 100vh;
324	background-color: #f2f2f2;	325	background-color: #f2f2f2;
325	display: flex;	326	display: flex;
326	flex-direction: column;	327	flex-direction: column;
327	align-items: center;	328	align-items: center;
328	justify-content: space-between;	329	justify-content: space-between;
329	padding: 20rpx 40rpx;	330	padding: 20rpx 40rpx;
330	box-sizing: border-box;	331	box-sizing: border-box;
331		332
332	.partentCheck {	333	.partentCheck {
333	width: 16px;	334	width: 16px;
334	height: 16px;	335	height: 16px;
335	border-radius: 22px;	336	border-radius: 22px;
336	border: 1px solid #cfcfcf;	337	border: 1px solid #cfcfcf;
337	background-color: #ffffff;	338	background-color: #ffffff;
338	margin: 24rpx 12rpx 24rpx 24rpx;	339	margin: 24rpx 12rpx 24rpx 24rpx;
339	}	340	}
340	.partentChecked {	341	.partentChecked {
341	width: 18px;	342	width: 18px;
342	height: 18px;	343	height: 18px;
343	border-radius: 22px;	344	border-radius: 22px;
344	background-color: #ff6b4a;	345	background-color: #ff6b4a;
345	margin: 24rpx 12rpx 24rpx 24rpx;	346	margin: 24rpx 12rpx 24rpx 24rpx;
346	.correct {	347	.correct {
347	display: inline-block;	348	display: inline-block;
348	position: relative;	349	position: relative;
349	width: 10rpx;	350	width: 10rpx;
350	height: 2rpx;	351	height: 2rpx;
351	background: #ffffff;	352	background: #ffffff;
352	line-height: 0;	353	line-height: 0;
353	font-size: 0;	354	font-size: 0;
354	position: relative;	355	position: relative;
355	top: -7px;	356	top: -7px;
356	left: 4px;	357	left: 4px;
357	-webkit-transform: rotate(45deg);	358	-webkit-transform: rotate(45deg);
358	}	359	}
359	.correct:after {	360	.correct:after {
360	content: "/";	361	content: "/";
361	display: block;	362	display: block;
362	width: 16rpx;	363	width: 16rpx;
363	height: 2rpx;	364	height: 2rpx;
364	background: #ffffff;	365	background: #ffffff;
365	-webkit-transform: rotate(-90deg) translateY(50%) translateX(50%);	366	-webkit-transform: rotate(-90deg) translateY(50%) translateX(50%);
366	}	367	}
367	}	368	}
368		369
369	.card {	370	.card {
370	background-color: #ffffff;	371	background-color: #ffffff;
371	border-radius: 16rpx;	372	border-radius: 16rpx;
372	box-sizing: border-box;	373	box-sizing: border-box;
373	padding: 36rpx 36rpx 36rpx 18rpx;	374	padding: 36rpx 36rpx 36rpx 18rpx;
374	display: flex;	375	display: flex;
375	flex-direction: column;	376	flex-direction: column;
376	align-items: center;	377	align-items: center;
377	justify-content: space-between;	378	justify-content: space-between;
378	margin-bottom: 180rpx;	379	margin-bottom: 180rpx;
379	.cardHeader {	380	.cardHeader {
380	width: 100%;	381	width: 100%;
381	height: 36rpx;	382	height: 36rpx;
382	display: flex;	383	display: flex;
383	align-items: center;	384	align-items: center;
384	justify-content: flex-start;	385	justify-content: flex-start;
385	margin-bottom: 20rpx;	386	margin-bottom: 20rpx;
386	image {	387	image {
387	height: 32rpx;	388	height: 32rpx;
388	width: 32rpx;	389	width: 32rpx;
389	padding-left: 6px;	390	padding-left: 6px;
390	padding-right: 10px;	391	padding-right: 10px;
391	}	392	}
392	text {	393	text {
393	// font-family: PingFangSC-Regular;	394	// font-family: PingFangSC-Regular;
394	font-size: 14px;	395	font-size: 14px;
395	color: #333333;	396	color: #333333;
396	letter-spacing: -0.26px;	397	letter-spacing: -0.26px;
397	}	398	}
398	}	399	}
399	.cardBody {	400	.cardBody {
400	width: 100%;	401	width: 100%;
401	min-height: 300rpx;	402	min-height: 300rpx;
402	display: flex;	403	display: flex;
403	align-items: center;	404	align-items: center;
404	justify-content: space-between;	405	justify-content: space-between;
405	.goodInfo {	406	.goodInfo {
406	width: 390rpx;	407	width: 390rpx;
407	display: flex;	408	display: flex;
408	flex-direction: row;	409	flex-direction: row;
409	justify-content: flex-start;	410	justify-content: flex-start;
410	padding-left: 6px;	411	padding-left: 6px;
411		412
412	.imageWrap {	413	.imageWrap {
413	height: 188rpx;	414	height: 188rpx;
414	width: 188rpx;	415	width: 188rpx;
415	margin-right: 28rpx;	416	margin-right: 28rpx;
416		417
417	image {	418	image {
418	border-radius: 4px;	419	border-radius: 4px;
419	height: 188rpx;	420	height: 188rpx;
420	width: 188rpx;	421	width: 188rpx;
421	}	422	}
422	}	423	}
423	.infoRight {	424	.infoRight {
424	display: flex;	425	display: flex;
425	flex-direction: column;	426	flex-direction: column;
426	align-items: flex-start;	427	align-items: flex-start;
427	justify-content: space-between;	428	justify-content: space-between;
428	min-height: 240rpx;	429	min-height: 240rpx;
429	width: 100%;	430	width: 100%;
430	.goodName {	431	.goodName {
431	display: -webkit-box;	432	display: -webkit-box;
432	-webkit-box-orient: vertical;	433	-webkit-box-orient: vertical;
433	-webkit-line-clamp: 2;	434	-webkit-line-clamp: 2;
434	text-align: justify;	435	text-align: justify;
435	overflow: hidden;	436	overflow: hidden;
436	font-size: 28rpx;	437	font-size: 28rpx;
437	color: #333333;	438	color: #333333;
438	}	439	}
439	.describ {	440	.describ {
440	width: 100%;	441	width: 100%;
441	min-height: 80rpx;	442	min-height: 80rpx;
442	background: #f9f9f9;	443	background: #f9f9f9;
443	border-radius: 2px;	444	border-radius: 2px;
444	box-sizing: border-box;	445	box-sizing: border-box;
445	padding: 10rpx;	446	padding: 10rpx;
446	font-size: 20rpx;	447	font-size: 20rpx;
447	letter-spacing: -0.23px;	448	letter-spacing: -0.23px;
448	color: #999999;	449	color: #999999;
449	display: flex;	450	display: flex;
450	justify-content: space-between;	451	justify-content: space-between;
451	align-items: center;	452	align-items: center;
452	.desL {	453	.desL {
453	view {	454	view {
454	margin: 10rpx 0 10rpx 0;	455	margin: 10rpx 0 10rpx 0;
455	}	456	}
456	}	457	}
457	}	458	}
458	.priceBox {	459	.priceBox {
459	display: flex;	460	display: flex;
460	justify-content: space-between;	461	justify-content: space-between;
461	align-items: center;	462	align-items: center;
462	// margin-top: 26px;	463	// margin-top: 26px;
463	width: 100%;	464	width: 100%;
464	font-size: 14px;	465	font-size: 14px;
465	color: #999999;	466	color: #999999;
466	.maxCount {	467	.maxCount {
467	color: #999999;	468	color: #999999;
468	font-size: 20rpx;	469	font-size: 20rpx;
469	}	470	}
470	.price {	471	.price {
471	color: #ff6b4a;	472	color: #ff6b4a;
472	font-size: 28rpx;	473	font-size: 28rpx;
473	}	474	}
474	.counter {	475	.counter {
475	display: flex;	476	display: flex;
476	flex-direction: row;	477	flex-direction: row;
477	justify-content: space-between;	478	justify-content: space-between;
478	align-items: center;	479	align-items: center;
479	font-size: 28rpx;	480	font-size: 28rpx;
480	color: #333333;	481	color: #333333;
481	width: 122rpx;	482	width: 122rpx;
482	.btn {	483	.btn {
483	display: flex;	484	display: flex;
484	justify-content: center;	485	justify-content: center;
485	line-height: 32rpx;	486	line-height: 32rpx;
486	height: 32rpx;	487	height: 32rpx;
487	width: 32rpx;	488	width: 32rpx;
488	background-color: #f2f2f2;	489	background-color: #f2f2f2;
489	color: #cfcfcf;	490	color: #cfcfcf;
490	}	491	}
491	}	492	}
492	}	493	}
493	}	494	}
494	}	495	}
495	}	496	}
496	}	497	}
497	.footer {	498	.footer {
498	position: fixed;	499	position: fixed;
499	left: 0;	500	left: 0;
500	bottom: 0px;	501	bottom: 0px;
501	height: 112rpx;	502	height: 112rpx;
502	width: 100%;	503	width: 100%;
503	background-color: #ffffff;	504	background-color: #ffffff;
504	font-size: 16px;	505	font-size: 16px;
505	display: flex;	506	display: flex;
506	justify-content: space-between;	507	justify-content: space-between;
507	align-items: center;	508	align-items: center;
508	.footerLeft {	509	.footerLeft {
509	display: flex;	510	display: flex;
510	justify-content: center;	511	justify-content: center;
511	align-items: center;	512	align-items: center;
512	width: 50%;	513	width: 50%;
513	color: #333333;	514	color: #333333;
514	text {	515	text {
515	color: #ff6b4a;	516	color: #ff6b4a;
516	}	517	}
517	}	518	}
518	.footerRight {	519	.footerRight {
519	display: flex;	520	display: flex;
520	justify-content: flex-end;	521	justify-content: flex-end;
521	align-items: center;	522	align-items: center;
522	width: 50%;	523	width: 50%;
523	margin-right: 26rpx;	524	margin-right: 26rpx;
524	.paybtn {	525	.paybtn {
525	display: flex;	526	display: flex;
526	justify-content: center;	527	justify-content: center;
527	align-items: center;	528	align-items: center;
528	background: #ff6b4a;	529	background: #ff6b4a;
529	border-radius: 20px;	530	border-radius: 20px;
530	border-radius: 20px;	531	border-radius: 20px;
531	color: #ffffff;	532	color: #ffffff;
532	width: 204rpx;	533	width: 204rpx;
533	height: 80rpx;	534	height: 80rpx;
534	}	535	}
535	}	536	}
536	}	537	}
537	}	538	}
538	/* 隐藏滚动条 */	539	/* 隐藏滚动条 */
539	::-webkit-scrollbar {	540	::-webkit-scrollbar {
540	width: 0;	541	width: 0;
541	height: 0;	542	height: 0;
542	color: transparent;	543	color: transparent;
543	}	544	}
544	</style>	545	</style>
545		546

src/pages/myOrder/myOrder.vue

Diff comments View file @a196efb

1	<template>	1	<template>
2	<view class="content">	2	<view class="content">
3	<view class="header">	3	<view class="header">
4	<!-- 搜索-->	4	<!-- 搜索-->
5	<!-- <view class="searchBar">	5	<!-- <view class="searchBar">
6	<icon class="searchIcon" type="search" size="14"></icon>	6	<icon class="searchIcon" type="search" size="14"></icon>
7	<input class="searchIpt" placeholder="搜索订单关键字..." confirm-type="search"/>	7	<input class="searchIpt" placeholder="搜索订单关键字..." confirm-type="search"/>
8	</view> -->	8	</view> -->
9	<view class="screenBar">	9	<view class="screenBar">
10	<view	10	<view
11	v-for="item in screenItems"	11	v-for="item in screenItems"
12	:key="item.current"	12	:key="item.current"
13	@click="onClickItem(item.current)"	13	@click="onClickItem(item.current)"
14	>	14	>
15	<view	15	<view
16	class="screenItem"	16	class="screenItem"
17	v-bind:class="{ active: current === item.current }"	17	v-bind:class="{ active: current === item.current }"
18	>{{ item.text }}</view>	18	>{{ item.text }}</view>
19	</view>	19	</view>
20	</view>	20	</view>
21	</view>	21	</view>
22	<view class="orderList">	22	<view class="orderList">
23	<view	23	<view
24	v-for="(order) in orderList"	24	v-for="(order) in orderList"
25	:key="order.pay_id"	25	:key="order.pay_id"
26	>	26	>
27	<OrderCard	27	<OrderCard
28	:order="order"	28	:order="order"
29	:current="current"	29	:current="current"
30	></OrderCard>	30	></OrderCard>
31	</view>	31	</view>
32	</view>	32	</view>
33	<view class="footer">没有更多订单了，去商城看看吧~</view>	33	<view class="footer">没有更多订单了，去商城看看吧~</view>
34	</view>	34	</view>
35	</template>	35	</template>
36	<script>	36	<script>
37	import OrderCard from "./components/OrderCard.vue";	37	import OrderCard from "./components/OrderCard.vue";
38	import store from "@/store";	38	import store from "@/store";
39		39
40	export default {	40	export default {
41	components: {	41	components: {
42	OrderCard: OrderCard	42	OrderCard: OrderCard
43	},	43	},
44	data() {	44	data() {
45	return {	45	return {
46	// 顶部筛选项	46	// 顶部筛选项
47	screenItems: [	47	screenItems: [
48	{ current: "10", text: "全部" },	48	{ current: "10", text: "全部" },
49	{ current: "0", text: "待付款" },	49	{ current: "0", text: "待付款" },
50	{ current: "1", text: "待收货" },	50	{ current: "1", text: "待收货" },
51	{ current: "2", text: "已完成" }	51	{ current: "2", text: "已完成" }
52	// {current:"3",text:'已评价'},	52	// {current:"3",text:'已评价'},
53	// {current:"4",text:'退款'},	53	// {current:"4",text:'退款'},
54	],	54	],
55	// 当前所在item 默认10-->全部	55	// 当前所在item 默认10-->全部
56	current: "10"	56	current: "10"
57	};	57	};
58	},	58	},
59		59
60	onShow() {	60	onShow() {
61	store.dispatch("myOrder/getList", {	61	store.dispatch("myOrder/getList", {
62	way: ""	62	way: ""
63	});	63	});
64	},	64	},
65	onLoad: function(option) {	65	onLoad: function(option) {
66	// 获取订单列表	66	// 获取订单列表
67	// store.dispatch("myOrder/getList", {	67	// store.dispatch("myOrder/getList", {
68	// way: ""	68	// way: ""
69	// });	69	// });
70	// 从user过来传的status，给current，以显示对应item	70	// 从user过来传的status，给current，以显示对应item
71	this.current = option.status;	71	this.current = option.status;
72	},	72	},
73	computed: {	73	computed: {
74	orderList() {	74	orderList() {
75	// console.log('orderList', this.$store.state.myOrder.orderList);	75	console.log('orderList', this.$store.state.myOrder.orderList);
76	return this.$store.state.myOrder.orderList;	76	return this.$store.state.myOrder.orderList;
77	}	77	}
78	},	78	},
79	methods: {	79	methods: {
80	// tab点击事件	80	// tab点击事件
81	onClickItem(e) {	81	onClickItem(e) {
82	if (this.current !== e) {	82	if (this.current !== e) {
83	this.current = e;	83	this.current = e;
84	}	84	}
85	}	85	}
86	}	86	}
87	};	87	};
88	</script>	88	</script>
89		89
90	<style lang="scss">	90	<style lang="scss">
91	.content {	91	.content {
92	display: flex;	92	display: flex;
93	flex-direction: column;	93	flex-direction: column;
94	align-items: center;	94	align-items: center;
95	background-color: #f7f6f6;	95	background-color: #f7f6f6;
96	min-height: 100vh;	96	min-height: 100vh;
97	.header {	97	.header {
98	background-color: #ffffff;	98	background-color: #ffffff;
99	width: 100%;	99	width: 100%;
100	// height: 232rpx;	100	// height: 232rpx;
101	padding: 20rpx 40rpx 16rpx 40rpx;	101	padding: 20rpx 40rpx 16rpx 40rpx;
102	box-sizing: border-box;	102	box-sizing: border-box;
103	position: fixed;	103	position: fixed;
104	top: 0;	104	top: 0;
105	left: 0;	105	left: 0;
106	// .searchBar {	106	// .searchBar {
107	// width: 670rpx;	107	// width: 670rpx;
108	// display: flex;	108	// display: flex;
109	// justify-content: center;	109	// justify-content: center;
110	// align-items: center;	110	// align-items: center;
111	// box-sizing: border-box;	111	// box-sizing: border-box;
112	// padding: 0rpx 16rpx;	112	// padding: 0rpx 16rpx;
113	// border: 1px solid #ff6b4a;	113	// border: 1px solid #ff6b4a;
114	// border-radius: 8rpx;	114	// border-radius: 8rpx;
115	// background-color: #ffffff;	115	// background-color: #ffffff;
116	// }	116	// }
117		117
118	.screenBar {	118	.screenBar {
119	width: 670rpx;	119	width: 670rpx;
120	// height: 110rpx;	120	// height: 110rpx;
121	height: 70rpx;	121	height: 70rpx;
122	display: flex;	122	display: flex;
123	flex-direction: row;	123	flex-direction: row;
124	justify-content: space-between;	124	justify-content: space-between;
125	align-items: center;	125	align-items: center;
126	color: #333333;	126	color: #333333;
127	font-size: 32rpx;	127	font-size: 32rpx;
128	}	128	}
129	.screenItem {	129	.screenItem {
130	height: 50rpx;	130	height: 50rpx;
131	font-size: 32rpx;	131	font-size: 32rpx;
132	color: #333333;	132	color: #333333;
133	display: flex;	133	display: flex;
134	justify-content: center;	134	justify-content: center;
135	align-items: center;	135	align-items: center;
136	transition: all 0.2s;	136	transition: all 0.2s;
137	}	137	}
138	.active {	138	.active {
139	// font-size: 34rpx;	139	// font-size: 34rpx;
140	color: #ec5d3b;	140	color: #ec5d3b;
141	}	141	}
142	.searchIpt {	142	.searchIpt {
143	height: 68rpx;	143	height: 68rpx;
144	width: 670rpx;	144	width: 670rpx;
145	padding: 16rpx;	145	padding: 16rpx;
146	font-size: 28rpx;	146	font-size: 28rpx;
147	box-sizing: border-box;	147	box-sizing: border-box;
148	}	148	}
149	}	149	}
150	.orderList {	150	.orderList {
151	// margin-top: 232rpx;	151	// margin-top: 232rpx;
152	margin-top: 132rpx;	152	margin-top: 132rpx;
153	}	153	}
154	.footer {	154	.footer {
155	font-size: 14px;	155	font-size: 14px;
156	color: #b8b8b8;	156	color: #b8b8b8;
157	margin: 40rpx 0;	157	margin: 40rpx 0;
158	}	158	}
159	}	159	}
160	</style>	160	</style>
161		161

src/pages/newOpticsData/newOpticsData.vue

Diff comments View file @a196efb

 <template>
 	<view class="wrap">
 		<view class="body">
 			<template >
 				<view class="goods-form">
 					<view class="p1">
 						<image class="image2" src="../../static/img/myOpticsData/dataWrite.png" mode="aspectFit"></image>
 						填写验光数据
 					</view>
 					<text class="p2">没有验光数据？请到线下眼镜店验光哦～</text>
 					<view class="picker">
 						<view class="picker-choice">
 							<view class="choice-left">
 								<text class="pd">验光单取名:</text>
 							</view>
 							<input type="text" @change="handleInput" class="input"
 							placeholder="请输入名称" maxlength="20" :value="name" />
 						</view>
 					</view>
 					<view class="picker" >
 						<view class="picker-choice">
 							<view class="choice-left">
 								<text class="p11">{{pickerInfoList[0].nameC}}</text>
 								<text class="p12">{{pickerInfoList[0].nameE}}</text>
 							</view>
 							<text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
 							<!-- <text class="p14">{{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}</text> -->
 							<picker  @change="bindPickerChange01" :value="pickerInfoList[0].nameIndex1" :range="pickerInfoList[0].nameArray1">
 								<view class="p14">
 								{{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}
 								<image src="../../static/detail-tabicon.png" ></image>
 								</view>
 								<!-- <image src="../../static/detail-tabicon.png" ></image> -->
 							</picker>
 							<text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
 							<!-- <text class="p14">{{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}</text> -->
 							<picker @change="bindPickerChange02" :value="pickerInfoList[0].nameIndex2" :range="pickerInfoList[0].nameArray2">
 								<view class="p14">
 								{{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}
 								<image src="../../static/detail-tabicon.png" ></image>
 								</view>
 								<!-- <image src="../../static/detail-tabicon.png" ></image> -->
 							</picker>
 						</view>
 					</view>
 					<view class="picker" >
 						<view class="picker-choice">
 							<view class="choice-left">
 								<text class="p11">{{pickerInfoList[1].nameC}}</text>
 								<text class="p12">{{pickerInfoList[1].nameE}}</text>
 							</view>
 							<text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
 							<!-- <text class="p14">{{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}</text> -->
 							<picker @change="bindPickerChange11" :value="pickerInfoList[1].nameIndex1" :range="pickerInfoList[1].nameArray1">
 								<view class="p14">
 									{{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}
 									<image src="../../static/detail-tabicon.png" ></image>
 								</view>
 								<!-- <image src="../../static/detail-tabicon.png" ></image> -->
 							</picker>
 							<text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
 							<!-- <text class="p14">{{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}</text> -->
 							<picker @change="bindPickerChange12" :value="pickerInfoList[1].nameIndex2" :range="pickerInfoList[1].nameArray2">
 								<view class="p14">
 									{{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}
 									<image src="../../static/detail-tabicon.png" ></image>
 								</view>
 								<!-- <image src="../../static/detail-tabicon.png" ></image> -->
 							</picker>
 						</view>
 					</view>
 					<view class="picker" >
 						<view class="picker-choice">
 							<view class="choice-left">
 								<text class="p11">{{pickerInfoList[2].nameC}}</text>
 								<text class="p12">{{pickerInfoList[2].nameE}}</text>
 							</view>
 							<text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
 							<picker @change="bindPickerChange21" :value="pickerInfoList[2].nameIndex1" :range="pickerInfoList[2].nameArray1">
 								<view class="p14">
 									{{pickerInfoList[2].nameArray1[pickerInfoList[2].nameIndex1]}}
 									<image src="../../static/detail-tabicon.png" ></image>
 								</view>
 							</picker>
 							<text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
 							<!-- <text class="p14">{{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}</text> -->
 							<picker @change="bindPickerChange22" :value="pickerInfoList[2].nameIndex2" :range="pickerInfoList[2].nameArray2">
 								<view class="p14">
 									{{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}
 									<image src="../../static/detail-tabicon.png" ></image>
 								</view>
 								<!-- <image src="../../static/detail-tabicon.png" ></image> -->
 							</picker>
 						</view>
 					</view>
 					<view class="picker">
 						<view class="picker-choice">
 							<view class="choice-left">
 								<text class="pd">瞳距:</text>
 							</view>
 							<input type="digit" @change="handleInputPd" class="input"
 							placeholder="请输入瞳距,单位cm" maxlength="20" :value="pd" />
 						</view>
 					</view>
 					<view class="picker" >
 						<view class="picker-choice">
 							<view class="choice-left">
 								<text class="p11">{{pickerInfoList[3].nameC}}</text>
 							</view>
 							<text class="p13-date">年&nbsp;&nbsp;&nbsp;(Y)</text>
 							<picker @change="bindPickerChange41" :value="pickerInfoList[3].nameIndex1" :range="pickerInfoList[3].nameArray1">
 								<view class="p14" style="width: 30px;">
 									{{pickerInfoList[3].nameArray1[pickerInfoList[3].nameIndex1]}}
 									<image src="../../static/detail-tabicon.png" ></image>
 								</view>
 							</picker>
 							<text class="p13-date">月&nbsp;&nbsp;&nbsp;(M)</text>
 							<picker @change="bindPickerChange42" :value="pickerInfoList[3].nameIndex2" :range="pickerInfoList[3].nameArray2">
 								<view class="p14" style="width: 30px;">
 									{{pickerInfoList[3].nameArray2[pickerInfoList[3].nameIndex2]}}
 									<image src="../../static/detail-tabicon.png" ></image>
 								</view>
 							</picker>
 							<text class="p13-date">日&nbsp;&nbsp;&nbsp;(D)</text>
 							<picker @change="bindPickerChange43" :value="pickerInfoList[3].nameIndex3" :range="pickerInfoList[3].nameArray3">
 								<view class="p14" style="width: 30px;">
 									{{pickerInfoList[3].nameArray3[pickerInfoList[3].nameIndex3]}}
 									<image src="../../static/detail-tabicon.png" ></image>
 								</view>
 							</picker>
 						</view>
 					</view>
+					<view class="ipts">
+						<view class="inputItem">
+							<text class="text">镜片宽度</text>
+							<input class="input" @input="glassInfoInput($event,0)" type="text" :value="glassInfo.glassWidth" placeholder="请输入镜片宽度"/>
+						</view>
+						<view class="inputItem">
+							<text class="text">鼻梁宽度</text>
+							<input class="input" @input="glassInfoInput($event,1)" type="text" :value="glassInfo.norseWidth" placeholder="请输入鼻梁宽度"/>
+						</view>
+						<view class="inputItem">
+							<text class="text">镜腿长度</text>
+							<input class="input" @input="glassInfoInput($event,2)" type="text" :value="glassInfo.legWidth" placeholder="请输入镜腿长度"/>
+						</view>
+					</view>
 					<view class="confirm">
 						<image class="image1" :src="confirm ? tabicon[0] : tabicon[1]" @tap="changeConfirm"></image>
 						<text>确认以上输入信息来源于我的验光数据!</text>
 					</view>
 				</view>
 				</template>
 			</view>
 		<view class="footer" @click="handleSubmit">
 			<button class="btn" type="default">提 交</button>
 		</view>
 	</view>
 </template>
 <script>
 	import store from '@/store';
 	export default {
 		data() {
 			return {
 				pickerInfoList:[
 				{nameC:"度数",nameE:"(SPH)",nameArray1:[''],nameIndex1:0,nameArray2:[''],nameIndex2:0,key:0},
 				{nameC:"散光",nameE:"(CYL)",nameArray1:[''],nameIndex1:0,nameArray2:[''],nameIndex2:0,key:1},
 				{nameC:"散光轴位",nameE:"(AXI)",nameArray1:[''],nameIndex1:0,nameArray2:[''],nameIndex2:0,key:2},
 				{nameC:"验光日期",nameE:'',nameArray1:[''],nameIndex1:0,nameArray2:['',1,2,3,4,5,6,7,8,9,10,11,12],nameIndex2:0,nameArray3:[''],nameIndex3:0}
 				],
 				confirm: false, // 用户是否确认
 				tabicon:['/static/detail-button.png','/static/detail-button-unselected.png'],
-				name: '夏小花',
+				name: '请输入W姓名',
 				oldname:'',// 用于判读用户是否改变名字
 				pickerInfoChioce:{
 					"leftSph": '',
 					"rightSph": '',
 					"leftCyl": '',
 					"rightCyl": '',
 					"leftAxi": '',
 					"rightAxi": '',
 					"time":{
 						"year":0,
 						"month": 0,
 						"day":0 ,
 					}
 				},
+				glassInfo:{
+					norseWidth:0,//鼻宽
+					glassWidth:0,//镜片宽度
+					legWidth:0//镜腿长度
+				},
 				pd: '',// 瞳距
 				oldpd: '',// 用于判断用户是否改变瞳距
 				kinds:Number, // kinds=1，提交为新增验光，2为修改
 				mp_id: Number
 			};
 		},
 		onLoad: function (option) {
 			//option为object类型，会序列化上个页面传递的参数
 			// 初始化SPL、CYL、AXI的值
 			for (let j = 0; j < 3; j++) {
 				for(let i=-12;i<6;i++){
 					this.pickerInfoList[j].nameArray1.push(i)
 					this.pickerInfoList[j].nameArray1.push(i+0.5)
 					this.pickerInfoList[j].nameArray2.push(i)
 					this.pickerInfoList[j].nameArray2.push(i+0.5)
 					if(i>=-6){
 						this.pickerInfoList[j].nameArray1.push(i+0.25)
 						this.pickerInfoList[j].nameArray1.push(i+0.75)
 						this.pickerInfoList[j].nameArray2.push(i+0.25)
 						this.pickerInfoList[j].nameArray2.push(i+0.75)
 					}
 					if(i==5){
 						this.pickerInfoList[j].nameArray1.push(i+1)
 						this.pickerInfoList[j].nameArray2.push(i+1)
 					}
 				}
 			}
 			// 初始化日期值
 			for (let i = 1; i < 32; i++){
 				this.pickerInfoList[3].nameArray3.push(i)
 			}
 			// 初始化年份前后五年
 			let myDate = new Date();
 			let nowYear = myDate.getFullYear();
 			for(let i=0;i<5;i++){
 				this.pickerInfoList[3].nameArray1.push(nowYear-i)
 			}
 			this.kinds=option.kinds
 			if(option.kinds==1){
 				this.name= '';
 				this.pd= '';
 			} else{
 				console.log('args===>',option.index)
 				const loveList=Object.assign({},this.$store.state.myLoveList.loveList)
 				console.log('args===>',loveList[option.index].in_time)
 				console.log('args===>',loveList[option.index].in_time.toString().slice(0,4))
 				console.log('args===>',loveList[option.index].in_time.toString().slice(5,6)==0)
 				console.log('args===>',loveList[option.index].in_time.toString().slice(8,10))
 				this.name=loveList[option.index].name
 				this.pd=loveList[option.index].pd
 				this.mp_id=loveList[option.index].mp_id
 				this.oldname=loveList[option.index].name
 				this.oldpd=loveList[option.index].pd
 				// 将kinds =2时的值传到该页面
 				this.pickerInfoList[0].nameArray1.unshift(loveList[option.index].leftSph)
 				this.pickerInfoList[0].nameArray2.unshift(loveList[option.index].rightSph)
 				this.pickerInfoList[1].nameArray1.unshift(loveList[option.index].leftCyl)
 				this.pickerInfoList[1].nameArray2.unshift(loveList[option.index].rightCyl)
 				this.pickerInfoList[2].nameArray1.unshift(loveList[option.index].leftAxi)
 				this.pickerInfoList[2].nameArray2.unshift(loveList[option.index].rightAxi)
 				this.pickerInfoList[3].nameArray1.unshift(loveList[option.index].in_time.toString().slice(0,4))
 				if(loveList[option.index].in_time.toString().slice(5,6)==0){
 					this.pickerInfoList[3].nameArray2.unshift(loveList[option.index].in_time.toString().slice(6,7))
 				} else{
 					this.pickerInfoList[3].nameArray2.unshift(loveList[option.index].in_time.toString().slice(5,7))
 				}
 				if(loveList[option.index].in_time.toString().slice(8,9)==0){
 					this.pickerInfoList[3].nameArray3.unshift(loveList[option.index].in_time.toString().slice(9,10))
 				} else{
 					this.pickerInfoList[3].nameArray3.unshift(loveList[option.index].in_time.toString().slice(8,10))
 				}
 			}
 		},
 		methods:{
+			glassInfoInput(e,type){
+				switch(type){
+					case 0:
+						this.glassInfo.glassWidth = e.detail.value
+					break;
+					case 1:
+						this.glassInfo.norseWidth = e.detail.value
+					break;
+					case 2:
+						this.glassInfo.legWidth = e.detail.value
+					break;
+					default:
+					break;
+				}
+			},
 			handleInput(e){
 				this.name=e.target.value
 			},
 			handleInputPd(e){
 				// 只能输入正浮点数或正数
 				if(/^\d+(\.\d+)?$/.test(e.target.value)){
 					this.pd=e.target.value
 				} else {
 					uni.showToast({
 						title:"请输入有效数据;示例:89",
 						icon: "none",
 						duration: 2000,
 					})
 					this.pd = ''
 				}
 			},
 			// 用户提交
 			handleSubmit(){
 				if(this.name==''){
 					uni.showToast({
 						title:"请输入验光单取名",
 						icon: "none",
 						duration: 2000,
 					})
 				}else{
 					if(this.pd==''){
 							uni.showToast({
 								title:"请输入瞳距",
 								icon: "none",
 								duration: 2000,
 							})
 					}else{
 						if(this.kinds==1){
 							// 添加用户验光单
 							console.log('kinds====>',this.pickerInfoChioce.leftSph)
 							console.log('kinds====>',this.pickerInfoChioce.leftSph==Number)
 							console.log('kinds====>',this.pickerInfoChioce.rightSph==Number)
 							if(this.pickerInfoChioce.rightSph==''||this.pickerInfoChioce.leftSph==''||
 							this.pickerInfoChioce.leftCyl==''||this.pickerInfoChioce.rightCyl==''||
 							this.pickerInfoChioce.leftAxi==''||this.pickerInfoChioce.rightAxi==''
 							){
 								uni.showToast({
 									title:"请输入您的验光数据",
 									icon: "none",
 									duration: 2000,
 								})
 							}else{
 								if(this.confirm){
 									store.dispatch('myLoveList/addMylove', {
 										uid: this.$store.state.user.userInfo.uid,
 										openid: this.$store.state.user.userInfo.openid,
 										// mp_name: this.$store.state.user.userInfo.mp_name,
 										leftSph: this.pickerInfoChioce.leftSph,
 										rightSph: this.pickerInfoChioce.rightSph,
 										leftCyl: this.pickerInfoChioce.leftCyl,
 										rightCyl: this.pickerInfoChioce.rightCyl,
 										leftAxi: this.pickerInfoChioce.leftAxi,
 										rightAxi: this.pickerInfoChioce.rightAxi,
 										pd: this.pd,// 瞳距
 										mp_name:this.name,
+										glassWidth:this.glassInfo.glassWidth,
+										norseWidth:this.glassInfo.norseWidth,
+										legWidth:this.glassInfo.legWidth
 										// time: this.pickerInfoChioce.time,
 										// img_url2: "http://localhost:8087/images/shop_1/1/",
 									});
-									store.dispatch('myLoveList/getLoveList', {
+									// store.dispatch('myLoveList/getLoveList', {
-										uid: this.$store.state.user.userInfo.uid,
+									// 	uid: this.$store.state.user.userInfo.uid,
-									});
+									// });
 									uni.navigateBack({
 										delta:1,
 										animationDuration:2000
 									})
 								} else{
 									uni.showToast({
 										title:"请确认您的验光数据",
 										icon: "none",
 										duration: 3000,
 									})
 								}
 							}
 						}
 						if(this.kinds==2){
 							// console.log('kinds====>',this.kinds)
 							// console.log('pickerindex=====>',this.pickerInfoList[0].nameIndex1)
 							// console.log('this.pickerInfoChioce====>',type(this.pickerInfoChioce))
 							if(this.confirm){
 								const leftList = ["leftSph","leftCyl","leftAxi"];
 								const rightList = ["rightSph", "rightCyl", "rightAxi"];
 								let flag=0;
 								if(this.name!=this.oldname){
 									store.dispatch('myLoveList/updateMylove', {
 										uid: this.$store.state.user.userInfo.uid,
 										openid: this.$store.state.user.userInfo.openid,
 										mp_id: this.mp_id,
 										keyname: 'name',
 										keyvalue: this.name,
 									});
 									flag=1
 								}
 								if(this.pd!=this.oldpd){
 									store.dispatch('myLoveList/updateMylove', {
 										uid: this.$store.state.user.userInfo.uid,
 										openid: this.$store.state.user.userInfo.openid,
 										mp_id: this.mp_id,
 										keyname: 'pd',
 										keyvalue: this.pd,
 									});
 									flag=1
 								}
 								//  先验证是否有改动项，
 								for (let j=0; j<3; j++) {
 									if(this.pickerInfoList[j].nameIndex1!=0||this.pickerInfoList[j].nameIndex2!=0){
 										if(this.pickerInfoList[j].nameArray1[this.pickerInfoList[j].nameIndex1]!=''&&
 										this.pickerInfoList[j].nameArray2[this.pickerInfoList[j].nameIndex2]!=''){
 											if(this.pickerInfoList[j].nameIndex1!=0){
 												store.dispatch('myLoveList/updateMylove', {
 													uid: this.$store.state.user.userInfo.uid,
 													openid: this.$store.state.user.userInfo.openid,
 													mp_id: this.mp_id,
 													keyname: leftList[j],
 													keyvalue: this.pickerInfoList[j].nameArray1[this.pickerInfoList[j].nameIndex1],
 												});
 											}
 											if(this.pickerInfoList[j].nameIndex2!=0){
 												store.dispatch('myLoveList/updateMylove', {
 													uid: this.$store.state.user.userInfo.uid,
 													openid: this.$store.state.user.userInfo.openid,
 													mp_id: this.mp_id,
 													keyname: rightList[j],
 													keyvalue: this.pickerInfoList[j].nameArray2[this.pickerInfoList[j].nameIndex2]
 												});
 											}
 											flag=1;
 										} else{
 											flag=0;
 											uni.showToast({
 												title:"请输入您的验光数据",
 												icon: "none",
 												duration: 2000,
 											})
 										}
 									}
 								}
 								if(flag!=0){
 									store.dispatch('myLoveList/getLoveList', {
 										uid: this.$store.state.user.userInfo.uid,
 									});
 									uni.navigateBack({
 										delta:1,
 										animationDuration:2000
 									})
 								}
 							} else{
 								uni.showToast({
 									title:"请确认您的验光数据",
 									icon: "none",
 									duration: 3000,
 								})
 							}
 						}
 					}
 				}
 			},
 			changeConfirm() {
 			    this.confirm = !this.confirm
 			},
 			bindPickerChange01: function(e) {
 			    this.pickerInfoList[0].nameIndex1 = e.target.value
 				this.pickerInfoChioce.leftSph=this.pickerInfoList[0].nameArray1[e.target.value]
 			},
 			bindPickerChange02: function(e) {
 			    this.pickerInfoList[0].nameIndex2 = e.target.value
 				this.pickerInfoChioce.rightSph=this.pickerInfoList[0].nameArray2[e.target.value]
 			},
 			bindPickerChange11: function(e) {
 			    this.pickerInfoList[1].nameIndex1 = e.target.value
 				this.pickerInfoChioce.leftCyl=this.pickerInfoList[1].nameArray1[e.target.value]
 			},
 			bindPickerChange12: function(e) {
 			    this.pickerInfoList[1].nameIndex2 = e.target.value
 				this.pickerInfoChioce.rightCyl=this.pickerInfoList[1].nameArray2[e.target.value]
 			},
 			bindPickerChange21: function(e) {
 			    this.pickerInfoList[2].nameIndex1 = e.target.value
 				this.pickerInfoChioce.leftAxi=this.pickerInfoList[2].nameArray1[e.target.value]
 			},
 			bindPickerChange22: function(e) {
 			    this.pickerInfoList[2].nameIndex2 = e.target.value
 				 this.pickerInfoChioce.rightAxi=this.pickerInfoList[2].nameArray2[e.target.value]
 			},
 			bindPickerChange41: function(e) {
 			    this.pickerInfoList[3].nameIndex1 = e.target.value
 				this.pickerInfoChioce.time.year=this.pickerInfoList[3].nameArray1[e.target.value]
 			},
 			bindPickerChange42: function(e) {
 			    this.pickerInfoList[3].nameIndex2 = e.target.value
 				 this.pickerInfoChioce.time.month=this.pickerInfoList[3].nameArray2[e.target.value]
 			},
 			bindPickerChange43: function(e) {
 			    this.pickerInfoList[3].nameIndex3 = e.target.value
 				this.pickerInfoChioce.time.day=this.pickerInfoList[3].nameArray3[e.target.value]
 			},
 		}
 	}
 </script>
 <style lang="scss">
 	.wrap{
 		min-height: 100vh;
 		background-color: #F2F2F2;
 		.body{
 			// font-family: PingFangSC-Regular;
 			font-size: 12px;
 			color: #666666;
 			letter-spacing: 0;
 			.bodyBox{
 				margin-top: 15px;
 				.names{
 					// font-family: PingFangSC-Regular;
 					font-size: 12px;
 					color: #151515;
 					letter-spacing: 0;
 					text-align: justify;
 					line-height: 17px;
 					margin-left: 5px;
 					margin-right: 10px;
 				}
 				text{
 					// font-family: PingFangSC-Regular;
 					font-size: 12px;
 					color: #666666;
 					letter-spacing: 0;
 					text-align: justify;
 				}
 			}
 		}
 		.goods-form {
 			display: flex;
 			flex-direction: column;
 			align-items: center;
 			justify-content: center;
 			background-color: #fff;
 		    width: 100%;
 		    padding: 40rpx 0;
 			.p1 {
 		        font-size: 16px;
 		        color: #333333;
 		        letter-spacing: -0.3px;
 		        text-align: justify;
 		        line-height: 24px;
 		        margin: 4px 0;
 		    }
 		    .p2 {
 		        font-size: 12px;
 		        color: #999999;
 		        letter-spacing: -0.23px;
 		        margin-bottom: 32rpx;
 		    }
 		    .image2{
 		        width: 42rpx;
 		        height: 34rpx;
 				margin-right: 12rpx;
 		    }
 		    .confirm {
 		        display: flex;
 		        align-items: center;
 		        font-size: 12px;
 		        color: #666666;
 		        letter-spacing: -0.23px;
 		        width: 684rpx;
 		        .image1{
 		            margin-right:25rpx;
 					width: 42rpx;
 					height: 38rpx;
 		        }
 		    }
 		    .picker{
 			display: flex;
 			flex-direction: column;
 			justify-content: center;
 			align-items: center;
 			width: 100%;
 			.picker-choice{
 				display: flex;
 				width: 684rpx;
 				align-items: center;
 		        margin-bottom: 40rpx;
 				.input{
 					border-bottom: 1px solid #CFCFCF;
 					height: 40rpx;
 				}
 				.choice-left{
 					width: 210rpx;
 					.pd{
 						font-size: 14px;
 						color: #333333;
 						letter-spacing: -0.26px;
 						text-align: justify;
 						line-height: 24px;
 						margin-right: 44rpx;
 					}
 					.p11 {
 						font-size: 14px;
 						color: #333333;
 						letter-spacing: -0.26px;
 						text-align: justify;
 						line-height: 24px;
 						// margin-right: 10px;
 					}
 					.p12 {
 						font-size: 10px;
 						color: #3F3F3F;
 						letter-spacing: -0.19px;
 						text-align: justify;
 						line-height: 24px;
 					}
 				}
 				.p13 {
 					font-size: 10px;
 					color: #999999;
 					letter-spacing: -0.19px;
 					margin-right: 10px;
 				}
 		        .p13-date {
 		            font-size: 10px;
 					color: #999999;
 					letter-spacing: -0.19px;
 					margin-right: 5px;
 		        }
 				picker{
 					width: 144rpx;
 					height: 40rpx;
 					display: flex;
 					position: relative;
 					.p14 {
 						font-size: 14px;
 						color: #666666;
 						letter-spacing: -0.26px;
 						text-align: center;
 						width: 124rpx;
 						border-bottom: 1px solid #CFCFCF;
 						height: 38rpx;
 					}
 					image{
 						width: 20rpx;
 						height: 20rpx;
 						position: absolute;
 						right: 20rpx;
 						top: 8rpx;
 					}
 				}
 			}
 		}
+		.ipts{
+			width: 100%;
+			display: flex;
+			flex-direction: column;
+			justify-content: center;
+			align-items: flex-start;
+			padding: 20rpx 36rpx;
+			box-sizing: border-box;
+			.inputItem{
+				display: flex;
+				flex-direction: row;
+				justify-content: center;
+				align-items: center;
+				margin-bottom: 36rpx;
+				.text{
+					margin-right: 100rpx;
+				}
+				.input{
+					border-bottom: 1px solid #CFCFCF;
+				}
+			}
+		}
 		}
 		.footer{
 			width: 100%;
 			position: fixed;
 			bottom: 0;
 			left: 0;
 			.btn{
 				width: 100%;
 				height: 112rpx;
 				line-height: 112rpx;
 				background: #FF6B4A;
 				font-size: 16px;
 				color: #FFFFFF;
 			}
 		}
 	}
 </style>