BJ_ZTEITS-Developers / parking-cloud-yudao

Commit 9e69f6e6c25d463e7fb859169380fbf8fce8738d

Authored by sfmind
1 parent cfcc0aa6

调整自定义插件、代码风格化

Inline Side-by-side
Showing 11 changed files with 492 additions and 527 deletions
yudao-ui-app/.editorconfig 0 → 100644
  View file @9e69f6e
  1 +# 告诉EditorConfig插件，这是根文件，不用继续往上查找
  2 +root = true
  3 +
  4 +# 匹配全部文件
  5 +[*]
  6 +# 设置字符集
  7 +charset = utf-8
  8 +# 缩进风格，可选space、tab
  9 +indent_style = space
  10 +# 缩进的空格数
  11 +indent_size = 2
  12 +# 结尾换行符，可选lf、cr、crlf
  13 +end_of_line = lf
  14 +# 在文件结尾插入新行
  15 +insert_final_newline = true
  16 +# 删除一行中的前后空格
  17 +trim_trailing_whitespace = true
  18 +
  19 +# 匹配md结尾的文件
  20 +[*.md]
  21 +insert_final_newline = false
  22 +trim_trailing_whitespace = false
... ...
yudao-ui-app/uni_modules/uview-ui/components/u--text-price/u--text-price.vue renamed to yudao-ui-app/components/custom-text-price/custom-text-price.vue
  View file @9e69f6e
1 1 <template>
2 2 <view class="u-text-price-wrap">
3   - <text
4   - v-for="(item,index) in textArray"
5   - :key="index"
6   - :style="{'font-size': (index === 1 ? integerSize : size) + 'px', 'color': color}"
7   - >
8   - {{item}}
  3 + <text v-for="(item, index) in textArray" :key="index" :style="{ 'font-size': (index === 1 ? integerSize : size) + 'px', 'color': color }">
  4 + {{ item }}
