优化样式

4 years ago · 2bee43a9ea
6 changed files with 117 additions and 40 deletions
--- a/pages.json
+++ b/pages.json
@ -216,6 +216,16 @@
            }
            
        }
+        ,{
+            "path" : "pages/paper-detail/index",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "纸商城详情",
+				 "navigationStyle": "custom",
+                "enablePullDownRefresh": false
+            }
+            
+        }
    ],
  "globalStyle": {
    "navigationBarTextStyle": "black",
--- a/pages/add-paper/index.vue
+++ b/pages/add-paper/index.vue
@ -61,7 +61,7 @@
 				<view class="" @click="paperpopupShow()">
 					<text v-if="form.categoryId === null" class="add-paph-text">请选择纸种信息</text>
 					<text v-else>{{ form.categoryName }}</text>
-					<text><uni-icons type="right" color="#999" size="18"></uni-icons></text>
+					<text><uni-icons type="right" color="#000000" size="18"></uni-icons></text>
 				</view>
 			</view>
 			<view class="add-paper-border"></view>
@ -117,7 +117,8 @@
 					</view>
 					<view class="label_value label-select" @click="popueShow(index)">
 						<text class="paper-price-title  text-right">{{ item.stockUnit === '1' ? '张' : '吨' }}</text>
-						<image class="image" src="../../static/imgs/client/down-arrow-icon.png" mode=""></image>
+						<uni-icons type="bottom" color="#000000" size="18"></uni-icons>
+						
 					</view>
 				</view>
 				<view class="paper-price-item">
@ -184,12 +185,15 @@
 					mode="grid"
 					file-extname="png,jpg"
 					:limit="6"
+					:image-styles="imageStyles"
 					@progress="progress"
 					@success="success"
 					@fail="fail"
 					@select="select"
 					@delete="deleteImage"
-				/>
+				>
+				<image class="paper-upload-image" src="../../static/imgs/trade/uploadImage.png" mode=""></image>
+				</uni-file-picker>
 			</view>
 		</view>
 		<uGap></uGap>
@ -299,6 +303,17 @@ export default {
 				brandName: null,
 				categoryId: null
 			},
+			imageStyles: {
+				width: 100,
+				height: 100,
+				background:'#000',
+				border: {
+					color: '#f1f1f1',
+					width: 1,
+					style: 'solid',
+					radius: '2rpx'
+				}
+			},
 			range: [{ value: 0, text: '是' }, { value: 1, text: '否' }],
 			placeholderStyle: 'text-align: right;',
 			searchList: [
@ -553,6 +568,12 @@ export default {
 		.paper-price-image {
 			padding: 22rpx 32rpx;
 		}
+		.paper-upload-image{
+			width: 184rpx;
+			height: 184rpx;
+			background: rgba(220,222,224,0.50);
+			border-radius: 10rpx;
+		}
 		.paper-price-textArea {
 			background: #f7f8fa;
 			border-radius: 20rpx;
@ -652,5 +673,8 @@ export default {
 		padding: 10rpx 32rpx;
 		background-color: #ffffff;
 	}
+	.paper-backColor{
+		background-color:  rgba(220,222,224,1);
+	}
 }
 </style>
--- a/pages/mall/index.vue
+++ b/pages/mall/index.vue
@ -20,7 +20,7 @@
 		</view>
 		<uGap></uGap>
 		<scroll-list ref="list" :option="option" @load="upCallback" @refresh="downCallback" style="background-color: #FFFFFF;">
-			<view v-for="(item, index) in listData" :key="index">
+			<view v-for="(item, index) in listData" :key="index" @click="detailInfo(item)">
 				<view class="content">
 					<image class="image" src="https://qncloud.oss-cn-shenzhen.aliyuncs.com/ztb_pic/testPic.jfif" mode=""></image>
 					<view class="">
@ -109,26 +109,26 @@ export default {
 					})
 			})
 		},
