From a90d1415f5272a08e347a2bfd44d5d4d6093bd93 Mon Sep 17 00:00:00 2001
From: syt <854400391@qq.com>
Date: Thu, 1 Feb 2024 21:28:48 +0800
Subject: [PATCH] =?UTF-8?q?=E4=B8=8A=E9=97=A8=E5=9B=9E=E6=94=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 api/newFun.js                                 |   9 +
 pages.json                                    |   7 +
 pages/login/index.vue                         |   1 +
 pages/news/recycling/confirm.vue              |  37 ---
 .../{confirm - 副本.vue => confirm1.vue}    | 235 +++++++++++++-----
 pages/news/recycling/detail.vue               | 199 ++++++++++++---
 6 files changed, 346 insertions(+), 142 deletions(-)
 rename pages/news/recycling/{confirm - 副本.vue => confirm1.vue} (60%)

diff --git a/api/newFun.js b/api/newFun.js
index 1bae1db..5f4194a 100644
--- a/api/newFun.js
+++ b/api/newFun.js
@@ -1,5 +1,14 @@
 import request from '@/utils/request'
 
+// // 上门回收 门店列表
+// export const storeList = (param) => {
+//   return request.get('upload/image', param)
+// } 
+// 上门回收 门店列表
+export const storeList = (param) => {
+  return request.get('shop/list', param)
+} 
+
 // 上门回收 回收列表
 export const recoveryRecoveryList = (param) => {
   return request.post('recovery/recoveryList', param)
diff --git a/pages.json b/pages.json
index aea3a67..0569802 100644
--- a/pages.json
+++ b/pages.json
@@ -757,6 +757,13 @@
 						"navigationBarTitleText": "确认服务订单",
 						"enablePullDownRefresh": false
 					}
