Merge branch 'master' of git.yoho.cn:fe/yoho-community-web
Showing
7 changed files
with
67 additions
and
49 deletions
@@ -2,7 +2,7 @@ | @@ -2,7 +2,7 @@ | ||
2 | <div v-transfer-dom :data-transfer="transfer"> | 2 | <div v-transfer-dom :data-transfer="transfer"> |
3 | <transition name="action-sheet-fade"> | 3 | <transition name="action-sheet-fade"> |
4 | <div class="yoho-popup" :class="actionCls" v-show="isVisible" :style="{'z-index': zIndex}"> | 4 | <div class="yoho-popup" :class="actionCls" v-show="isVisible" :style="{'z-index': zIndex}"> |
5 | - <div class="yoho-popup-mask" @click="maskClick"></div> | 5 | + <div class="yoho-popup-mask" @click="maskClick" v-if="mask"></div> |
6 | <div class="yoho-popup-container"> | 6 | <div class="yoho-popup-container"> |
7 | <div class="yoho-popup-content"> | 7 | <div class="yoho-popup-content"> |
8 | <transition name="action-sheet-move"> | 8 | <transition name="action-sheet-move"> |
@@ -25,10 +25,14 @@ export default { | @@ -25,10 +25,14 @@ export default { | ||
25 | type: Boolean, | 25 | type: Boolean, |
26 | default: true | 26 | default: true |
27 | }, | 27 | }, |
28 | + mask: { | ||
29 | + type: Boolean, | ||
30 | + default: true | ||
31 | + }, | ||
28 | transfer: Boolean, | 32 | transfer: Boolean, |
29 | zIndex: { | 33 | zIndex: { |
30 | type: Number, | 34 | type: Number, |
31 | - default: 5 | 35 | + default: 100 |
32 | }, | 36 | }, |
33 | visible: { | 37 | visible: { |
34 | type: Boolean, | 38 | type: Boolean, |
@@ -85,12 +89,11 @@ export default { | @@ -85,12 +89,11 @@ export default { | ||
85 | <style lang="scss" scoped> | 89 | <style lang="scss" scoped> |
86 | .action-sheet-fade-enter, | 90 | .action-sheet-fade-enter, |
87 | .action-sheet-fade-leave-active { | 91 | .action-sheet-fade-leave-active { |
88 | - opacity: 0; | ||
89 | } | 92 | } |
90 | 93 | ||
91 | .action-sheet-fade-enter-active, | 94 | .action-sheet-fade-enter-active, |
92 | .action-sheet-fade-leave-active { | 95 | .action-sheet-fade-leave-active { |
93 | - transition: all 0.7s ease-in-out; | 96 | + transition: all 0.3s ease-in-out; |
94 | } | 97 | } |
95 | 98 | ||
96 | .action-sheet-move-enter, | 99 | .action-sheet-move-enter, |
@@ -100,7 +103,7 @@ export default { | @@ -100,7 +103,7 @@ export default { | ||
100 | 103 | ||
101 | .action-sheet-move-enter-active, | 104 | .action-sheet-move-enter-active, |
102 | .action-sheet-move-leave-active { | 105 | .action-sheet-move-leave-active { |
103 | - transition: all 0.7s ease-in-out; | 106 | + transition: all 0.3s ease-in-out; |
104 | } | 107 | } |
105 | 108 | ||
106 | .yoho-popup { | 109 | .yoho-popup { |
@@ -109,7 +112,7 @@ export default { | @@ -109,7 +112,7 @@ export default { | ||
109 | right: 0; | 112 | right: 0; |
110 | top: 0; | 113 | top: 0; |
111 | bottom: 0; | 114 | bottom: 0; |
112 | - z-index: 5; | 115 | + z-index: 100; |
113 | 116 | ||
114 | .yoho-popup-mask { | 117 | .yoho-popup-mask { |
115 | display: block; | 118 | display: block; |
@@ -117,7 +120,7 @@ export default { | @@ -117,7 +120,7 @@ export default { | ||
117 | 120 | ||
118 | .yoho-popup-mask, | 121 | .yoho-popup-mask, |
119 | .yoho-popup-container { | 122 | .yoho-popup-container { |
120 | - background-color: #fff; | 123 | + background-color: rgba(0, 0, 0, 0); |
121 | position: absolute; | 124 | position: absolute; |
122 | width: 100%; | 125 | width: 100%; |
123 | height: 100%; | 126 | height: 100%; |
1 | <template> | 1 | <template> |
2 | <div class="comment-list"> | 2 | <div class="comment-list"> |
3 | - <div class="comment-content"> | ||
4 | - <Scroll ref="scroll" :data="commentList" :options="scrollOption" @pulling-up="onPullingUp"> | ||
5 | - <CommentItem | ||
6 | - v-for="(comment, index) in commentList" | ||
7 | - :key="index" | ||
8 | - :parent-comment="comment.parentComment" | ||
9 | - :children-comments="comment.childrenComments" | ||
10 | - :column-type="columnType" | ||
11 | - @on-reply="onReply"> | ||
12 | - </CommentItem> | ||
13 | - </Scroll> | 3 | + <div class="comment-content-flex"> |
4 | + <div class="comment-content"> | ||
5 | + <Scroll ref="scroll" :data="commentList" :options="scrollOption" @pulling-up="onPullingUp"> | ||
6 | + <CommentItem | ||
7 | + v-for="(comment, index) in commentList" | ||
8 | + :key="index" | ||
9 | + :parent-comment="comment.parentComment" | ||
10 | + :children-comments="comment.childrenComments" | ||
11 | + :column-type="columnType" | ||
12 | + @on-reply="onReply"> | ||
13 | + </CommentItem> | ||
14 | + </Scroll> | ||
15 | + </div> | ||
14 | </div> | 16 | </div> |
15 | <div class="comment-footer"> | 17 | <div class="comment-footer"> |
16 | <CommentPlaceholder | 18 | <CommentPlaceholder |
@@ -149,16 +151,25 @@ export default { | @@ -149,16 +151,25 @@ export default { | ||
149 | display: flex; | 151 | display: flex; |
150 | flex-direction: column; | 152 | flex-direction: column; |
151 | 153 | ||
152 | - .comment-content { | 154 | + .comment-content-flex { |
153 | flex: 1; | 155 | flex: 1; |
154 | - padding-top: 40px; | ||
155 | - padding-left: 30px; | ||
156 | - padding-right: 30px; | ||
157 | overflow: hidden; | 156 | overflow: hidden; |
157 | + position: relative; | ||
158 | 158 | ||
159 | /deep/ .before-trigger { | 159 | /deep/ .before-trigger { |
160 | color: #b0b0b0; | 160 | color: #b0b0b0; |
161 | } | 161 | } |
162 | + | ||
163 | + .comment-content { | ||
164 | + position: absolute; | ||
165 | + top: 0; | ||
166 | + left: 0; | ||
167 | + right: 0; | ||
168 | + bottom: 0; | ||
169 | + padding-top: 40px; | ||
170 | + padding-left: 30px; | ||
171 | + padding-right: 30px; | ||
172 | + } | ||
162 | } | 173 | } |
163 | 174 | ||
164 | .comment-footer { | 175 | .comment-footer { |
1 | <template> | 1 | <template> |
2 | <div class="layout" :class="{'header-fixed': headerFixed}"> | 2 | <div class="layout" :class="{'header-fixed': headerFixed}"> |
3 | <slot name="header" v-if="hasHeader"></slot> | 3 | <slot name="header" v-if="hasHeader"></slot> |
4 | - <div class="layout-content"> | ||
5 | - <slot></slot> | 4 | + <div class="layout-content-flex"> |
5 | + <div class="layout-content"> | ||
6 | + <slot></slot> | ||
7 | + </div> | ||
6 | </div> | 8 | </div> |
7 | </div> | 9 | </div> |
8 | </template> | 10 | </template> |
@@ -64,12 +66,21 @@ export default { | @@ -64,12 +66,21 @@ export default { | ||
64 | } | 66 | } |
65 | } | 67 | } |
66 | 68 | ||
67 | - .layout-content { | 69 | + .layout-content-flex { |
68 | width: 100%; | 70 | width: 100%; |
69 | height: 100%; | 71 | height: 100%; |
70 | flex: 1; | 72 | flex: 1; |
73 | + position: relative; | ||
71 | overflow: hidden; | 74 | overflow: hidden; |
72 | -webkit-overflow-scrolling: touch; | 75 | -webkit-overflow-scrolling: touch; |
76 | + | ||
77 | + .layout-content { | ||
78 | + position: absolute; | ||
79 | + top: 0; | ||
80 | + left: 0; | ||
81 | + right: 0; | ||
82 | + bottom: 0; | ||
83 | + } | ||
73 | } | 84 | } |
74 | } | 85 | } |
75 | </style> | 86 | </style> |
@@ -19,7 +19,7 @@ | @@ -19,7 +19,7 @@ | ||
19 | 19 | ||
20 | <script> | 20 | <script> |
21 | import {createNamespacedHelpers} from 'vuex'; | 21 | import {createNamespacedHelpers} from 'vuex'; |
22 | -const {mapActions} = createNamespacedHelpers('product'); | 22 | +const {mapActions, mapGetters} = createNamespacedHelpers('product'); |
23 | 23 | ||
24 | export default { | 24 | export default { |
25 | name: 'ProductGroupItem', | 25 | name: 'ProductGroupItem', |
@@ -45,14 +45,21 @@ export default { | @@ -45,14 +45,21 @@ export default { | ||
45 | }, | 45 | }, |
46 | favText() { | 46 | favText() { |
47 | return this.favorite ? '已收藏' : '收藏'; | 47 | return this.favorite ? '已收藏' : '收藏'; |
48 | - } | 48 | + }, |
49 | + ...mapGetters(['getLogin']), | ||
49 | }, | 50 | }, |
50 | methods: { | 51 | methods: { |
51 | ...mapActions(['postProductFav']), | 52 | ...mapActions(['postProductFav']), |
52 | async onFav() { | 53 | async onFav() { |
54 | + if (!this.isLogin) { | ||
55 | + this.$yoho.goLogin(); | ||
56 | + return; | ||
57 | + } | ||
58 | + | ||
53 | if (this.posting) { | 59 | if (this.posting) { |
54 | return; | 60 | return; |
55 | } | 61 | } |
62 | + | ||
56 | this.posting = true; | 63 | this.posting = true; |
57 | const favorite = !this.favorite; | 64 | const favorite = !this.favorite; |
58 | 65 |
@@ -142,27 +142,8 @@ export default { | @@ -142,27 +142,8 @@ export default { | ||
142 | } | 142 | } |
143 | }, | 143 | }, |
144 | onExpand(params) { | 144 | onExpand(params) { |
145 | - const toast = this.$createToast({ | ||
146 | - time: 0, | ||
147 | - txt: '加载中', | ||
148 | - mask: true, | ||
149 | - type: 'loading' | ||
150 | - }); | ||
151 | - | ||
152 | - toast.show(); | ||
153 | - | ||
154 | this.showArticleDetailAction = true; | 145 | this.showArticleDetailAction = true; |
155 | - this.$nextTick(() => { | ||
156 | - this.$refs.actionSheet.show(params).then(() => { | ||
157 | - toast.hide(); | ||
158 | - }).catch(() => { | ||
159 | - this.$createToast && this.$createToast({ | ||
160 | - txt: '服务器开小差了', | ||
161 | - type: 'warn', | ||
162 | - time: 1000 | ||
163 | - }).show(); | ||
164 | - }); | ||
165 | - }); | 146 | + this.$refs.actionSheet.show(params); |
166 | } | 147 | } |
167 | }, | 148 | }, |
168 | components: { | 149 | components: { |
1 | <template> | 1 | <template> |
2 | - <YohoActionSheet ref="actionSheet" :full="true"> | 2 | + <YohoActionSheet ref="actionSheet" :full="true" :mask="false"> |
3 | <ArticleDetail ref="detail" @on-close="onClose"></ArticleDetail> | 3 | <ArticleDetail ref="detail" @on-close="onClose"></ArticleDetail> |
4 | </YohoActionSheet> | 4 | </YohoActionSheet> |
5 | </template> | 5 | </template> |
@@ -19,8 +19,8 @@ export default { | @@ -19,8 +19,8 @@ export default { | ||
19 | }, | 19 | }, |
20 | methods: { | 20 | methods: { |
21 | async show(params) { | 21 | async show(params) { |
22 | - await this.$refs.detail.fetch(params); | ||
23 | this.$refs.actionSheet.show(); | 22 | this.$refs.actionSheet.show(); |
23 | + await this.$refs.detail.fetch(params); | ||
24 | }, | 24 | }, |
25 | hide() { | 25 | hide() { |
26 | this.$refs.actionSheet.hide(); | 26 | this.$refs.actionSheet.hide(); |
@@ -62,6 +62,11 @@ export default function() { | @@ -62,6 +62,11 @@ export default function() { | ||
62 | state.window.supportsPassive = supportsPassive; | 62 | state.window.supportsPassive = supportsPassive; |
63 | } | 63 | } |
64 | }, | 64 | }, |
65 | + getters: { | ||
66 | + getLogin(state) { | ||
67 | + return state.context.isLogin; | ||
68 | + } | ||
69 | + }, | ||
65 | actions: { | 70 | actions: { |
66 | reportYas(params, {params: {appop, param}, asyncindx = false}) { | 71 | reportYas(params, {params: {appop, param}, asyncindx = false}) { |
67 | document.addEventListener('deviceready', () => { | 72 | document.addEventListener('deviceready', () => { |
-
Please register or login to post a comment