Browse Source
feat: 添加成就模块并优化多个页面功能
- 在api.js中添加成就模块 - 优化wxUserInfo.vue和Modifyinformation.vue中的绑定手机号逻辑 - 在novelDetail.vue中调整成就获取逻辑 - 新增achievement.js并移除index.js中相关成就接口 - 优化fetch.js的代码格式 - 在category.vue和bookshelf.vue中调整列表展示逻辑 - 优化Giftbox.vue和Giftpurchases.vue的礼物展示和购买逻辑 - 新增myCommentItem.vue组件并优化myComment.vue的评论展示 - 优化center.vue的样式master
15 changed files with 530 additions and 503 deletions
Split View
Diff Options
-
+1 -1api/api.js
-
+14 -14api/fetch.js
-
+1 -1api/http.js
-
+22 -0api/model/achievement.js
-
+0 -17api/model/index.js
-
+8 -15pages/index/bookshelf.vue
-
+4 -4pages/index/category.vue
-
+1 -55pages/index/center.vue
-
+1 -1pages_order/auth/Modifyinformation.vue
-
+1 -1pages_order/auth/wxUserInfo.vue
-
+17 -116pages_order/comment/myComment.vue
-
+113 -0pages_order/components/comment/myCommentItem.vue
-
+13 -6pages_order/novel/Giftbox.vue
-
+329 -271pages_order/novel/Giftpurchases.vue
-
+5 -1pages_order/novel/novelDetail.vue
+ 1
- 1
api/api.js
View File
+ 14
- 14
api/fetch.js
View File
| @ -1,20 +1,20 @@ | |||
| import api from './api.js' | |||
| const fetch = (key, data = {}, transform = true, loadingTitle) => { | |||
| return new Promise(resolve => { | |||
| const callback = (res) => { | |||
| if (!transform) { | |||
| resolve(res) | |||
| return | |||
| } | |||
| if (res.code == 200) { | |||
| resolve(res.result) | |||
| } | |||
| } | |||
| return new Promise(resolve => { | |||
| api(key, data, callback, loadingTitle) | |||
| }) | |||
| const callback = (res) => { | |||
| if (!transform) { | |||
| resolve(res) | |||
| return | |||
| } | |||
| if (res.code == 200) { | |||
| resolve(res.result) | |||
| } | |||
| } | |||
| api(key, data, callback, loadingTitle) | |||
| }) | |||
| } | |||
| export default fetch | |||
| export default fetch | |||
+ 1
- 1
api/http.js
View File
+ 22
- 0
api/model/achievement.js
View File
| @ -0,0 +1,22 @@ | |||
| const api = { | |||
| // 设置读者成就等级名称 | |||
| setAchievementName: { | |||
| url: '/all_achievement/setAchievementName', | |||
| method: 'GET', | |||
| auth: true, | |||
| }, | |||
| // 根据用户标识和书籍标识查询该用户的成就等级 | |||
| getAchievement: { | |||
| url: '/all_achievement/getAchievement', | |||
| method: 'GET', | |||
| auth: true, | |||
| }, | |||
| // 获取读者成就列表 | |||
| getAchievementList: { | |||
| url: '/all_achievement/getAchievementList', | |||
| method: 'GET', | |||
| }, | |||
| } | |||
| export default api | |||
+ 0
- 17
api/model/index.js
View File
+ 8
- 15
pages/index/bookshelf.vue
View File
+ 4
- 4
pages/index/category.vue
View File
+ 1
- 55
pages/index/center.vue
View File
+ 1
- 1
pages_order/auth/Modifyinformation.vue
View File
+ 1
- 1
pages_order/auth/wxUserInfo.vue
View File
+ 17
- 116
pages_order/comment/myComment.vue
View File
+ 113
- 0
pages_order/components/comment/myCommentItem.vue
View File
| @ -0,0 +1,113 @@ | |||
| <template> | |||
| <view class="comment-card"> | |||
| <uv-avatar :src="item.hanHaiMember.headImage" size="44" shape="circle" class="avatar" /> | |||
| <view class="comment-main"> | |||
| <view class="comment-header"> | |||
| <text class="username">{{ item.hanHaiMember.nickName }}</text> | |||
| <text class="from">来自《{{ item.commonShop.name }}》</text> | |||
| </view> | |||
| <view class="comment-content">{{ item.comment }}</view> | |||
| <view class="comment-footer"> | |||
| <text class="comment-time">{{ item.createTime }}</text> | |||
| <view class="reply-btn-wrap" @click="goToReply(item)"> | |||
| <text class="reply-btn">回复</text> | |||
| </view> | |||
| </view> | |||
| </view> | |||
| </view> | |||
| </template> | |||
| <script> | |||
| export default { | |||
| props: ['item'], | |||
| data() { | |||
| return { | |||
| } | |||
| }, | |||
| methods: { | |||
| goToReply(item) { | |||
| uni.navigateTo({ | |||
| url: '/pages_order/comment/respondComments?id=' + item.id | |||
| }) | |||
| }, | |||
| } | |||
| } | |||
| </script> | |||
| <style scoped lang="scss"> | |||
| .comment-card { | |||
| display: flex; | |||
| align-items: flex-start; | |||
| margin-bottom: 32rpx; | |||
| .avatar { | |||
| width: 56rpx; | |||
| height: 56rpx; | |||
| border-radius: 50%; | |||
| margin-right: 16rpx; | |||
| flex-shrink: 0; | |||
| } | |||
| .comment-main { | |||
| flex: 1; | |||
| display: flex; | |||
| flex-direction: column; | |||
| margin-left: 10rpx; | |||
| } | |||
| .comment-header { | |||
| display: flex; | |||
| align-items: center; | |||
| gap: 12rpx; | |||
| margin-bottom: 4rpx; | |||
| } | |||
| .username { | |||
| font-size: 26rpx; | |||
| color: #222; | |||
| font-weight: 500; | |||
| } | |||
| .from { | |||
| font-size: 22rpx; | |||
| color: #bdbdbd; | |||
| } | |||
| .comment-content { | |||
| font-size: 26rpx; | |||
| color: #333; | |||
| margin-bottom: 12rpx; | |||
| } | |||
| .comment-footer { | |||
| display: flex; | |||
| align-items: center; | |||
| font-size: 22rpx; | |||
| color: #bdbdbd; | |||
| justify-content: space-between; | |||
| padding-right: 8rpx; | |||
| } | |||
| .comment-time { | |||
| color: #bdbdbd; | |||
| } | |||
| .reply-btn-wrap { | |||
| display: flex; | |||
| align-items: center; | |||
| cursor: pointer; | |||
| } | |||
| .reply-btn { | |||
| color: #223a6b; | |||
| font-weight: 500; | |||
| margin-left: 0; | |||
| font-size: 24rpx; | |||
| } | |||
| .history-section { | |||
| margin-top: 24rpx; | |||
| } | |||
| } | |||
| </style> | |||
+ 13
- 6
pages_order/novel/Giftbox.vue
View File
+ 329
- 271
pages_order/novel/Giftpurchases.vue
View File
| @ -1,278 +1,336 @@ | |||
| <template> | |||
| <!-- 礼物购买页面 --> | |||
| <view class="gift-purchase-page"> | |||
| <!-- 顶部导航栏 --> | |||
| <navbar title="礼物购买" leftClick @leftClick="$utils.navigateBack" /> | |||
| <!-- 礼物购买卡片 --> | |||
| <view class="card gift-card"> | |||
| <view class="card-title">礼物购买</view> | |||
| <view class="form-row"> | |||
| <view class="form-label">礼物名称</view> | |||
| <view class="form-value">{{ giftName }}</view> | |||
| </view> | |||
| <view class="divider"></view> | |||
| <view class="form-row"> | |||
| <view class="form-label required"><text class="star">*</text> 购买数量</view> | |||
| <input class="form-input" placeholder="请输入数量" v-model="buyCount" type="number" :placeholder-style="'color:#bbb;'" :style="buyCount ? 'color:#222;' : ''" /> | |||
| </view> | |||
| <view class="divider"></view> | |||
| <view class="form-row"> | |||
| <view class="form-label">支付方式</view> | |||
| </view> | |||
| <view class="form-row"> | |||
| <view class="balance">账户余额：<text class="bean">{{ balance }} 豆豆</text></view> | |||
| </view> | |||
| </view> | |||
| <!-- 订单信息卡片 --> | |||
| <view class="card order-card"> | |||
| <view class="order-title">订单信息</view> | |||
| <view class="row"> | |||
| <view class="order-content">内容</view> | |||
| </view> | |||
| <view class="row total-row"> | |||
| <view class="order-total-label">合计：</view> | |||
| <view class="order-total"><text class="order-total-highlight">{{ totalPrice.toFixed(2) }}</text> 元</view> | |||
| </view> | |||
| <view class="order-divider"></view> | |||
| </view> | |||
| <!-- 提示信息 --> | |||
| <view class="tip-text"> | |||
| 请仔细核查并确认相关信息。因用户个人疏忽导致的充值错误，需由用户自行承担。一旦完成充值，概不退换。 | |||
| </view> | |||
| <!-- 底部购买按钮 --> | |||
| <view class="footer-bar"> | |||
| <button class="buy-btn" @click="handleBuy">购买</button> | |||
| </view> | |||
| </view> | |||
| <!-- 礼物购买页面 --> | |||
| <view class="gift-purchase-page"> | |||
| <!-- 顶部导航栏 --> | |||
| <navbar title="礼物购买" leftClick @leftClick="$utils.navigateBack" /> | |||
| <!-- 礼物购买卡片 --> | |||
| <view class="card gift-card"> | |||
| <view class="card-title">礼物购买</view> | |||
| <view class="form-row"> | |||
| <view class="form-label">礼物名称</view> | |||
| <view class="form-value">{{ detail.title }}</view> | |||
| </view> | |||
| <view class="divider"></view> | |||
| <view class="form-row"> | |||
| <view class="form-label required"><text class="star">*</text> 购买数量</view> | |||
| <input class="form-input" placeholder="请输入数量" v-model="buyCount" type="number" | |||
| :placeholder-style="'color:#bbb;'" :style="buyCount ? 'color:#222;' : ''" /> | |||
| </view> | |||
| <view class="divider"></view> | |||
| <view class="form-row"> | |||
| <view class="form-label">支付方式</view> | |||
| </view> | |||
| <view class="form-row"> | |||
| <view class="balance">账户余额：<text class="bean">{{ userInfo.integerPrice }} 豆豆</text></view> | |||
| </view> | |||
| </view> | |||
| <!-- 订单信息卡片 --> | |||
| <view class="card order-card" | |||
| v-if="totalIntegerPrice > userInfo.integerPrice"> | |||
| <view class="order-title">订单信息</view> | |||
| <view class="row"> | |||
| <view class="order-content">内容</view> | |||
| </view> | |||
| <view class="row total-row"> | |||
| <view class="order-total-label">合计：</view> | |||
| <view class="order-total"><text class="order-total-highlight">{{ totalPrice.toFixed(2) }}</text> 元 | |||
| </view> | |||
| </view> | |||
| <view class="order-divider"></view> | |||
| </view> | |||
| <!-- 提示信息 --> | |||
| <view class="tip-text"> | |||
| 请仔细核查并确认相关信息。因用户个人疏忽导致的充值错误，需由用户自行承担。一旦完成充值，概不退换。 | |||
| </view> | |||
| <!-- 底部购买按钮 --> | |||
| <view class="footer-bar"> | |||
| <button class="buy-btn" @click="handleBuy">购买</button> | |||
| </view> | |||
| </view> | |||
| </template> | |||
| <script> | |||
| export default { | |||
| data() { | |||
| return { | |||
| giftName: '小星星', | |||
| price: 0.1, // 单价 | |||
| buyCount: '', | |||
| balance: 0, // 账户余额 | |||
| } | |||
| }, | |||
| computed: { | |||
| totalPrice() { | |||
| const count = parseInt(this.buyCount, 10) | |||
| return isNaN(count) ? 0 : count * this.price | |||
| } | |||
| }, | |||
| onLoad(query) { | |||
| // 支持通过路由参数动态显示礼物信息 | |||
| if (query.name) this.giftName = decodeURIComponent(query.name) | |||
| if (query.price) this.price = Number(query.price) | |||
| if (query.count) this.buyCount = query.count | |||
| }, | |||
| methods: { | |||
| handleBuy() { | |||
| if (!this.buyCount || parseInt(this.buyCount, 10) <= 0) { | |||
| uni.showToast({ title: '请输入购买数量', icon: 'none' }) | |||
| return | |||
| } | |||
| // 这里可添加余额校验和购买逻辑 | |||
| uni.showToast({ title: `成功购买${this.buyCount}个${this.giftName}`, icon: 'success' }) | |||
| } | |||
| } | |||
| } | |||
| export default { | |||
| data() { | |||
| return { | |||
| buyCount: 1, | |||
| detail :{}, | |||
| giftId : 0, | |||
| } | |||
| }, | |||
| computed: { | |||
| totalPrice() { | |||
| const count = parseInt(this.buyCount, 10) | |||
| return isNaN(count) ? 0 : count * this.detail.price | |||
| }, | |||
| totalIntegerPrice(){ | |||
| const count = parseInt(this.buyCount, 10) | |||
| return isNaN(count) ? 0 : count * this.detail.integerPrice | |||
| }, | |||
| }, | |||
| onLoad(query) { | |||
| // 支持通过路由参数动态显示礼物信息 | |||
| if (query.id) this.giftId = query.id | |||
| if (query.count) this.buyCount = query.count | |||
| }, | |||
| onShow() { | |||
| this.$store.commit(('getUserInfo')) | |||
| this.getGiftDetail() | |||
| }, | |||
| methods: { | |||
| async getGiftDetail(){ | |||
| this.detail = await this.$fetch('getGiftDetail', { | |||
| giftId : this.giftId, | |||
| }) | |||
| }, | |||
| async handleBuy() { | |||
| if (!this.buyCount || parseInt(this.buyCount, 10) <= 0) { | |||
| uni.showToast({ | |||
| title: '请输入购买数量', | |||
| icon: 'none' | |||
| }) | |||
| return | |||
| } | |||
| await this.$fetch('createOrder', { | |||
| giftId : this.giftId, | |||
| num : this.buyCount, | |||
| token : uni.getStorageSync('token'), | |||
| }) | |||
| // 这里可添加余额校验和购买逻辑 | |||
| uni.showToast({ | |||
| title: `成功购买${this.buyCount}个${this.detail.title}`, | |||
| icon: 'success' | |||
| }) | |||
| setTimeout(uni.navigateBack, 1000, -1) | |||
| } | |||
| } | |||
| } | |||
| </script> | |||
| <style scoped lang="scss"> | |||
| .gift-purchase-page { | |||
| min-height: 100vh; | |||
| background: #f8f8f8; | |||
| padding-bottom: 120rpx; | |||
| } | |||
| .card { | |||
| background: #fff; | |||
| border-radius: 18rpx; | |||
| margin: 24rpx 16rpx 0 16rpx; | |||
| padding: 24rpx 24rpx 10rpx 24rpx; | |||
| box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.03); | |||
| } | |||
| .card-title { | |||
| font-size: 24rpx; | |||
| font-weight: bold; | |||
| color: #222; | |||
| margin-bottom: 18rpx; | |||
| } | |||
| .row { | |||
| display: flex; | |||
| align-items: center; | |||
| margin-bottom: 16rpx; | |||
| } | |||
| .label { | |||
| color: #888; | |||
| font-size: 26rpx; | |||
| width: 160rpx; | |||
| } | |||
| .label.required { | |||
| color: #222; | |||
| font-weight: 500; | |||
| } | |||
| .value { | |||
| color: #222; | |||
| font-size: 26rpx; | |||
| } | |||
| .input { | |||
| flex: 1; | |||
| border: none; | |||
| border-bottom: 1rpx solid #eee; | |||
| font-size: 26rpx; | |||
| padding: 8rpx 0; | |||
| background: transparent; | |||
| outline: none; | |||
| } | |||
| .order-card { | |||
| border-radius: 20px; | |||
| box-shadow: 0 2px 8px rgba(0,0,0,0.04); | |||
| padding: 24px 20px 16px 20px; | |||
| margin: 16px; | |||
| position: relative; | |||
| } | |||
| .order-title { | |||
| font-size: 18px; | |||
| font-weight: bold; | |||
| color: #222; | |||
| margin-bottom: 12px; | |||
| } | |||
| .order-content { | |||
| color: #bbb; | |||
| font-size: 15px; | |||
| margin-bottom: 8px; | |||
| } | |||
| .row.total-row { | |||
| display: flex; | |||
| align-items: center; | |||
| margin-bottom: 0; | |||
| } | |||
| .order-total-label { | |||
| color: #222; | |||
| font-size: 18px; | |||
| font-weight: 500; | |||
| } | |||
| .order-total { | |||
| color: #222; | |||
| font-size: 18px; | |||
| font-weight: 500; | |||
| margin-left: 8px; | |||
| } | |||
| .order-total-highlight { | |||
| color: #ff7e00; | |||
| font-size: 18px; | |||
| font-weight: bold; | |||
| margin: 0 2px; | |||
| } | |||
| .order-divider { | |||
| width: 100%; | |||
| height: 1px; | |||
| background: #f2f2f2; | |||
| margin-top: 16px; | |||
| } | |||
| .tip-text { | |||
| color: #bbb; | |||
| font-size: 22rpx; | |||
| margin: 32rpx 32rpx 0 32rpx; | |||
| line-height: 1.6; | |||
| } | |||
| .footer-bar { | |||
| position: fixed; | |||
| left: 0; | |||
| right: 0; | |||
| bottom: 90rpx; | |||
| background: #fff; | |||
| padding: 24rpx 32rpx 32rpx 32rpx; | |||
| box-shadow: 0 -2rpx 10rpx rgba(0,0,0,0.05); | |||
| z-index: 10; | |||
| } | |||
| .buy-btn { | |||
| width: 100%; | |||
| background: #223a7a; | |||
| color: #fff; | |||
| font-size: 32rpx; | |||
| border-radius: 32rpx; | |||
| height: 88rpx; | |||
| line-height: 88rpx; | |||
| border: none; | |||
| font-weight: 500; | |||
| } | |||
| .card.gift-card { | |||
| border-radius: 20px; | |||
| box-shadow: 0 2px 8px rgba(0,0,0,0.04); | |||
| padding: 24px 20px 16px 20px; | |||
| margin: 16px; | |||
| position: relative; | |||
| } | |||
| .card-title { | |||
| font-size: 18px; | |||
| font-weight: bold; | |||
| color: #222; | |||
| margin-bottom: 12px; | |||
| } | |||
| .form-row { | |||
| display: flex; | |||
| flex-direction: column; | |||
| align-items: flex-start; | |||
| min-height: 36px; | |||
| padding: 0; | |||
| margin-top: 5rpx; | |||
| } | |||
| .form-label { | |||
| color: #888; | |||
| font-size: 14px; | |||
| margin-bottom: 9px; | |||
| font-weight: 400; | |||
| margin-top: 5px; | |||
| } | |||
| .form-label.required { | |||
| color: #222; | |||
| font-weight: 500; | |||
| display: flex; | |||
| align-items: center; | |||
| } | |||
| .star { | |||
| color: #e94f7a; | |||
| margin-right: 2px; | |||
| font-size: 16px; | |||
| } | |||
| .form-value { | |||
| color: #0e0e0e; | |||
| font-size: 14px; | |||
| font-weight: 600; | |||
| margin-bottom: 2px; | |||
| } | |||
| .form-input { | |||
| flex: 1; | |||
| border: none; | |||
| background: transparent; | |||
| font-size: 14px; | |||
| outline: none; | |||
| padding: 0; | |||
| color: #222; | |||
| } | |||
| .divider { | |||
| height: 1px; | |||
| background: #f2f2f2; | |||
| margin: 0 0 0 0; | |||
| border: none; | |||
| } | |||
| .balance { | |||
| color: #0e0e0e; | |||
| font-size: 14px; | |||
| margin: 0 0 8px 0; | |||
| } | |||
| .bean { | |||
| color: #222; | |||
| font-weight: 600; | |||
| } | |||
| </style> | |||
| .gift-purchase-page { | |||
| min-height: 100vh; | |||
| background: #f8f8f8; | |||
| padding-bottom: 120rpx; | |||
| } | |||
| .card { | |||
| background: #fff; | |||
| border-radius: 18rpx; | |||
| margin: 24rpx 16rpx 0 16rpx; | |||
| padding: 24rpx 24rpx 10rpx 24rpx; | |||
| box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.03); | |||
| } | |||
| .card-title { | |||
| font-size: 24rpx; | |||
| font-weight: bold; | |||
| color: #222; | |||
| margin-bottom: 18rpx; | |||
| } | |||
| .row { | |||
| display: flex; | |||
| align-items: center; | |||
| margin-bottom: 16rpx; | |||
| } | |||
| .label { | |||
| color: #888; | |||
| font-size: 26rpx; | |||
| width: 160rpx; | |||
| } | |||
| .label.required { | |||
| color: #222; | |||
| font-weight: 500; | |||
| } | |||
| .value { | |||
| color: #222; | |||
| font-size: 26rpx; | |||
| } | |||
| .input { | |||
| flex: 1; | |||
| border: none; | |||
| border-bottom: 1rpx solid #eee; | |||
| font-size: 26rpx; | |||
| padding: 8rpx 0; | |||
| background: transparent; | |||
| outline: none; | |||
| } | |||
| .order-card { | |||
| border-radius: 20px; | |||
| box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04); | |||
| padding: 24px 20px 16px 20px; | |||
| margin: 16px; | |||
| position: relative; | |||
| } | |||
| .order-title { | |||
| font-size: 18px; | |||
| font-weight: bold; | |||
| color: #222; | |||
| margin-bottom: 12px; | |||
| } | |||
| .order-content { | |||
| color: #bbb; | |||
| font-size: 15px; | |||
| margin-bottom: 8px; | |||
| } | |||
| .row.total-row { | |||
| display: flex; | |||
| align-items: center; | |||
| margin-bottom: 0; | |||
| } | |||
| .order-total-label { | |||
| color: #222; | |||
| font-size: 18px; | |||
| font-weight: 500; | |||
| } | |||
| .order-total { | |||
| color: #222; | |||
| font-size: 18px; | |||
| font-weight: 500; | |||
| margin-left: 8px; | |||
| } | |||
| .order-total-highlight { | |||
| color: #ff7e00; | |||
| font-size: 18px; | |||
| font-weight: bold; | |||
| margin: 0 2px; | |||
| } | |||
| .order-divider { | |||
| width: 100%; | |||
| height: 1px; | |||
| background: #f2f2f2; | |||
| margin-top: 16px; | |||
| } | |||
| .tip-text { | |||
| color: #bbb; | |||
| font-size: 22rpx; | |||
| margin: 32rpx 32rpx 0 32rpx; | |||
| line-height: 1.6; | |||
| } | |||
| .footer-bar { | |||
| position: fixed; | |||
| left: 0; | |||
| right: 0; | |||
| bottom: 90rpx; | |||
| background: #fff; | |||
| padding: 24rpx 32rpx 32rpx 32rpx; | |||
| box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.05); | |||
| z-index: 10; | |||
| } | |||
| .buy-btn { | |||
| width: 100%; | |||
| background: #223a7a; | |||
| color: #fff; | |||
| font-size: 32rpx; | |||
| border-radius: 32rpx; | |||
| height: 88rpx; | |||
| line-height: 88rpx; | |||
| border: none; | |||
| font-weight: 500; | |||
| } | |||
| .card.gift-card { | |||
| border-radius: 20px; | |||
| box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04); | |||
| padding: 24px 20px 16px 20px; | |||
| margin: 16px; | |||
| position: relative; | |||
| } | |||
| .card-title { | |||
| font-size: 18px; | |||
| font-weight: bold; | |||
| color: #222; | |||
| margin-bottom: 12px; | |||
| } | |||
| .form-row { | |||
| display: flex; | |||
| flex-direction: column; | |||
| align-items: flex-start; | |||
| min-height: 36px; | |||
| padding: 0; | |||
| margin-top: 5rpx; | |||
| } | |||
| .form-label { | |||
| color: #888; | |||
| font-size: 14px; | |||
| margin-bottom: 9px; | |||
| font-weight: 400; | |||
| margin-top: 5px; | |||
| } | |||
| .form-label.required { | |||
| color: #222; | |||
| font-weight: 500; | |||
| display: flex; | |||
| align-items: center; | |||
| } | |||
| .star { | |||
| color: #e94f7a; | |||
| margin-right: 2px; | |||
| font-size: 16px; | |||
| } | |||
| .form-value { | |||
| color: #0e0e0e; | |||
| font-size: 14px; | |||
| font-weight: 600; | |||
| margin-bottom: 2px; | |||
| } | |||
| .form-input { | |||
| flex: 1; | |||
| border: none; | |||
| background: transparent; | |||
| font-size: 14px; | |||
| outline: none; | |||
| padding: 0; | |||
| color: #222; | |||
| } | |||
| .divider { | |||
| height: 1px; | |||
| background: #f2f2f2; | |||
| margin: 0 0 0 0; | |||
| border: none; | |||
| } | |||
| .balance { | |||
| color: #0e0e0e; | |||
| font-size: 14px; | |||
| margin: 0 0 8px 0; | |||
| } | |||
| .bean { | |||
| color: #222; | |||
| font-weight: 600; | |||
| } | |||
| </style> | |||