-		downCallback() {
-			this.orderPagination.pageNum = 1
-			this.quertData()
-				.then(({ list, total }) => {
-					this.$refs.list.refreshSuccess({ list, total })
-				})
-				.catch(() => {
-					this.$refs.list.refreshFail()
-				})
-		},
-		upCallback() {
-			this.orderPagination.pageNum++
-			this.quertData()
-				.then(({ list, total }) => {
-					this.$refs.list.loadSuccess({ list, total })
-				})
-				.catch(() => {
-					this.$refs.list.loadFail()
-				})
-		},
+		// downCallback() {
+		// 	this.orderPagination.pageNum = 1
+		// 	this.quertData()
+		// 		.then(({ list, total }) => {
+		// 			this.$refs.list.refreshSuccess({ list, total })
+		// 		})
+		// 		.catch(() => {
+		// 			this.$refs.list.refreshFail()
+		// 		})
+		// },
+		// upCallback() {
+		// 	this.orderPagination.pageNum++
+		// 	this.quertData()
+		// 		.then(({ list, total }) => {
+		// 			this.$refs.list.loadSuccess({ list, total })
+		// 		})
+		// 		.catch(() => {
+		// 			this.$refs.list.loadFail()
+		// 		})
+		// },
 		// 切换商城按钮
 		checkMall() {
 			go2('switching-mall')
@ -150,6 +150,10 @@ export default {
 		// 店铺设置按钮
 		setting(){
 			go2('store-settings')
+		},
+		// 详情点击事件
+		detailInfo(){
+			go2('paper-detail')
 		}
 	}
 }
--- a/pages/paper-detail/index.vue
+++ b/pages/paper-detail/index.vue
@ -0,0 +1,37 @@
+<template>
+	<view class="paper-detail">
+		<view>
+			<uni-nav-bar left-icon="back" @clickLeft="back" statusBar fixed title="">
+				<view class="paper-detail-title">纸品详情</view>
+				<view slot="left"></view>
+				<view slot="right"></view>
+			</uni-nav-bar>
+		</view>
+	</view>
+</template>
+
+<script>
+	import { back, go2 } from '@/utils/hook.js'
+	export default {
+		data() {
+			return {
+			}
+		},
+		methods: {
+			 back,
+		}
+	}
+</script>
+
+<style lang="scss">
+.paper-detail{
+	.paper-detail-title {
+		width: 100%;
+		font-size: 36rpx;
+		color: #000000;
+		letter-spacing: 0;
+		text-align: center;
+		font-weight: 500;
+	}
+}
+</style>
--- a/pages/store-settings/index.vue
+++ b/pages/store-settings/index.vue
@ -36,14 +36,18 @@
 						@fail="fail"
 						@select="select"
 						@delete="deleteImage"
-					/>
+					>
+					<image class="paper-upload-image" src="../../static/imgs/trade/uploadImage.png" mode=""></image>
+					</uni-file-picker>
 					<view class="store-image-text ">建议尺寸：200*200像素，尺寸不匹配时，图片将被压缩或拉伸以铺满画面</view>
 				</view>
 			</view>
 			<view class="store-log">
 				<view class="tore-setting-name"><text>背景图片</text></view>
 				<view class="store-log store-image-flex">
-					<uni-file-picker class="stotr-image-widtht" :limit="1" fileMediatype="image" :image-styles="imageStylest" />
+					<uni-file-picker class="stotr-image-widtht" :limit="1" fileMediatype="image" :image-styles="imageStylest" >
+						<image class="paper-upload-image" src="../../static/imgs/trade/uploadImage.png" mode=""></image>
+					</uni-file-picker>
 					<view class="store-image-text">建议尺寸：750*370像素，尺寸不匹配时，图片将被压缩或拉伸以铺满画面</view>
 				</view>
 			</view>
@ -62,24 +66,14 @@ export default {
 			storeName: '',
 			imageValue: [],
 			imageStyles: {
-				width: 100,
+				width: 120,
 				height: 100,
-				border: {
-					color: '#f1f1f1',
-					width: 1,
-					style: 'dashed',
-					radius: '4rpx'
-				}
+				border: false
 			},
 			imageStylest: {
 				width: 183,
 				height: 94,
-				border: {
-					color: '#f1f1f1',
-					width: 1,
-					style: 'dashed',
-					radius: '4rpx'
-				}
+				border: false
 			}
 		}
 	},
@ -158,9 +152,11 @@ export default {
 	}
 	.stotr-image-widtht{
 		width: 100%;
+		background-color:  rgba(220,222,224,1);
 	}
 	.stotr-image-width{
-		width: 50%;
+		width: 48%;
+		background-color:  rgba(220,222,224,1);
 	}
 	.upload-btn{
 		position: absolute;
@ -168,5 +164,11 @@ export default {
 		    bottom: 32rpx;
 		    left: 32rpx;
 	}
+	.paper-upload-image{
+		width: 120rpx;
+		height: 120rpx;
+		background: rgba(220,222,224,1);
+		border-radius: 10rpx;
+	}
 }
 </style>
--- a/static/imgs/trade/uploadImage.png
+++ b/static/imgs/trade/uploadImage.png