+				},
+				{
+					"path": "recycling/confirm1",
+					"style": {
+						"navigationBarTitleText": "确认订单",
+						"enablePullDownRefresh": false
+					}
 				},{
 					"path": "recycling/orderList",
 					"style": {
diff --git a/pages/login/index.vue b/pages/login/index.vue
index f791be1..6ba1011 100644
--- a/pages/login/index.vue
+++ b/pages/login/index.vue
@@ -125,6 +125,7 @@
 					refereeId: false
 				}).then(res => {
 					uni.setStorageSync('token', res.data.token)
+					uni.setStorageSync('userInfo', res.data)
 					uni.showToast({
 						title: res.message
 					})
diff --git a/pages/news/recycling/confirm.vue b/pages/news/recycling/confirm.vue
index 32fdbcb..3280fa1 100644
--- a/pages/news/recycling/confirm.vue
+++ b/pages/news/recycling/confirm.vue
@@ -86,20 +86,6 @@
 					<view class="b">
 						<input class="box" v-model="mobile" type="number" placeholder="联系人手机号码" />
 					</view>
-				</view>
-				<view class="item" v-if="tabIndex == 3">
-					<view class="a">联系人微信</view>
-					<view class="b">
-						<input class="box" type="text" placeholder="联系人微信号码" />
-					</view>
-				</view>
-				<view class="item" v-if="tabIndex == 3">
-					<view class="a">发件地址</view>
-					<view class="b">
-						<picker mode="region">
-							<view class="select">请选择所在人城市</view>
-						</picker>
-					</view>
 				</view>
 				<view class="item" v-if="type == 1">
 					<view class="a">所在城市</view>
@@ -118,29 +104,6 @@
 						<input class="box" v-model="address" type="text" placeholder="例：12幢1单元102室" />
 					</view>
 				</view>
-				<view class="item" v-if="tabIndex == 3">
-					<view class="a">门牌号</view>
-					<view class="b">
-						<input class="box" v-model="address" type="text" placeholder="详细地址 例：12幢1单元102室" />
-					</view>
-				</view>
-				<view class="item" v-if="type == 2">
-					<view class="a">期待卖价</view>
-					<view class="b">
-						<input class="box" type="text" placeholder="请输入您期待的售卖价格（元）" />
-					</view>
-				</view>
-				<view class="photo" v-if="type==2">
-					<u-upload :action="action" width="160" height="160" :file-list="fileList" :custom-btn="true" max-count="5">
-						<template v-slot:addBtn>
-							<view class="slot-btn" hover-class="slot-btn__hover" hover-stay-time="150">
-								<image src="/static/news/icon-upload.png"></image>
-								<view class="1">上传图片</view>
-								<view class="1">1/8</view>
-							</view>
-						</template>
-					</u-upload>
-				</view>
 				<view class="remark" style="margin-top: 20rpx;">
 					<view class="name">备注 ：</view>
 					<view class="xu">
diff --git a/pages/news/recycling/confirm - 副本.vue b/pages/news/recycling/confirm1.vue
similarity index 60%
rename from pages/news/recycling/confirm - 副本.vue
rename to pages/news/recycling/confirm1.vue
index 4e3a051..8206bdd 100644
--- a/pages/news/recycling/confirm - 副本.vue	
+++ b/pages/news/recycling/confirm1.vue
@@ -5,46 +5,43 @@
 		</view>
 		<view class="recycling-bd">
 			<view class="tab">
-				<view class="a" v-if="type == 2">
+				<view class="a">
+					<view class="item" @click="tabItem(0)"></view>
 					<view class="item" @click="tabItem(1)"></view>
 					<view class="item" @click="tabItem(2)"></view>
-					<view class="item" @click="tabItem(3)"></view>
-				</view>
-				<view class="b" v-if="type == 2">
-					<image v-if="tabIndex == 1" src="@/static/news/icon-recyling-tab-01.png"></image>
-					<image v-if="tabIndex == 2" src="@/static/news/icon-recyling-tab-02.png"></image>
-					<image v-if="tabIndex == 3" src="@/static/news/icon-recyling-tab-03.png"></image>
 				</view>
-				<view class="b" v-else>
-					<image src="@/static/news/icon-recyling-tab-04.png"></image>
+				<view class="b">
+					<image v-if="tabIndex == 0" src="@/static/news/icon-recyling-tab-01.png"></image>
+					<image v-if="tabIndex == 1" src="@/static/news/icon-recyling-tab-02.png"></image>
+					<image v-if="tabIndex == 2" src="@/static/news/icon-recyling-tab-03.png"></image>
 				</view>
 			</view>
 			<view class="goods">
 				<view class="a">
-					<image src="@/static/news/icon-mall.jpg"></image>京送家电武隆路店
+					<image src="@/static/news/icon-mall.jpg"></image>{{storeInfo.shop_name}}
 				</view>
 				<view class="b">
 					<view class="l">
-						<image class="pic" src="@/static/home/phone.jpg"></image>
+						<image class="pic" :src="storeInfo.logo_url"></image>
 						<view class="info">
-							<view class="tel">13770577307</view>
-							<view class="address">杭州市萧山区宏达路234号 国际中心</view>
-							<view class="time">营业时间：10:00-18:00</view>
+							<view class="tel">{{storeInfo.linkman}}{{storeInfo.phone}}</view>
+							<view class="address">{{storeInfo.address}}</view>
+							<view class="time">营业时间：{{storeInfo.shop_hours}}</view>
 						</view>
 						<view class="do">
-							<view class="tel">
+							<view class="tel" @click="openPage(1,storeInfo.phone)">
 								<image src="@/static/news/tel.png"></image>电话
 							</view>
-							<view class="tel">
+							<view class="tel" @click="openPage(2)">
 								<image src="@/static/news/address.png"></image>导航
 							</view>
 						</view>
 					</view>
 					<view class="r">
-						<image class="pic" src="@/static/home/phone.jpg"></image>
+						<image class="pic" :src="info.recovery_image"></image>
 						<view class="info">
-							<view class="tel">手机回收</view>
-							<view class="price">¥<text>4189234</text></view>
+							<view class="tel">{{info.recovery_name}}</view>
+							<view class="price">免支付预约</view>
 						</view>
 						<view class="num">
 							x1
@@ -52,18 +49,30 @@
 					</view>
 				</view>
 			</view>
-			<view class="form">
+			<view class="form">
+				<view class="item">
+					<view class="a">品牌</view>
+					<view class="b">
+						<input class="box" type="text" v-model="brand" placeholder="品牌" />
+					</view>
+				</view>
+				<view class="item">
+					<view class="a">型号</view>
+					<view class="b">
+						<input class="box" type="text" v-model="model" placeholder="型号" />
+					</view>
+				</view>
 				<view class="item">
 					<view class="a">服务时间</view>
-					<view class="b" @click="openPage(1)">
-						<view class="select">请选择预约到店时间</view>
-						<u-icon style="margin-left: 10rpx;" name="arrow-right"></u-icon>
+					<view class="b" @click="openPage(3)">
+						<view class="select" :class="server_time?'select-on':''">{{server_time?server_time:(tabIndex <= 1?'请选择预约到店时间':'请选择预计寄出商品的时间')}}</view>
+						<u-icon style="margin-left: 10rpx;" name="arrow-right"></u-icon>
 					</view>
 				</view>
 				<view class="item">
 					<view class="a">联系人</view>
 					<view class="b">
-						<input class="box1" type="text" placeholder="联系人姓名" />
+						<input class="box1" v-model="username" type="text" placeholder="联系人姓名" />
 						<view class="radio">
 							<u-radio-group v-model="radioValue" active-color="red">
 								<u-radio name="先生">先生</u-radio>
@@ -75,37 +84,40 @@
 				<view class="item">
 					<view class="a">联系电话</view>
 					<view class="b">
-						<input class="box" type="text" placeholder="联系人手机号码" />
+						<input class="box" type="number" v-model="mobile" placeholder="联系人手机号码" />
 					</view>
 				</view>
-				<view class="item" v-if="tabIndex == 3">
+				<view class="item" v-if="tabIndex == 2">
 					<view class="a">联系人微信</view>
 					<view class="b">
-						<input class="box" type="text" placeholder="联系人微信号码" />
+						<input class="box" v-model="wx_account" type="text" placeholder="联系人微信号码" />
 					</view>
 				</view>
-				<view class="item" v-if="tabIndex == 3">
+				<view class="item" v-if="tabIndex == 2">
 					<view class="a">发件地址</view>
 					<view class="b">
-						<picker  mode="region">
-							<view class="select">请选择所在人城市</view>
+						<picker @change="changeRegion" mode="region">
+							<view class="select" :class="region.length>0?'select-on':''">
+							{{
+								region.length > 0?region[0]+region[1]+region[2]:'请选择所在人城市'
+							}}</view>
 						</picker>
 					</view>
 				</view>
-				<view class="item" v-if="tabIndex == 3">
+				<view class="item" v-if="tabIndex == 2">
 					<view class="a">门牌号</view>
 					<view class="b">
-						<input class="box" type="text" placeholder="详细地址 例：12幢1单元102室" />
+						<input class="box" type="text" placeholder="例：12幢1单元102室" />
 					</view>
 				</view>
 				<view class="item">
 					<view class="a">期待卖价</view>
 					<view class="b">
-						<input class="box" type="text" placeholder="请输入您期待的售卖价格（元）" />
+						<input class="box" v-model="expect_price" type="number" placeholder="请输入您期待的售卖价格（元）" />
 					</view>
 				</view>
-				<view class="photo">
-					<u-upload :action="action" width="160" height="160" :file-list="fileList" :custom-btn="true" max-count="5">
+				<view class="photo" v-if="tabIndex != 0">
+					<u-upload :action="url" :header="header" @on-uploaded="success" width="160" height="160" :file-list="fileList" :custom-btn="true" max-count="8">
 						<template v-slot:addBtn>
 							<view class="slot-btn" hover-class="slot-btn__hover" hover-stay-time="150">
 								<image src="/static/news/icon-upload.png"></image>
@@ -116,54 +128,147 @@
 					</u-upload>
 				</view>
 				<view class="remark">
-					<view class="name">留言 ：</view>
-					<view class="xu">
-						<view class="li">可提前来</view>
-						<view class="li">来之前打电话</view>
-						<view class="li">请尽快联系我</view>
-					</view>
-					<view class="content">
-						<u-input v-model="value" height="260" type="textarea" placeholder="请输入您的留言，最多可留言100字" :border="true" />
+					<view class="name">备注 ：</view>
+					<view class="xu">
+						<view class="li" @click="openPage(5,'可提前来')">可提前来</view>
+						<view class="li" @click="openPage(5,'来之前打电话')">来之前打电话</view>
+						<view class="li" @click="openPage(5,'请尽快联系我')">请尽快联系我</view>
+					</view>
+					<view class="content">
+						<u-input v-model="remake" height="260" type="textarea" placeholder="请输入您的留言，最多可留言100字" :border="true" />
 					</view>
 				</view>
 			</view>
 		</view>
 		<view class="recycling-fd">
-			<view class="a" v-if="type==2">免支付预购</view>
-			<view class="c" v-else>￥{{info.server_price}}元</view>
-			<view class="b" @click="openPage(2)">提交订单</view>
-		</view>
+			<view class="a">免支付预购</view>
+			<view class="b" @click="openPage(4)">提交订单</view>
+		</view>
+		<!-- 时间选择器 -->
+		<u-picker mode="time" :params="params" v-model="show" confirm-color="#FE483B" :show-time-tag="false" @confirm="confirm"></u-picker>
 	</view>
 </template>
-<script>
+<script>
+	import Config from '@/core/config'
 	export default{
 		data(){
 			return {
 				info: {},
 				type: 1,
-				radioValue: "男士",
-				tabIndex: 1,
-				fileList: [
-					{
-						url: 'http://pics.sc.chinaz.com/files/pic/pic9/201912/hpic1886.jpg',
-					}
-				],
+				radioValue: "男士",
+				server_time: "",
+				tabIndex: 0,
+				fileList: [],
+				image_ids: [],
+				express_no: "",
+				express_id: "",
+				shipping_address: "",
+				house_number: "",
+				wx_account: "",
+				model: "",
+				brand: "",
+				remake: "",
+				expect_price: "",
+				mobile: "",
+				username: "",
+				params: {
+					year: true,
+					month: true,
+					day: true,
+					hour: true,
+					minute: true,
+					second: true
+				},
+				show: false,
+				storeInfo: {},
+				region: [],
+				header: {
+					'Storeid': uni.getStorageSync('Store').storeInfo.store_id
+					'AccessToken': uni.getStorageSync('AccessToken')
+					'platform': "MP-WEIXIN",
+				},
+				
+				url: Config.get('apiUrl')+'user/upload'
 			}
 		},
-		onLoad(o) {
+		onLoad(o) {
+			this.tabIndex = o.tabIndex;
 			this.info = uni.getStorageSync("getInfo")
-			this.type = o.type
+			this.storeInfo = uni.getStorageSync("storeHsInfo")
+			this.type = o.type;
+			
 		},
-		methods: {
+		methods: {
+			success(e) {
+				console.log(e)
+			},
+			beforeUpload(e,list){
+				console.log(list)
+				for(i = 0; i<list.length;i++){
+					uni.uploadFile({
+						name: 'file',
+						header: {
+							
+						},
+						url: ,
+						filePath: list[i].url,
+						success: (upRes) => {
+							let end = JSON.parse(upRes.data);
+							console.log(end)
+							// that.userInfo.avatar = end.data.path
+							// that.userInfo.avatar1 = end.data.url
+						},
+						fail: (err) => {
+							console.log("toUpload err",err)
+							console.log(err)
+						}
+					});
+				}
+				
+			},
+			uploadImage() {
+				const that = this
+				uni.chooseImage({
+					count: 1,
+					sizeType: ["original"], //可以指定是原图还是压缩图，默认二者都有
+					sourceType: ["album", "camera"],
+					success: (res) => {
+						console.log(res.tempFilePaths[0])
+						
+					},
+					fail(err){
+						console.log("fail",err)
+					}
+				});
+			},
 			tabItem(i) {
 				this.tabIndex = i
+			},
+			confirm(e){
+				this.server_time = e.year+"-"+e.month+'-'+e.day+" "+e.hour+"-"+e.minute+'-'+e.second
+			},
+			changeRegion(e) {
+				this.region = e.detail.value
 			},
-			openPage(i){
-				if(i == 1){
-					uni.navigateTo({
-						url: "/pages/news/recycling/timer"
-					})
-				}else {
+			openPage(i,msg){
+				if(i == 1){
+					uni.makePhoneCall({
+						phoneNumber: msg
+					})
+				}else if(i == 2){
+					uni.openLocation({
+						latitude: this.storeInfo.latitude,
+						longitude:  this.storeInfo.longitude,
+						complete: function (res) {
+							console.log(res);
+						}
+					});
+				}else if(i == 3){
+					this.show = true
+					// uni.navigateTo({
+					// 	url: "/pages/news/recycling/timer"
+					// })
+				}else if(i == 4) {
 					uni.redirectTo({
 						url: "/pages/news/recycling/order"
 					})
@@ -219,7 +324,7 @@
 				.b{
 					width: 100%;
 					height: 100%;
-						display: block;
+					display: block;
 					image{
 						width: 100%;
 						height: 100%;
diff --git a/pages/news/recycling/detail.vue b/pages/news/recycling/detail.vue
index f6c0952..3babc87 100644
--- a/pages/news/recycling/detail.vue
+++ b/pages/news/recycling/detail.vue
@@ -35,10 +35,12 @@
 				<view class="b" v-if="type == 1">上门服务</view>
 				<view class="b" v-else @click="openPage(2)">{{selector[tabIndex]}}<u-icon name="arrow-right"></u-icon></view>
 			</view>
-			<!-- <view class="item" v-if="type == 2">
-				<view class="a">送至</view>
-				<view class="b" @click="openPage(4)">{{addressInfo.phone?addressInfo.region.province+addressInfo.region.city+addressInfo.region.region+addressInfo.detail:'请选择地址'}}<u-icon name="arrow-right"></u-icon></view>
-			</view> -->
+			<view class="item" v-if="type == 2">
+				<view class="a">门店</view>
+				<view class="b" @click="openPage(4)">
+					{{storeIndex>=0?storeList[storeIndex].shop_name:'请选择门店'}}<u-icon name="arrow-right"></u-icon>
+				</view>
+			</view>
 			<view class="item">
 				<view class="a">服务</view>
 				<view class="b">优质服务全程跟踪</view>
@@ -79,13 +81,24 @@
 			</view> -->
 			<!-- <view class="b">加入购物车</view> -->
 			<view class="c" v-if="type== 1" @click="openPage(3)">立即预约</view>
-			<view class="c" v-else @click="openPage(4)">立即预约</view>
+			<view class="c" v-else @click="openPage(5)">立即预约</view>
 		</view>
-        <u-picker v-model="isShow" mode="selector" :range="selector" @confirm="confirm"></u-picker>
+        <u-picker v-model="isShow" mode="selector" :range="selector" @confirm="confirm"></u-picker>
+		<!-- 选择门店 -->
+		<u-popup v-model="isShow1" mode="bottom" border-radius="12" mask-close-able="false" closeable>
+			<view class="recycling-classify">
+				<view class="recycling-classify-hd">门店列表</view>
+				<view class="recycling-classify-bd">
+					<scroll-view scroll-y class="m">
+						<view class="item" v-for="(a,i) in storeList" :key="i" @click="tabMItem(a,i)"><view :class="storeIndex == i?'item-on':''">{{a.shop_name}}</view></view>
+					</scroll-view>
+				</view>
+			</view>	
+		</u-popup>
 	</view>
 </template>
-<script>
-	import * as AddressApi from '@/api/address';
+<script>
+	import * as newFunApi from '@/api/newFun'
 	export default{
 		data(){
 			return {
@@ -94,7 +107,11 @@
 				isShow: false,
 				selector: ["门店回收","上门回收","邮寄回收"],
 				type: 1,
-				info: {}
+				info: {},
+				storeInfo: {},
+				isShow1: false,
+				storeList:[],
+				storeIndex: -1,
 			}
 		},
 		onLoad(o) {
@@ -106,26 +123,24 @@
 			this.type = o.type
 			uni.setNavigationBarTitle({
 				title: o.type == 1?"服务详情": '上门回收'
-			})
-		},
-		onShow(){
-			// if(uni.getStorageSync("token") && this.type==2){
-			// 	if(uni.getStorageSync("addressInfo")){
-			// 		this.addressInfo = uni.getStorageSync("addressInfo")
-			// 		uni.removeStorageSync("addressInfo")
-			// 	}else{
-			// 		this.getAddressList();
-			// 	}
-			// }
+			})
+			
+		},
+		onShow() {
+			if(uni.getStorageSync("token")){
+				this.getList()
+			}
 		},
 		methods: {
-			// //获取收货地址列表
-			// async getAddressList() {
-			// 	const { status, data } = await AddressApi.list()
-			// 	if(status == 200){
-			// 		this.addressInfo = data.list.length > 0?data.list[0]:{}
-			// 	}
-			// },
+			//获取门店列表
+			async getList() {
+				const { status, data } = await newFunApi.storeList({
+					platform: 'H5'
+				})
+				if(status == 200){
+					this.storeList = data.list
+				}
+			},
 			openPage(index) {
 				if(index == 2){
 					this.isShow = true;
@@ -145,21 +160,33 @@
 							url: "/pages/login/index"
 						})
 						return ;
+					}
+					if(this.storeInfo && this.storeInfo.shop_id){
+						uni.setStorageSync("storeHsInfo",this.storeInfo)
+						uni.navigateTo({
+							url: "/pages/news/recycling/confirm1?tabIndex="+this.tabIndex+"&id="+this.info.recovery_id+"&type="+this.type
+						})
+					}else{
+						uni.showToast({
+							title: '请选择门店',
+							icon: "none",
+						})
 					}
-					uni.navigateTo({
-						url: "/pages/news/recycling/confirm1?tabIndex="+this.tabIndex+"&id="+this.info.server_id+"&type="+this.type
-					})
-				}else if(index == 4){
-					if(!uni.getStorageSync("token")){
-						uni.navigateTo({
-							url: "/pages/login/index"
-						})
-						return ;
+					
+				}else if(index == 4){
+					if(!uni.getStorageSync("token")){
+						uni.navigateTo({
+							url: "/pages/login/index"
+						})
+						return ;
 					}
-					uni.navigateTo({
-						url: "/pages/address/index?type="+this.type
-					})
+					this.isShow1 = true
 				}
+			},
+			tabMItem(a,i){
+				this.storeInfo = a;
+				this.storeIndex = i;
+				this.isShow1 = false
 			},
 			confirm(e){
 				this.tabIndex = e[0]
@@ -170,7 +197,99 @@
 <style lang="scss" scoped>
 	.recycling{
 		padding-bottom: 130rpx;
-		overflow: hidden;
+		overflow: hidden;
+		&-classify{
+				width: 100%;
+				overflow: hidden;
+				&-hd{
+					padding: 30rpx 60rpx;
+					position: relative;
+					font-size: 32rpx;
+					font-weight: 500;
+					color: #303030;
+					text-align: center;
+					.a{
+						display: flex;
+						align-items: center;
+						font-size: 28rpx;
+						font-weight: 500;
+						color: #FF624F;
+						position: absolute;
+						top: 30rpx;
+						left: 40rpx;
+						z-index: 2;
+					}
+				}
+				&-bd{
+					overflow: hidden;
+					display: flex;
+					align-items: flex-start;
+					.l{
+						width: 210rpx;
+						height: 560rpx;
+						background-color: #F7F8FA;
+						.item{
+							text-overflow: ellipsis;
+							overflow: hidden;
+							height: 70rpx;
+							font-size: 28rpx;
+							font-weight: 400;
+							color: #303030;
+							white-space: nowrap;
+							line-height: 70rpx;
+							padding-left: 30rpx;
+							box-sizing: border-box;
+							text-align: left;
+							&-on{
+								background-color: #fff;
+								font-weight: 500;
+							}
+						}
+					}
+					.m{
+						width: 100%;
+						text-align: center;
+						max-height: 560rpx;
+						.item{
+							text-overflow: ellipsis;
+							overflow: hidden;
+							height: 70rpx;
+							font-size: 28rpx;
+							font-weight: 400;
+							color: #303030;
+							white-space: nowrap;
+							line-height: 70rpx;
+							padding-left: 80rpx;
+							box-sizing: border-box;
+							text-align: left;
+							&-on{
+								color: #FF624F;
+							}
+						}
+					}
+					.r{
+						width: 540rpx;
+						height: 560rpx;
+						.item{
+							text-overflow: ellipsis;
+							overflow: hidden;
+							height: 70rpx;
+							font-size: 28rpx;
+							font-weight: 400;
+							color: #303030;
+							white-space: nowrap;
+							line-height: 70rpx;
+							padding-left: 80rpx;
+							box-sizing: border-box;
+							&-on{
+								color: #FF624F;
+							}
+						}
+					}
+				}
+			}
+		
+		
 		&-hd{
 			width: 720rpx;
 			min-height: 262rpx;