9 5 </text>
10 6 </view>
11 7 </template>
... ... @@ -15,12 +11,11 @@
15 11 * 此组件存在只为简单的显示特定样式的(人名币)价格数字
16 12 */
17 13 export default {
18   - name: "u--text-price",
19   - components: {
20   - },
  14 + name: 'custom-text-price',
  15 + components: {},
21 16 props: {
22   - text: {
23   - type: String,
  17 + price: {
  18 + type: [String, Number],
24 19 default: '0.00'
25 20 },
26 21 color: {
... ... @@ -30,31 +25,30 @@ export default {
30 25 //字体大小
31 26 size: {
32 27 type: [String, Number],
33   - default: uni.$u.props.text.size
  28 + default: 15
34 29 },
35 30 //整形部分字体大小可单独定义
36 31 intSize: {
37 32 type: [String, Number],
38   - default: uni.$u.props.text.size
  33 + default: 15
39 34 }
40 35 },
41 36 computed: {
42 37 textArray() {
43   - let array = ['￥'];
44   - if (!/^\d+(\.\d+)?$/.test(this.text)) {
45   - uni.$u.error('组件<u--text-price :text="???" 此处参数应为金额数字');
  38 + let array = ['￥']
  39 + if (!/^\d+(\.\d+)?$/.test(this.price)) {
  40 + console.error('组件<custom-text-price :text="???" 此处参数应为金额数字')
46 41 } else {
47   - let arr = parseFloat(this.text).toFixed(2).split('.');
48   - array.push(arr[0]);
49   - array.push('.' + arr[1]);
  42 + let arr = parseFloat(this.price).toFixed(2).split('.')
  43 + array.push(arr[0])
  44 + array.push('.' + arr[1])
50 45 }
51   - return array;
  46 + return array
52 47 },
53 48 integerSize() {
54 49 return this.intSize ? this.intSize : this.size
55 50 }
56 51 }
57   -};
  52 +}
58 53 </script>
59   -<style>
60   -</style>
61 54 \ No newline at end of file
  55 +<style></style>
... ...
yudao-ui-app/pages/cart/cart.vue
  View file @9e69f6e
1 1 <template>
2   - <view class="container">
3   -
4   - </view>
  2 + <view class="container"> </view>
5 3 </template>
6 4  
7 5 <script>
8   - export default {
9   - data() {
10   - return {
11   - title: ''
12   - }
13   - },
14   - onLoad() {
15   -
16   - },
17   - methods: {
18   -
19   - }
20   - }
  6 +export default {
  7 + data() {
  8 + return {
  9 + title: ''
  10 + }
  11 + },
  12 + onLoad() {},
  13 + methods: {}
  14 +}
21 15 </script>
22 16  
23   -<style lang="scss" scoped>
24   -</style>
  17 +<style lang="scss" scoped></style>
... ...
yudao-ui-app/pages/category/category.vue
  View file @9e69f6e
1 1 <template>
2   - <view class="container">
  2 + <view class="container">
3 3 <view class="search-wrap">
4 4 <u-search placeholder="搜索" disabled height="32" :show-action="false" @click="handleSearchClick"></u-search>
5 5 </view>
6 6 <view class="category-box">
7 7 <view class="box-left">
8 8 <u-list @scrolltolower="scrolltolower">
9   - <u-list-item class="category-item" v-for="(item, index) in categoryList" :key="index">
10   - <view class="item-title" :class="index === currentIndex ? 'active' : ''" @click="handleCategoryClick(index)">
11   - <text>{{item.name}}</text>
  9 + <u-list-item class="category-item" v-for="(item, index) in categoryList" :key="item.id">
  10 + <view class="item-title" :class="{ active: currentIndex === index }" @click="handleCategoryClick(index)">
  11 + <text>{{ item.name }}</text>
12 12 </view>
13 13 </u-list-item>
14 14 </u-list>
... ... @@ -19,7 +19,7 @@
19 19 </view>
20 20 <view>
21 21 <u-list class="prod-list" @scrolltolower="scrolltolower">
22   - <u-list-item v-for="(item, index) in productList" :key="index">
  22 + <u-list-item v-for="(item, index) in productList" :key="item.id">
23 23 <view class="prod-item" @click="handleProdItemClick(item.id)">
24 24 <u--image class="prod-image" width="140rpx" height="140rpx" :src="item.image"></u--image>
25 25 <view class="item-info">
... ... @@ -29,7 +29,7 @@
29 29 <u--text :lines="1" size="12px" color="#939393" :text="item.desc"></u--text>
30 30 </view>
31 31 <view class="price-and-cart">
32   - <u--text-price color="red" size="12" intSize="18" :text="item.price"></u--text-price>
  32 + <custom-text-price color="red" size="12" intSize="18" :price="item.price"></custom-text-price>
33 33 <u-icon name="shopping-cart" color="#2979ff" size="28"></u-icon>
34 34 </view>
35 35 </view>
... ... @@ -39,144 +39,151 @@
39 39 </view>
40 40 </view>
41 41 </view>
42   - </view>
  42 + </view>
43 43 </template>
44 44  
45 45 <script>
46   - import UText from "../../uni_modules/uview-ui/components/u-text/u-text";
47   - export default {
48   - components: {UText},
49   - data() {
50   - return {
51   - currentIndex: 0,
52   - categoryList: [
53   - {
54   - id: 1,
55   - image: 'https://cdn.uviewui.com/uview/swiper/swiper1.png',
56   - name: '关注'
57   - }, {
58   - id: 1,
59   - image: 'https://cdn.uviewui.com/uview/swiper/swiper2.png',
60   - name: '推荐'
61   - }, {
62   - id: 1,
63   - image: 'https://cdn.uviewui.com/uview/swiper/swiper3.png',
64   - name: '电影'
65   - }, {
66   - id: 1,
67   - image: 'https://cdn.uviewui.com/uview/swiper/swiper1.png',
68   - name: '科技'
69   - }, {
70   - id: 1,
71   - image: 'https://cdn.uviewui.com/uview/swiper/swiper2.png',
72   - name: '音乐'
73   - }, {
74   - id: 1,
75   - image: 'https://cdn.uviewui.com/uview/swiper/swiper3.png',
76   - name: '美食'
77   - }, {
78   - id: 1,
79   - image: 'https://cdn.uviewui.com/uview/swiper/swiper1.png',
80   - name: '文化'
81   - }, {
82   - id: 1,
83   - image: 'https://cdn.uviewui.com/uview/swiper/swiper2.png',
84   - name: '财经'
85   - }, {
86   - id: 1,
87   - image: 'https://cdn.uviewui.com/uview/swiper/swiper3.png',
88   - name: '手工'
89   - }],
90   - productList: [
91   - {
92   - id: 1,
93   - image: 'https://cdn.uviewui.com/uview/album/1.jpg',
94   - title: '山不在高，有仙则名。水不在深，有龙则灵。斯是陋室，惟吾德馨。',
95   - desc: '山不在于高，有了神仙就会有名气。水不在于深，有了龙就会有灵气。这是简陋的房子，只是我品德好就感觉不到简陋了。',
96   - price: '13.00'
97   - },
98   - {
99   - id: 2,
100   - image: 'https://cdn.uviewui.com/uview/album/2.jpg',
101   - title: '商品222',
102   - desc: '',
103   - price: '23.00'
104   - },
105   - {
106   - id: 3,
107   - image: 'https://cdn.uviewui.com/uview/album/3.jpg',
108   - title: '商品333',
109   - desc: '商品描述信息2',
110   - price: '33.00'
111   - },
112   - {
113   - id: 4,
114   - image: 'https://cdn.uviewui.com/uview/album/4.jpg',
115   - title: '商品444',
116   - desc: '商品描述信息4',
117   - price: '43.00'
118   - },
119   - {
120   - id: 5,
121   - image: 'https://cdn.uviewui.com/uview/album/5.jpg',
122   - title: '商品555',
123   - desc: '商品描述信息5',
124   - price: '53.00'
125   - }
126   - ]
127   - }
128   - },
129   - onLoad() {
130   - },
131   - methods: {
132   - handleSearchClick(e) {
133   - console.log('监听点击准备跳转页面')
134   - },
135   - handleCategoryClick(index){
136   - if (this.currentIndex !== index) {
137   - this.currentIndex = index;
138   - // TODO 查询下分类商品
  46 +import UText from '../../uni_modules/uview-ui/components/u-text/u-text'
  47 +export default {
  48 + components: { UText },
  49 + data() {
  50 + return {
  51 + currentIndex: 0,
  52 + categoryList: [
  53 + {
  54 + id: 1,
  55 + image: 'https://cdn.uviewui.com/uview/swiper/swiper1.png',
  56 + name: '关注'
  57 + },
  58 + {
  59 + id: 2,
  60 + image: 'https://cdn.uviewui.com/uview/swiper/swiper2.png',
  61 + name: '推荐'
  62 + },
  63 + {
  64 + id: 3,
  65 + image: 'https://cdn.uviewui.com/uview/swiper/swiper3.png',
  66 + name: '电影'
  67 + },
  68 + {
  69 + id: 4,
  70 + image: 'https://cdn.uviewui.com/uview/swiper/swiper1.png',
  71 + name: '科技'
  72 + },
  73 + {
  74 + id: 5,
  75 + image: 'https://cdn.uviewui.com/uview/swiper/swiper2.png',
  76 + name: '音乐'
  77 + },
  78 + {
  79 + id: 6,
  80 + image: 'https://cdn.uviewui.com/uview/swiper/swiper3.png',
  81 + name: '美食'
  82 + },
  83 + {
  84 + id: 7,
  85 + image: 'https://cdn.uviewui.com/uview/swiper/swiper1.png',
  86 + name: '文化'
  87 + },
  88 + {
  89 + id: 8,
  90 + image: 'https://cdn.uviewui.com/uview/swiper/swiper2.png',
  91 + name: '财经'
  92 + },
  93 + {
  94 + id: 9,
  95 + image: 'https://cdn.uviewui.com/uview/swiper/swiper3.png',
  96 + name: '手工'
  97 + }
  98 + ],
  99 + productList: [
  100 + {
  101 + id: 0,
  102 + image: 'https://cdn.uviewui.com/uview/album/1.jpg',
  103 + title: '山不在高，有仙则名。水不在深，有龙则灵。斯是陋室，惟吾德馨。',
  104 + desc: '山不在于高，有了神仙就会有名气。水不在于深，有了龙就会有灵气。这是简陋的房子，只是我品德好就感觉不到简陋了。',
  105 + price: '13.00'
  106 + },
  107 + {
  108 + id: 2,
  109 + image: 'https://cdn.uviewui.com/uview/album/2.jpg',
  110 + title: '商品222',
  111 + desc: '',
  112 + price: '23.00'
  113 + },
  114 + {
  115 + id: 3,
  116 + image: 'https://cdn.uviewui.com/uview/album/3.jpg',
  117 + title: '商品333',
  118 + desc: '商品描述信息2',
  119 + price: '33.00'
  120 + },
  121 + {
  122 + id: 4,
  123 + image: 'https://cdn.uviewui.com/uview/album/4.jpg',
  124 + title: '商品444',
  125 + desc: '商品描述信息4',
  126 + price: '43.00'
  127 + },
  128 + {
  129 + id: 5,
  130 + image: 'https://cdn.uviewui.com/uview/album/5.jpg',
  131 + title: '商品555',
  132 + desc: '商品描述信息5',
  133 + price: '53.00'
139 134 }
140   - },
141   - handleProdItemClick(productId){
142   - uni.$u.route('/pages/product/product', {
143   - productId: productId
144   - });
  135 + ]
  136 + }
  137 + },
  138 + onLoad() {},
  139 + methods: {
  140 + handleSearchClick(e) {
  141 + console.log('监听点击准备跳转页面')
  142 + },
  143 + handleCategoryClick(index) {
  144 + if (this.currentIndex !== index) {
  145 + this.currentIndex = index
  146 + // TODO 查询下分类商品
145 147 }
146   - }
147   - }
  148 + },
  149 + handleProdItemClick(productId) {
  150 + uni.$u.route('/pages/product/product', {
  151 + productId: productId
  152 + })
  153 + }
  154 + }
  155 +}
148 156 </script>
149 157  
150 158 <style lang="scss" scoped>
151   -
152 159 .search-wrap {
153 160 background: $custom-bg-color;
154 161 padding: 20rpx;
155 162 }
156 163  
157   -.category-box{
  164 +.category-box {
158 165 display: flex;
159   - .box-left{
  166 + .box-left {
160 167 width: 180rpx;
161 168 padding-top: 20rpx;
162 169 border-right: $custom-border-style;
163   - .category-item{
  170 + .category-item {
164 171 border-bottom: $custom-border-style;
165 172 padding: 20rpx 0;
166   - .item-title{
  173 + .item-title {
167 174 padding-left: 30rpx;
168 175 font-size: 30rpx;
169   - &.active{
  176 + &.active {
170 177 border-left: 6rpx solid $u-primary;
171 178 font-weight: 700;
172 179 }
173 180 }
174 181 }
175 182 }
176   - .box-right{
  183 + .box-right {
177 184 width: 550rpx;
178 185 padding-right: 20rpx;
179   - .category-image{
  186 + .category-image {
180 187 padding: 20rpx;
181 188 }
182 189  
... ... @@ -186,9 +193,7 @@
186 193 .prod-item {
187 194 padding: 10rpx 20rpx;
188 195 background: #fff;
189   - display: flex;
190   - flex-direction: row;
191   - justify-content: space-between;
  196 + @include flex-space-between;
192 197 border-bottom: $custom-border-style;
193 198  
194 199 .prod-image {
... ... @@ -206,8 +211,7 @@
206 211 padding-bottom: 10rpx;
207 212 }
208 213 .price-and-cart {
209   - display: flex;
210   - justify-content: space-between;
  214 + @include flex-space-between;
211 215 }
212 216 }
213 217 }
... ...
yudao-ui-app/pages/forgot/forgot.vue
  View file @9e69f6e
1 1 <template>
2 2 <view class="container">
3   -
4 3 <view class="unp-header">
5 4 <view class="unp-logo">
6 5 <u-avatar size="80" icon="github-circle-fill" fontSize="80"></u-avatar>
... ... @@ -36,21 +35,12 @@
36 35 <!-- 占位 -->
37 36 </view>
38 37  
39   - <u-button
40   - type="error"
41   - text="重置密码"
42   - customStyle="margin-top: 50px"
43   - @click="handleSubmit"
44   - ></u-button>
  38 + <u-button type="error" text="重置密码" customStyle="margin-top: 50px" @click="handleSubmit"></u-button>
45 39  
46 40 <u-gap height="20"></u-gap>
47 41 <u-button type="info" text="返回" @click="navigateBack()"></u-button>
48   -
49 42 </u--form>
50   -
51   -
52 43 </view>
53   -
54 44 </view>
55 45 </template>
56 46  
... ... @@ -64,24 +54,24 @@ export default {
64 54 formData: {
65 55 username: '',
66 56 code: '',
67   - password: '',
  57 + password: ''
68 58 },
69 59 rules: {
70   - 'username': {
  60 + username: {
71 61 type: 'string',
72 62 max: 20,
73 63 required: true,
74 64 message: '请输入您的账号',
75 65 trigger: ['blur', 'change']
76 66 },
77   - 'code': {
  67 + code: {
78 68 type: 'number',
79 69 max: 6,
80 70 required: true,
81 71 message: '请输入验证码',
82 72 trigger: ['blur', 'change']
83 73 },
84   - 'password': {
  74 + password: {
85 75 type: 'string',
86 76 max: 20,
87 77 required: true,
... ... @@ -91,24 +81,22 @@ export default {
91 81 }
92 82 }
93 83 },
94   - onLoad() {
95   -
96   - },
  84 + onLoad() {},
97 85 methods: {
98   - handleUsernameChange(e){
99   - let str = uni.$u.trim(e, 'all');
  86 + handleUsernameChange(e) {
  87 + let str = uni.$u.trim(e, 'all')
100 88 this.$nextTick(() => {
101 89 this.formData.username = str
102 90 })
103 91 },
104   - handlePasswordChange(e){
105   - let str = uni.$u.trim(e, 'all');
  92 + handlePasswordChange(e) {
  93 + let str = uni.$u.trim(e, 'all')
106 94 this.$nextTick(() => {
107 95 this.formData.password = str
108 96 })
109 97 },
110 98 codeChange(text) {
111   - this.tips = text;
  99 + this.tips = text
112 100 },
113 101 getCode() {
114 102 if (this.$refs.uCode.canGetCode) {
... ... @@ -117,22 +105,23 @@ export default {
117 105 title: '正在获取验证码'
118 106 })
119 107 setTimeout(() => {
120   - uni.hideLoading();
  108 + uni.hideLoading()
121 109 // 这里此提示会被this.start()方法中的提示覆盖
122   - uni.$u.toast('验证码已发送');
  110 + uni.$u.toast('验证码已发送')
123 111 // 通知验证码组件内部开始倒计时
124   - this.$refs.uCode.start();
125   - }, 2000);
  112 + this.$refs.uCode.start()
  113 + }, 2000)
126 114 } else {
127   - uni.$u.toast('倒计时结束后再发送');
  115 + uni.$u.toast('倒计时结束后再发送')
128 116 }
129 117 },
130 118 handleSubmit() {
131   - this.$refs.form.validate().then(res => {
132   - uni.$u.toast('点击了重置密码')
133   - }).catch(err => {
134   -
135   - })
  119 + this.$refs.form
  120 + .validate()
  121 + .then(res => {
  122 + uni.$u.toast('点击了重置密码')
  123 + })
  124 + .catch(err => {})
136 125 },
137 126 navigateBack() {
138 127 uni.navigateBack()
... ... @@ -142,26 +131,17 @@ export default {
142 131 </script>
143 132  
144 133 <style lang="scss" scoped>
145   -
146 134 .unp-header {
147 135 height: 400rpx;
148   - display: flex;
149   - align-items: center;
150   - justify-content: center;
  136 + @include flex-center;
151 137 .unp-logo {
152   - display: flex;
153   - flex-direction: column;
154   - align-items: center;
155   - justify-content: center;
  138 + @include flex-center;
156 139 }
157 140 }
158 141  
159 142 .unp-box {
160   - display: flex;
161   - flex-direction: column;
162   - align-items: center;
163   - justify-content: center;
164   - .unp-form{
  143 + @include flex-center(column);
  144 + .unp-form {
165 145 width: 560rpx;
166 146 }
167 147 }
... ... @@ -169,14 +149,10 @@ export default {
169 149 .lk-group {
170 150 height: 40rpx;
171 151 margin-top: 40rpx;
172   - display: flex;
173   - align-items: center;
174   - justify-content: space-between;
  152 + @include flex-space-between;
175 153 font-size: 12rpx;
176 154  
177 155 color: $u-primary;
178 156 text-decoration: $u-primary;
179 157 }
180   -
181   -
182 158 </style>
... ...
yudao-ui-app/pages/index/index.vue
  View file @9e69f6e
... ... @@ -8,20 +8,20 @@
8 8 </u-sticky>
9 9  
10 10 <!--轮播图-->
11   - <u-swiper :list="swiperList" previousMargin="20" nextMargin="20" circular height="200" @change="e => current = e.current" :autoplay="true" @click="handleSwiperClick">
  11 + <u-swiper :list="swiperList" previousMargin="20" nextMargin="20" circular height="200" @change="e => (current = e.current)" :autoplay="true" @click="handleSwiperClick">
12 12 <view slot="indicator" class="indicator">
13   - <view class="indicator__dot" v-for="(item, index) in swiperList" :key="index" :class="[index === current && 'indicator__dot--active']">
14   - </view>
  13 + <view class="indicator__dot" v-for="(item, index) in swiperList" :key="index" :class="[index === current && 'indicator__dot--active']"> </view>
15 14 </view>
16 15 </u-swiper>
17 16  
18 17 <u-gap height="20px"></u-gap>
19 18  
20 19 <!--宫格菜单按钮-->
21   - <u-grid :border="false" col="4"><u-grid-item v-for="(item,index) in menuList" :key="index">
22   - <u-icon :name="item.icon" :size="40"></u-icon>
23   - <text class="grid-title">{{item.title}}</text>
24   - </u-grid-item>
  20 + <u-grid :border="false" col="4"
  21 + ><u-grid-item v-for="(item, index) in menuList" :key="index">
  22 + <u-icon :name="item.icon" :size="40"></u-icon>
  23 + <text class="grid-title">{{ item.title }}</text>
  24 + </u-grid-item>
25 25 </u-grid>
26 26  
27 27 <u-gap height="15px"></u-gap>
... ... @@ -38,7 +38,7 @@
38 38 <text class="see-more">查看更多</text>
39 39 </view>
40 40 <u-grid class="prod-grid" :border="false" col="3">
41   - <u-grid-item class="prod-item-box" v-for="(item,index) in productList" :key="index">
  41 + <u-grid-item class="prod-item-box" v-for="(item, index) in productList" :key="item.id">
42 42 <view class="prod-item" @click="handleProdItemClick(item.id)">
43 43 <u--image class="prod-image" width="230rpx" height="230rpx" :src="item.image"></u--image>
44 44 <view class="item-info">
... ... @@ -46,7 +46,7 @@
46 46 <u--text :lines="2" size="14px" color="#333333" :text="item.title"></u--text>
47 47 </view>
48 48 <view class="price-and-cart">
49   - <u--text-price color="red" size="12" intSize="18" :text="item.price"></u--text-price>
  49 + <custom-text-price color="red" size="12" intSize="18" :price="item.price"></custom-text-price>
50 50 <u-icon name="shopping-cart" color="#2979ff" size="28"></u-icon>
51 51 </view>
52 52 </view>
... ... @@ -63,7 +63,7 @@
63 63 <text class="more">更多 &gt;</text>
64 64 </view>
65 65 <u-grid class="prod-grid" :border="false" col="2">
66   - <u-grid-item class="prod-item-box" v-for="(item,index) in productList" :key="index">
  66 + <u-grid-item class="prod-item-box" v-for="(item, index) in productList" :key="item.id">
67 67 <view class="prod-item" @click="handleProdItemClick(item.id)">
68 68 <u--image class="prod-image" width="345rpx" height="345rpx" :src="item.image"></u--image>
69 69 <view class="item-info">
... ... @@ -72,7 +72,7 @@
72 72 <u--text :lines="1" size="12px" color="#939393" :text="item.desc"></u--text>
73 73 </view>
74 74 <view class="price-and-cart">
75   - <u--text-price color="red" size="12" intSize="18" :text="item.price"></u--text-price>
  75 + <custom-text-price color="red" size="12" intSize="18" :price="item.price"></custom-text-price>
76 76 <u-icon name="shopping-cart" color="#2979ff" size="28"></u-icon>
77 77 </view>
78 78 </view>
... ... @@ -90,7 +90,7 @@
90 90 </view>
91 91  
92 92 <u-list class="prod-list" @scrolltolower="scrolltolower">
93   - <u-list-item v-for="(item, index) in productList" :key="index">
  93 + <u-list-item v-for="(item, index) in productList" :key="item.id">
94 94 <view class="prod-item" @click="handleProdItemClick(item.id)">
95 95 <u--image class="prod-image" width="210rpx" height="210rpx" :src="item.image"></u--image>
96 96 <view class="item-info">
... ... @@ -100,46 +100,40 @@
100 100 <u--text class="info-desc" :lines="2" size="12px" color="#939393" :text="item.desc"></u--text>
101 101 </view>
102 102 <view class="price-and-cart">
103   - <u--text-price color="red" size="12" intSize="18" :text="item.price"></u--text-price>
  103 + <custom-text-price color="red" size="12" intSize="18" :price="item.price"></custom-text-price>
104 104 <u-icon name="shopping-cart" color="#2979ff" size="28"></u-icon>
105 105 </view>
106 106 </view>
107 107 </view>
108 108 </u-list-item>
109 109 </u-list>
110   -
111 110 </view>
112 111 </view>
113 112 <u-gap height="5px"></u-gap>
114 113 <!--加载更多-->
115   - <u-loadmore fontSize="32rpx" :status="status" :loading-text="loadingText" :loadmore-text="loadmoreText" :nomore-text="nomoreText"/>
  114 + <u-loadmore fontSize="32rpx" :status="status" :loading-text="loadingText" :loadmore-text="loadmoreText" :nomore-text="nomoreText" />
116 115  
117 116 <u-gap height="10px"></u-gap>
118 117 </view>
119 118 </template>
120 119  
121 120 <script>
122   -import {getBannerData,getNoticeData} from "../../common/api";
  121 +import { getBannerData, getNoticeData } from '../../common/api'
123 122  
124 123 export default {
125   - components: {
126   -
127   - },
  124 + components: {},
128 125 data() {
129 126 return {
130 127 current: 0,
131 128 currentNum: 0,
132   - bannerList: [
133   - 'https://cdn.uviewui.com/uview/swiper/swiper3.png',
134   - 'https://cdn.uviewui.com/uview/swiper/swiper2.png',
135   - 'https://cdn.uviewui.com/uview/swiper/swiper1.png',],
136   - menuList: [{icon: 'gift', title: '热门推荐'}, {icon: 'star', title: '收藏转发'}, {icon: 'thumb-up', title: '点赞投币'}, {icon: 'heart', title: '感谢支持'}],
137   - noticeList:[
138   - '寒雨连江夜入吴',
139   - '平明送客楚山孤',
140   - '洛阳亲友如相问',
141   - '一片冰心在玉壶'
  129 + bannerList: ['https://cdn.uviewui.com/uview/swiper/swiper3.png', 'https://cdn.uviewui.com/uview/swiper/swiper2.png', 'https://cdn.uviewui.com/uview/swiper/swiper1.png'],
  130 + menuList: [
  131 + { icon: 'gift', title: '热门推荐' },
  132 + { icon: 'star', title: '收藏转发' },
  133 + { icon: 'thumb-up', title: '点赞投币' },
  134 + { icon: 'heart', title: '感谢支持' }
142 135 ],
  136 + noticeList: ['寒雨连江夜入吴', '平明送客楚山孤', '洛阳亲友如相问', '一片冰心在玉壶'],
143 137 productList: [
144 138 {
145 139 id: 1,
... ... @@ -189,43 +183,47 @@ export default {
189 183 },
190 184 methods: {
191 185 loadBannerData() {
192   - getBannerData().then(res => {
193   - this.bannerList = res.data;
194   - }).catch(err => {
195   - //console.log(err)
196   - })
  186 + getBannerData()
  187 + .then(res => {
  188 + this.bannerList = res.data
  189 + })
  190 + .catch(err => {
  191 + //console.log(err)
  192 + })
197 193 },
198 194 loadNoticeData() {
199   - getNoticeData().then(res => {
200   - this.noticeList = res.data;
201   - }).catch(err => {
202   - //console.log(err)
203   - })
  195 + getNoticeData()
  196 + .then(res => {
  197 + this.noticeList = res.data
  198 + })
  199 + .catch(err => {
  200 + //console.log(err)
  201 + })
204 202 },
205 203 handleSearchClick(e) {
206 204 console.log('监听点击准备跳转页面')
207 205 },
208   - handleSwiperClick(index){
209   - console.log('点击了图片索引值：',index)
  206 + handleSwiperClick(index) {
  207 + console.log('点击了图片索引值：', index)
210 208 },
211   - handleProdItemClick(productId){
  209 + handleProdItemClick(productId) {
212 210 uni.$u.route('/pages/product/product', {
213 211 productId: productId
214   - });
  212 + })
215 213 }
216 214 },
217 215 computed: {
218   - swiperList(){
  216 + swiperList() {
219 217 return this.bannerList.map(item => {
220   - if (item){
221   - return item;
  218 + if (item) {
  219 + return item
222 220 }
223 221 })
224 222 },
225 223 noticeTextList() {
226 224 return this.noticeList.map(item => {
227   - if (item.title){
228   - return item.title;
  225 + if (item.title) {
  226 + return item.title
229 227 }
230 228 })
231 229 }
... ... @@ -234,7 +232,6 @@ export default {
234 232 </script>
235 233  
236 234 <style lang="scss" scoped>
237   -
238 235 .search-wrap {
239 236 background: $custom-bg-color;
240 237 padding: 20rpx;
... ... @@ -266,10 +263,7 @@ export default {
266 263 .prod-block {
267 264 margin-top: -160px;
268 265 .bloc-header {
269   - display: flex;
270   - flex-direction: row;
271   - align-items: center;
272   - justify-content: space-between;
  266 + @include flex-space-between;
273 267 padding: 10rpx 30rpx;
274 268  
275 269 .bloc-title {
... ... @@ -287,7 +281,8 @@ export default {
287 281 }
288 282 }
289 283  
290   - &.half, &.list {
  284 + &.half,
  285 + &.list {
291 286 margin-top: 0;
292 287 .bloc-header {
293 288 margin-top: 50rpx;
... ... @@ -321,8 +316,7 @@ export default {
321 316 padding-bottom: 10rpx;
322 317 }
323 318 .price-and-cart {
324   - display: flex;
325   - justify-content: space-between;
  319 + @include flex-space-between;
326 320 }
327 321 }
328 322 }
... ... @@ -336,9 +330,7 @@ export default {
336 330 .prod-item {
337 331 padding: 20rpx;
338 332 background: #fff;
339   - display: flex;
340   - flex-direction: row;
341   - justify-content: space-between;
  333 + @include flex-space-between;
342 334 border-bottom: $custom-border-style;
343 335  
344 336 .prod-image {
... ... @@ -356,11 +348,9 @@ export default {
356 348 padding-bottom: 10rpx;
357 349 }
358 350 .price-and-cart {
359   - display: flex;
360   - justify-content: space-between;
  351 + @include flex-space-between;
361 352 }
362 353 }
363 354 }
364 355 }
365   -
366 356 </style>
... ...
yudao-ui-app/pages/login/login.vue
  View file @9e69f6e
1 1 <template>
2   - <view class="container">
3   -
  2 + <view class="container">
4 3 <view class="unp-header">
5 4 <view class="unp-logo">
6 5 <u-avatar size="80" icon="github-circle-fill" fontSize="80"></u-avatar>
... ... @@ -23,12 +22,12 @@
23 22 <u-gap height="20"></u-gap>
24 23  
25 24 <u-form-item v-if="currentModeIndex === 0" label="密码" prop="password" labelWidth="60" borderBottom ref="item-password">
26   - <u-input :type="inputType" maxlength="16" v-model="formData.password" placeholder="请填写密码" border="none">
27   - <template slot="suffix">
  25 + <u-input :type="inputType" maxlength="16" v-model="formData.password" placeholder="请填写密码" border="none">
  26 + <template slot="suffix">
28 27 <u-icon v-if="inputType === 'password'" size="20" color="#666666" name="eye-fill" @click="inputType = 'text'"></u-icon>
29 28 <u-icon v-if="inputType === 'text'" size="20" color="#666666" name="eye-off" @click="inputType = 'password'"></u-icon>
30   - </template>
31   - </u-input>
  29 + </template>
  30 + </u-input>
32 31 </u-form-item>
33 32  
34 33 <u-form-item v-else label="验证码" prop="code" labelWidth="60" borderBottom>
... ... @@ -41,170 +40,160 @@
41 40  
42 41 <u-gap height="20"></u-gap>
43 42 <u-button type="info" text="返回" @click="navigateBack()"></u-button>
44   -
45 43 </u--form>
46   -
47 44 </view>
48   -
49   - </view>
  45 + </view>
50 46 </template>
51 47  
52 48 <script>
53   -import {passwordLogin,sendSmsCode,smsLogin} from "../../common/api";
54   -
55   - export default {
56   - data() {
57   - return {
58   - //租户ID
59   - agent: 1,
60   - currentModeIndex: 0,
61   - loginModeList: ['密码登录', '验证码登录'],
62   - inputType: 'password',
63   - codeDisabled: false,
64   - codeTips: '',
65   - formData: {
66   - mobile: '15601691234',
67   - password: '',
68   - code: ''
69   - },
70   - rules: {
71   - 'mobile': [
72   - {
73   - type: 'integer',
74   - required: true,
75   - message: '请填写手机号',
76   - trigger: ['blur', 'change']
77   - },
78   - {
79   - // 自定义验证函数，见上说明
80   - validator: (rule, value, callback) => {
81   - // 上面有说，返回true表示校验通过，返回false表示不通过
82   - // uni.$u.test.mobile()就是返回true或者false的
83   - return uni.$u.test.mobile(value);
84   - },
85   - message: '手机号码不正确',
86   - // 触发器可以同时用blur和change
87   - trigger: ['change','blur'],
88   - }
89   - ],
90   - 'password': {
91   - type: 'string',
92   - min: 4,
93   - max: 16,
94   - required: true,
95   - message: '密码长度4-16位密码',
96   - trigger: ['blur', 'change']
97   - },
98   - 'code': {
  49 +import { passwordLogin, sendSmsCode, smsLogin } from '../../common/api'
  50 +
  51 +export default {
  52 + data() {
  53 + return {
  54 + //租户ID
  55 + agent: 1,
  56 + currentModeIndex: 0,
  57 + loginModeList: ['密码登录', '验证码登录'],
  58 + inputType: 'password',
  59 + codeDisabled: false,
  60 + codeTips: '',
  61 + formData: {
  62 + mobile: '15601691234',
  63 + password: '',
  64 + code: ''
  65 + },
  66 + rules: {
  67 + mobile: [
  68 + {
99 69 type: 'integer',
100   - len: 4,
101 70 required: true,
102   - message: '请填写4位验证码',
  71 + message: '请填写手机号',
103 72 trigger: ['blur', 'change']
  73 + },
  74 + {
  75 + // 自定义验证函数，见上说明
  76 + validator: (rule, value, callback) => {
  77 + // 上面有说，返回true表示校验通过，返回false表示不通过
  78 + // uni.$u.test.mobile()就是返回true或者false的
  79 + return uni.$u.test.mobile(value)
  80 + },
  81 + message: '手机号码不正确',
  82 + // 触发器可以同时用blur和change
  83 + trigger: ['change', 'blur']
104 84 }
  85 + ],
  86 + password: {
  87 + type: 'string',
  88 + min: 4,
  89 + max: 16,
  90 + required: true,
  91 + message: '密码长度4-16位密码',
  92 + trigger: ['blur', 'change']
  93 + },
  94 + code: {
  95 + type: 'integer',
  96 + len: 4,
  97 + required: true,
  98 + message: '请填写4位验证码',
  99 + trigger: ['blur', 'change']
105 100 }
106   - }
107   - },
108   - onLoad() {
109   -
110   - },onReady(){
111   - // 如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则
112   - this.$refs.form.setRules(this.rules)
  101 + }
  102 + }
  103 + },
  104 + onLoad() {},
  105 + onReady() {
  106 + // 如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则
  107 + this.$refs.form.setRules(this.rules)
  108 + },
  109 + methods: {
  110 + handleModeChange(index) {
  111 + if (index !== this.currentModeIndex) {
  112 + this.currentModeIndex = index
  113 + this.$refs.form.clearValidate()
  114 + }
113 115 },
114   - methods: {
115   - handleModeChange(index) {
116   - if (index !== this.currentModeIndex){
117   - this.currentModeIndex = index;
118   - this.$refs.form.clearValidate();
119   - }
120   - },
121   - codeChange(text) {
122   - this.codeTips = text;
123   - },
124   - getCode() {
125   - const mobile = this.formData.mobile;
126   - if (!mobile) {
127   - uni.$u.toast('请填写手机号');
128   - } else if (!uni.$u.test.mobile(mobile)){
129   - uni.$u.toast('手机号格式不正确');
130   - } else if (this.$refs.uCode.canGetCode) {
131   - // 模拟向后端请求验证码
132   - uni.showLoading({
133   - title: '正在获取验证码'
134   - });
  116 + codeChange(text) {
  117 + this.codeTips = text
  118 + },
  119 + getCode() {
  120 + const mobile = this.formData.mobile
  121 + if (!mobile) {
  122 + uni.$u.toast('请填写手机号')
  123 + } else if (!uni.$u.test.mobile(mobile)) {
  124 + uni.$u.toast('手机号格式不正确')
  125 + } else if (this.$refs.uCode.canGetCode) {
  126 + // 模拟向后端请求验证码
  127 + uni.showLoading({
  128 + title: '正在获取验证码'
  129 + })
135 130  
136   - //scene:1登陆获取验证码场景
137   - sendSmsCode({agent: 1, mobile:mobile, scene:1 }).then(res => {
  131 + //scene:1登陆获取验证码场景
  132 + sendSmsCode({ agent: 1, mobile: mobile, scene: 1 })
  133 + .then(res => {
138 134 //console.log(res)
139   - uni.hideLoading();
140   - if (res.data.code === 0){
  135 + uni.hideLoading()
  136 + if (res.data.code === 0) {
141 137 // 这里此提示会被this.start()方法中的提示覆盖
142   - uni.$u.toast('验证码已发送');
  138 + uni.$u.toast('验证码已发送')
143 139 // 通知验证码组件内部开始倒计时
144   - this.$refs.uCode.start();
  140 + this.$refs.uCode.start()
145 141 } else {
146   - uni.$u.toast(res.data.msg);
  142 + uni.$u.toast(res.data.msg)
147 143 }
148   - }).catch(err => {
149   - uni.$u.toast('服务器接口请求异常');
150 144 })
151   - } else {
152   - uni.$u.toast('倒计时结束后再发送');
153   - }
154   - },
155   - handleSubmit() {
156   - this.$refs.form.validate().then(res => {
157   - uni.$u.toast('登录');
158   - if (this.currentModeIndex === 0){
159   - passwordLogin({agent: 1, mobile:this.formData.mobile, password:this.formData.password}).then(res => {
160   - if (res.data.code === 0){
161   - uni.$u.toast('登录成功');
  145 + .catch(err => {
  146 + uni.$u.toast('服务器接口请求异常')
  147 + })
  148 + } else {
  149 + uni.$u.toast('倒计时结束后再发送')
  150 + }
  151 + },
  152 + handleSubmit() {
  153 + this.$refs.form.validate().then(res => {
  154 + uni.$u.toast('登录')
  155 + if (this.currentModeIndex === 0) {
  156 + passwordLogin({ agent: 1, mobile: this.formData.mobile, password: this.formData.password })
  157 + .then(res => {
  158 + if (res.data.code === 0) {
  159 + uni.$u.toast('登录成功')
162 160 // TODO 登录成功，保存toke
163 161 } else {
164   - uni.$u.toast(res.data.msg);
  162 + uni.$u.toast(res.data.msg)
165 163 // TODO 登录失败
166   - }
167   - }).catch(err => {
168   - uni.$u.toast('服务器接口请求异常');
  164 + }
169 165 })
170   - } else if (this.currentModeIndex === 1) {
171   - smsLogin({agent: 1, mobile:this.formData.mobile, code:this.formData.code})
172   - }
173   - })
174   - },
175   - navigateBack() {
176   - uni.navigateBack()
177   - }
178   - }
179   - }
  166 + .catch(err => {
  167 + uni.$u.toast('服务器接口请求异常')
  168 + })
  169 + } else if (this.currentModeIndex === 1) {
  170 + smsLogin({ agent: 1, mobile: this.formData.mobile, code: this.formData.code })
  171 + }
  172 + })
  173 + },
  174 + navigateBack() {
  175 + uni.navigateBack()
  176 + }
  177 + }
  178 +}
180 179 </script>
181 180  
182 181 <style lang="scss" scoped>
183   -
184 182 .unp-header {
185 183 height: 400rpx;
186   - display: flex;
187   - align-items: center;
188   - justify-content: center;
  184 + @include flex-center;
189 185 .unp-logo {
190   - display: flex;
191   - flex-direction: column;
192   - align-items: center;
193   - justify-content: center;
  186 + @include flex-center(column);
194 187 }
195 188 }
196 189  
197   -
198 190 .unp-box {
199   - display: flex;
200   - flex-direction: column;
201   - align-items: center;
202   - justify-content: center;
  191 + @include flex-center(column);
203 192  
204   - .mode-section{
  193 + .mode-section {
205 194 width: 560rpx;
206 195 }
207   - .unp-form{
  196 + .unp-form {
208 197 width: 560rpx;
209 198 }
210 199 }
... ... @@ -212,14 +201,10 @@ import {passwordLogin,sendSmsCode,smsLogin} from &quot;../../common/api&quot;;
212 201 .lk-group {
213 202 height: 40rpx;
214 203 margin-top: 40rpx;
215   - display: flex;
216   - align-items: center;
217   - justify-content: space-between;
  204 + @include flex-space-between;
218 205 font-size: 12rpx;
219 206  
220 207 color: $u-primary;
221 208 text-decoration: $u-primary;
222 209 }
223   -
224   -
225 210 </style>
... ...
yudao-ui-app/pages/profile/profile.vue
  View file @9e69f6e
1 1 <template>
2   - <view class="container">
3   -个人资料
4   - </view>
  2 + <view class="container"> 个人资料 </view>
5 3 </template>
6 4  
7 5 <script>
8   - export default {
9   - data() {
10   - return {
11   - title: ''
12   - }
13   - },
14   - onLoad() {
15   -
16   - },
17   - methods: {
18   -
19   - }
20   - }
  6 +export default {
  7 + data() {
  8 + return {
  9 + title: ''
  10 + }
  11 + },
  12 + onLoad() {},
  13 + methods: {}
  14 +}
21 15 </script>
22 16  
23   -<style lang="scss" scoped>
24   -</style>
  17 +<style lang="scss" scoped></style>
... ...
yudao-ui-app/pages/register/register.vue
  View file @9e69f6e
1 1 <template>
2 2 <view class="container">
3   -
4 3 <view class="unp-header">
5 4 <view class="unp-logo">
6 5 <u-avatar size="80" icon="github-circle-fill" fontSize="80"></u-avatar>
... ... @@ -25,24 +24,15 @@
25 24 </u-form-item>
26 25  
27 26 <view class="lk-group">
28   - <!-- 占位 -->
  27 + <!-- 占位 -->
29 28 </view>
30 29  
31   - <u-button
32   - type="success"
33   - text="注册账号"
34   - customStyle="margin-top: 50px"
35   - @click="handleSubmit"
36   - ></u-button>
  30 + <u-button type="success" text="注册账号" customStyle="margin-top: 50px" @click="handleSubmit"></u-button>
37 31  
38 32 <u-gap height="20"></u-gap>
39 33 <u-button type="info" text="返回" @click="navigateBack()"></u-button>
40   -
41 34 </u--form>
42   -
43   -
44 35 </view>
45   -
46 36 </view>
47 37 </template>
48 38  
... ... @@ -53,17 +43,17 @@ export default {
53 43 inputType: 'password',
54 44 formData: {
55 45 username: '',
56   - password: '',
  46 + password: ''
57 47 },
58 48 rules: {
59   - 'username': {
  49 + username: {
60 50 type: 'string',
61 51 max: 20,
62 52 required: true,
63 53 message: '请输入您的账号',
64 54 trigger: ['blur', 'change']
65 55 },
66   - 'password': {
  56 + password: {
67 57 type: 'string',
68 58 max: 20,
69 59 required: true,
... ... @@ -73,28 +63,27 @@ export default {
73 63 }
74 64 }
75 65 },
76   - onLoad() {
77   -
78   - },
  66 + onLoad() {},
79 67 methods: {
80   - handleUsernameChange(e){
81   - let str = uni.$u.trim(e, 'all');
  68 + handleUsernameChange(e) {
  69 + let str = uni.$u.trim(e, 'all')
82 70 this.$nextTick(() => {
83 71 this.formData.username = str
84 72 })
85 73 },
86   - handlePasswordChange(e){
87   - let str = uni.$u.trim(e, 'all');
  74 + handlePasswordChange(e) {
  75 + let str = uni.$u.trim(e, 'all')
88 76 this.$nextTick(() => {
89 77 this.formData.password = str
90 78 })
91 79 },
92 80 handleSubmit() {
93   - this.$refs.form.validate().then(res => {
94   - uni.$u.toast('点击了注册账号')
95   - }).catch(err => {
96   -
97   - })
  81 + this.$refs.form
  82 + .validate()
  83 + .then(res => {
  84 + uni.$u.toast('点击了注册账号')
  85 + })
  86 + .catch(err => {})
98 87 },
99 88 navigateBack() {
100 89 uni.navigateBack()
... ... @@ -104,41 +93,28 @@ export default {
104 93 </script>
105 94  
106 95 <style lang="scss" scoped>
107   -
108 96 .unp-header {
109 97 height: 400rpx;
110   - display: flex;
111   - align-items: center;
112   - justify-content: center;
  98 + @include flex-center;
113 99 .unp-logo {
114   - display: flex;
115   - flex-direction: column;
116   - align-items: center;
117   - justify-content: center;
  100 + @include flex-center;
118 101 }
119 102 }
120 103  
121 104 .unp-box {
122   - display: flex;
123   - flex-direction: column;
124   - align-items: center;
125   - justify-content: center;
126   - .unp-form{
  105 + @include flex-center;
  106 + .unp-form {
127 107 width: 560rpx;
128 108 }
129 109 }
130 110  
131 111 .lk-group {
  112 + @include flex-space-between;
132 113 height: 40rpx;
133 114 margin-top: 40rpx;
134   - display: flex;
135   - align-items: center;
136   - justify-content: space-between;
137 115 font-size: 12rpx;
138 116  
139 117 color: $u-primary;
140 118 text-decoration: $u-primary;
141 119 }
142   -
143   -
144 120 </style>
... ...
yudao-ui-app/pages/user/user.vue
  View file @9e69f6e
1 1 <template>
2   - <view class="container">
  2 + <view class="container">
3 3 <view class="user-header">
4 4 <view class="user-info" @click="handleUserInfoClick">
5 5 <u-avatar size="80" :src="avatar"></u-avatar>
6   - <text class="nick-name">{{nickName}}</text>
  6 + <text class="nick-name">{{ nickName }}</text>
7 7 </view>
8 8 </view>
9 9  
... ... @@ -19,10 +19,11 @@
19 19 </view>
20 20  
21 21 <view class="order-status-box">
22   - <u-grid :border="false" :col="orderStatusList.length"><u-grid-item v-for="(item,index) in orderStatusList" :key="index">
23   - <u-icon :name="item.icon" :size="32"></u-icon>
24   - <text class="grid-title">{{item.title}}</text>
25   - </u-grid-item>
  22 + <u-grid :border="false" :col="orderStatusList.length"
  23 + ><u-grid-item v-for="(item, index) in orderStatusList" :key="index">
  24 + <u-icon :name="item.icon" :size="32"></u-icon>
  25 + <text class="grid-title">{{ item.title }}</text>
  26 + </u-grid-item>
26 27 </u-grid>
27 28 </view>
28 29 </view>
... ... @@ -30,10 +31,11 @@
30 31 <u-gap height="10" bgColor="#f3f3f3"></u-gap>
31 32  
32 33 <view class="stat-box">
33   - <u-grid :border="false" col="3"><u-grid-item v-for="(item,index) in statList" :key="index">
34   - <text class="grid-value">{{item.value}}</text>
35   - <text class="grid-title">{{item.title}}</text>
36   - </u-grid-item>
  34 + <u-grid :border="false" col="3"
  35 + ><u-grid-item v-for="(item, index) in statList" :key="index">
  36 + <text class="grid-value">{{ item.value }}</text>
  37 + <text class="grid-title">{{ item.title }}</text>
  38 + </u-grid-item>
37 39 </u-grid>
38 40 </view>
39 41  
... ... @@ -47,47 +49,48 @@
47 49 </u-cell-group>
48 50  
49 51 <u-button class="logout-btn" type="error" color="#ea322b" text="确定"></u-button>
50   -
51   - </view>
  52 + </view>
52 53 </template>
53 54  
54 55 <script>
55   - export default {
56   - data() {
57   - return {
58   - avatar:'',
59   - nickName:'点击登录',
60   - orderStatusList: [{icon: 'rmb-circle', title: '待支付'}, {icon: 'car', title: '代发货'}, {icon: 'order', title: '待收货'}, {icon: 'integral', title: '已完成'}],
61   - statList: [{value: '2', title: '我的收藏'}, {value: '3', title: '我的消息'}, {value: '3', title: '我的足迹'}]
62   - }
63   - },
64   - onLoad() {
65   -
66   - },
67   - methods: {
68   - handleUserInfoClick(){
69   - // TODO 判断是否已经登录逻辑
70   - if (!uni.getStorageSync('token')) {
71   - uni.$u.route('/pages/login/login');
72   - } else {
73   - uni.$u.route('/pages/profile/profile');
74   - }
  56 +export default {
  57 + data() {
  58 + return {
  59 + avatar: '',
  60 + nickName: '点击登录',
  61 + orderStatusList: [
  62 + { icon: 'rmb-circle', title: '待支付' },
  63 + { icon: 'car', title: '代发货' },
  64 + { icon: 'order', title: '待收货' },
  65 + { icon: 'integral', title: '已完成' }
  66 + ],
  67 + statList: [
  68 + { value: '2', title: '我的收藏' },
  69 + { value: '3', title: '我的消息' },
  70 + { value: '3', title: '我的足迹' }
  71 + ]
  72 + }
  73 + },
  74 + onLoad() {},
  75 + methods: {
  76 + handleUserInfoClick() {
  77 + // TODO 判断是否已经登录逻辑
  78 + if (!uni.getStorageSync('token')) {
  79 + uni.$u.route('/pages/login/login')
  80 + } else {
  81 + uni.$u.route('/pages/profile/profile')
75 82 }
76   - }
77   - }
  83 + }
  84 + }
  85 +}
78 86 </script>
79 87  
80 88 <style lang="scss" scoped>
81 89 .user-header {
  90 + @include flex-center(column);
82 91 height: 280rpx;
83   - display: flex;
84   - align-items: center;
85   - justify-content: center;
86 92 .user-info {
87   - display: flex;
88   - flex-direction: column;
89   - align-items: center;
90   - justify-content: center;
  93 + @include flex-center(column);
91 94 .nick-name {
92 95 margin-top: 20rpx;
93 96 font-size: 32rpx;
... ... @@ -97,10 +100,7 @@
97 100 }
98 101  
99 102 .order-header {
100   - display: flex;
101   - flex-direction: row;
102   - align-items: center;
103   - justify-content: space-between;
  103 + @include flex-space-between;
104 104 padding: 20rpx 30rpx;
105 105 border-bottom: $custom-border-style;
106 106  
... ... @@ -110,10 +110,7 @@
110 110 }
111 111 .see-all {
112 112 height: 40rpx;
113   - display: flex;
114   - flex-direction: row;
115   - align-items: center;
116   - justify-content: right;
  113 + @include flex-right;
117 114 color: #666666;
118 115 font-size: 26rpx;
119 116 }
... ... @@ -151,5 +148,4 @@
151 148 margin-top: 60rpx;
152 149 width: 300rpx;
153 150 }
154   -
155 151 </style>
... ...
yudao-ui-app/uni.scss
  View file @9e69f6e
... ... @@ -22,3 +22,39 @@ $custom-bg-color: #ffffff;
22 22  
23 23 /* 边框样式 */
24 24 $custom-border-style: 1rpx solid #f3f3f3;
  25 +
  26 +
  27 +@mixin flex-left($direction: row) {
  28 + display: flex;
  29 + flex-direction: $direction;
  30 + align-items: center;
  31 + justify-content: left;
  32 +}
  33 +
  34 +@mixin flex-right($direction: row) {
  35 + display: flex;
  36 + flex-direction: $direction;
  37 + align-items: center;
  38 + justify-content: right;
  39 +}
  40 +
  41 +@mixin flex-center($direction: row) {
  42 + display: flex;
  43 + flex-direction: $direction;
  44 + align-items: center;
  45 + justify-content: center;
  46 +}
  47 +
  48 +@mixin flex-space-between($direction: row) {
  49 + display: flex;
  50 + flex-direction: $direction;
  51 + align-items: center;
  52 + justify-content: space-between;
  53 +}
  54 +
  55 +@mixin flex-space-around($direction: row) {
  56 + display: flex;
  57 + flex-direction: $direction;
  58 + align-items: center;
  59 + justify-content: space-around;
  60 +}
... ...