Hooke / swx_weapp

Go to a project
Toggle navigation Toggle navigation pinning
You need to sign in or sign up before continuing.
hookehuyr
f7ab5205 1 parent f9de97e7

✨ feat: 创建活动表单样式整理优化

Inline Side-by-side
Showing 3 changed files with 256 additions and 355 deletions
...@@ -101,17 +101,81 @@ ...@@ -101,17 +101,81 @@
101 } 101 }
102 } 102 }
103 103
104 -.wrapper { 104 +.sign-wrapper {
105 display: flex; 105 display: flex;
106 align-items: center; 106 align-items: center;
107 justify-content: center; 107 justify-content: center;
108 height: 100%; 108 height: 100%;
109 + .block {
110 + background-color: #fff;
111 + border-radius: 0.6rem;
112 + .title {
113 + padding: 1rem 1rem 0.5rem 1rem;
114 + text-align: center;
115 + text {
116 + font-size: 1.15rem;
117 + }
118 + }
119 + .border {
120 + overflow: auto;
121 + border-bottom: 1px solid #F2F2F2;
122 + .fix {
123 + float: left;
124 + padding-top: 0.5rem;
125 + }
126 + }
127 + .cancel-box {
128 + padding: 1rem 0;
129 + margin: 1rem;
130 + text-align: center;
131 + .button {
132 + color: #199A74;
133 + border: 1px solid #199A74;
134 + padding: 0.5rem 1rem;
135 + border-radius: 1rem;
136 + }
137 + }
138 + .confirm-box {
139 + padding: 1rem 0;
140 + margin: 1rem;
141 + text-align: center;
142 + .button {
143 + color: #FFFFFF;
144 + background-color: #199A74;
145 + padding: 0.5rem 1rem;
146 + border-radius: 1rem;
147 + }
148 + }
149 + }
109 } 150 }
110 151
111 -.block { 152 +.limit-wrapper {
112 - background-color: #fff; 153 + .border {
113 - border-radius: 0.6rem; 154 + overflow: auto;
155 + border-bottom: 1px solid #F2F2F2;
156 + .fix {
157 + float: left;
158 + padding-top: 0.6rem;
159 + }
160 + }
114 } 161 }
162 +.limit-button-wrapper {
163 + padding: 1rem 0;
164 + margin: 1rem;
165 + text-align: center;
166 + .button {
167 + padding: 0.5rem 1rem; border-radius: 1rem;
168 + }
169 + .cancel {
170 + color: #199A74;
171 + border: 1px solid #199A74;
172 + }
173 + .confirm {
174 + color: #FFFFFF;
175 + background-color: #199A74;
176 + }
177 +}
178 +
115 179
116 .bg-gradient { 180 .bg-gradient {
117 background: linear-gradient(#B3DDC9, #B3DDC9) no-repeat; 181 background: linear-gradient(#B3DDC9, #B3DDC9) no-repeat;
...@@ -126,3 +190,78 @@ ...@@ -126,3 +190,78 @@
126 color: #199A74; 190 color: #199A74;
127 } 191 }
128 } 192 }
193 +
194 +.advanced-title {
195 + background-color: #FFFFFF;
196 + .box {
197 + padding: 1rem 1rem 0.5rem 1rem;
198 + text-align: center;
199 + }
200 +}
201 +
202 +.public-sub {
203 + padding-right: 0;
204 + .public-sub-border {
205 + border-bottom: 1px solid #F2F2F2;
206 + overflow: auto;
207 + .fix {
208 + padding-top: 0.8rem;
209 + color: #999;
210 + }
211 + }
212 +}
213 +
214 +.inner-sub {
215 + padding-top: 0;
216 + .inner-sub-border {
217 + padding-bottom: 0.5rem;
218 + border-bottom: 1px solid #F2F2F2;
219 + overflow: auto;
220 + .fix {
221 + float: left;
222 + padding-top: 0.5rem;
223 + color: #999;
224 + }
225 + }
226 +}
227 +
228 +.blacklist-sub {
229 + padding-top: 0;
230 + .blacklist-sub-border {
231 + padding-bottom: 0.5rem;
232 + border-bottom: 1px solid #F2F2F2;
233 + overflow: auto;
234 + .fix {
235 + float: left;
236 + padding-top: 0.5rem;
237 + color: #999;
238 + }
239 + }
240 +}
241 +
242 +.server-sub {
243 + padding-top: 0;
244 + padding-right: 0;
245 + .fix {
246 + padding-top: 0.8rem;
247 + color: #999;
248 + }
249 +}
250 +
251 +.confirm-publish-wrapper {
252 + background-color: #FFFFFF;
253 + box-shadow: 0rem -0.17rem 0.67rem 0rem rgba(0,0,0,0.05);
254 + .box {
255 + padding: 1rem 0;
256 + margin: 1rem;
257 + padding-bottom: 2rem;
258 + margin-top: 0;
259 + text-align: center;
260 + .button {
261 + color: #FFFFFF;
262 + background-color: #199A74;
263 + padding: 0.65rem 1rem;
264 + border-radius: 1.5rem;
265 + }
266 + }
267 +}
......
1 <!-- 1 <!--
2 * @Date: 2022-09-21 16:04:10 2 * @Date: 2022-09-21 16:04:10
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2022-09-26 11:56:39 4 + * @LastEditTime: 2022-09-26 14:25:45
5 * @FilePath: /swx/src/pages/createActivity/index.vue 5 * @FilePath: /swx/src/pages/createActivity/index.vue
6 * @Description: 创建活动页面 6 * @Description: 创建活动页面
7 --> 7 -->
8 <template> 8 <template>
9 <view> 9 <view>
10 <van-cell-group inset> 10 <van-cell-group inset>
11 - <van-field 11 + <van-field :value="org_type" label-class="label-class" input-class="input-class" label="主办方"
12 - :value="org_type" 12 + :right-icon="icon_sel" placeholder="请选择活动主办方" placeholder-style="color: #999;" customStyle="" inputAlign=""
13 - label-class="label-class" 13 + maxlength="" type="text" @tap="show_org_popup=true" :required="true" :disabled="true" />
14 - input-class="input-class"
15 - label="主办方"
16 - right-icon="arrow-down"
17 - placeholder="请选择活动主办方"
18 - placeholder-style="color: #999;"
19 - customStyle=""
20 - inputAlign=""
21 - maxlength=""
22 - type="text"
23 - @tap="show_org_popup=true"
24 - :required="true"
25 - :disabled="true" />
26 <view class="divide-line"></view> 14 <view class="divide-line"></view>
27 - <van-field 15 + <van-field :value="message" label-class="label-class" input-class="input-class" label="活动主题" type="textarea"
28 - :value="message" 16 + placeholder="请输入活动主题（最多30个字）" placeholder-style="color: #999;" autosize customStyle="" inputAlign=""
29 - label-class="label-class" 17 + rightIcon="" :required="true" :maxlength="30" :border="false" @change="onChange" />
30 - input-class="input-class"
31 - label="活动主题"
32 - type="textarea"
33 - placeholder="请输入活动主题（最多30个字）"
34 - placeholder-style="color: #999;"
35 - autosize
36 - customStyle=""
37 - inputAlign=""
38 - rightIcon=""
39 - :required="true"
40 - :maxlength="30"
41 - :border="false"
42 - @change="onChange"
43 - />
44 <view class="divide-line"></view> 18 <view class="divide-line"></view>
45 <view class="form-item"> 19 <view class="form-item">
46 <view class="form-item-title required">活动封面图<text class="sub">（图片比例16:9展示最佳）</text></view> 20 <view class="form-item-title required">活动封面图<text class="sub">（图片比例16:9展示最佳）</text></view>
...@@ -57,269 +31,123 @@ ...@@ -57,269 +31,123 @@
57 <view class="divide-line"></view> 31 <view class="divide-line"></view>
58 <view class="form-item"> 32 <view class="form-item">
59 <view class="form-item-title border">活动详情</view> 33 <view class="form-item-title border">活动详情</view>
60 - <van-field 34 + <van-field :value="message" input-class="input-class" label="" inputAlign="" maxlength="" placeholderStyle=""
61 - :value="message" 35 + rightIcon="" type="textarea" placeholder="开始输入活动详情介绍" :autosize="{ maxHeight: 200, minHeight: 100 }"
62 - input-class="input-class" 36 + custom-style="padding-left: 0;" />
63 - label=""
64 - inputAlign=""
65 - maxlength=""
66 - placeholderStyle=""
67 - rightIcon=""
68 - type="textarea"
69 - placeholder="开始输入活动详情介绍"
70 - :autosize="{ maxHeight: 200, minHeight: 100 }"
71 - custom-style="padding-left: 0;"
72 - />
73 </view> 37 </view>
74 <view class="divide-line"></view> 38 <view class="divide-line"></view>
75 <view class="form-item"> 39 <view class="form-item">
76 - <view class="form-item-title">报名信息<text class="sub">（ <text style="color: red;">*</text>为必填项，单击启用，长按修改）</text></view> 40 + <view class="form-item-title">报名信息<text class="sub">（ <text style="color: red;">*</text>为必填项，单击启用，长按修改）</text>
41 + </view>
77 </view> 42 </view>
78 <view class="sign-box"> 43 <view class="sign-box">
79 - <view @tap="onTapSign(item)" @longpress="onLongPressSign(item)" v-for="(item, index) in signInfo" :key="index" class="sign-item" :class="{ 'checked': item.checked }"><text class="required">{{ item.label }}</text></view> 44 + <view @tap="onTapSign(item)" @longpress="onLongPressSign(item)" v-for="(item, index) in signInfo" :key="index"
45 + class="sign-item" :class="{ 'checked': item.checked }"><text class="required">{{ item.label }}</text></view>
80 <!-- <view class="sign-item"><text class="">推荐人</text></view> --> 46 <!-- <view class="sign-item"><text class="">推荐人</text></view> -->
81 - <view class="sign-item" @tap="addSign"><van-icon name="plus" color="" /></view> 47 + <view class="sign-item" @tap="addSign">
48 + <van-icon name="plus" color="" />
49 + </view>
82 </view> 50 </view>
83 <view class="divide-line"></view> 51 <view class="divide-line"></view>
84 - <view class="advanced-title" style="background-color: #FFFFFF;"> 52 + <view class="advanced-title">
85 - <view style="padding: 1rem 1rem 0.5rem 1rem; text-align: center;"> 53 + <view class="box">
86 <text class="bg-gradient" style="font-size: 1.15rem;">高级设置</text> 54 <text class="bg-gradient" style="font-size: 1.15rem;">高级设置</text>
87 </view> 55 </view>
88 </view> 56 </view>
89 <view class="advanced-settings-modules"> 57 <view class="advanced-settings-modules">
90 <!-- 活动时间 --> 58 <!-- 活动时间 -->
91 - <timePickerData 59 + <timePickerData :start-time="startTime" :end-time="endTime" :default-time="defaultTime" @result="onResult">
92 - :start-time="startTime" 60 + <van-field :value="datetime" label-class="label-class-super" input-class="input-class" label="活动时间"
93 - :end-time="endTime" 61 + :right-icon="icon_sel" input-align="right" placeholder="请选择" placeholder-style="color: #999;" customStyle=""
94 - :default-time="defaultTime" 62 + maxlength="" type="" :border="true" :required="false" :disabled="true" />
95 - @result="onResult"
96 - >
97 - <van-field
98 - :value="datetime"
99 - label-class="label-class-super"
100 - input-class="input-class"
101 - label="活动时间"
102 - right-icon="arrow-down"
103 - input-align="right"
104 - placeholder="请选择"
105 - placeholder-style="color: #999;"
106 - customStyle=""
107 - maxlength=""
108 - type=""
109 - :border="true"
110 - :required="false"
111 - :disabled="true" />
112 </timePickerData> 63 </timePickerData>
113 <!-- 报名开始时间 --> 64 <!-- 报名开始时间 -->
114 - <timePickerData 65 + <timePickerData :start-time="startTime" :end-time="endTime" :default-time="defaultTime" @result="onResult">
115 - :start-time="startTime" 66 + <van-field :value="datetime" label-class="label-class-super" input-class="input-class" label="报名开始时间"
116 - :end-time="endTime" 67 + :right-icon="icon_sel" input-align="right" placeholder="请选择" placeholder-style="color: #999;" customStyle=""
117 - :default-time="defaultTime" 68 + maxlength="" type="" :border="true" :required="false" :disabled="true" />
118 - @result="onResult"
119 - >
120 - <van-field
121 - :value="datetime"
122 - label-class="label-class-super"
123 - input-class="input-class"
124 - label="报名开始时间"
125 - right-icon="arrow-down"
126 - input-align="right"
127 - placeholder="请选择"
128 - placeholder-style="color: #999;"
129 - customStyle=""
130 - maxlength=""
131 - type=""
132 - :border="true"
133 - :required="false"
134 - :disabled="true" />
135 </timePickerData> 69 </timePickerData>
136 <!-- 报名截止时间 --> 70 <!-- 报名截止时间 -->
137 - <timePickerData 71 + <timePickerData :start-time="startTime" :end-time="endTime" :default-time="defaultTime" @result="onResult">
138 - :start-time="startTime" 72 + <van-field :value="datetime" label-class="label-class-super" input-class="input-class" label="报名截止时间"
139 - :end-time="endTime" 73 + :right-icon="icon_sel" input-align="right" placeholder="请选择" placeholder-style="color: #999;" customStyle=""
140 - :default-time="defaultTime" 74 + maxlength="" type="" :border="true" :required="false" :disabled="true" />
141 - @result="onResult"
142 - >
143 - <van-field
144 - :value="datetime"
145 - label-class="label-class-super"
146 - input-class="input-class"
147 - label="报名截止时间"
148 - right-icon="arrow-down"
149 - input-align="right"
150 - placeholder="请选择"
151 - placeholder-style="color: #999;"
152 - customStyle=""
153 - maxlength=""
154 - type=""
155 - :border="true"
156 - :required="false"
157 - :disabled="true" />
158 </timePickerData> 75 </timePickerData>
159 <!-- 人数限制 --> 76 <!-- 人数限制 -->
160 - <van-field 77 + <van-field :value="person_num" label-class="label-class-super" input-class="input-class" label="人数限制"
161 - :value="person_num" 78 + :right-icon="icon_sel" input-align="right" placeholder="请选择" placeholder-style="color: #999;" customStyle=""
162 - label-class="label-class-super" 79 + maxlength="" type="" :border="true" @tap="show_popup=true" :required="false" :disabled="true" />
163 - input-class="input-class"
164 - label="人数限制"
165 - right-icon="arrow-down"
166 - input-align="right"
167 - placeholder="请选择"
168 - placeholder-style="color: #999;"
169 - customStyle=""
170 - maxlength=""
171 - type=""
172 - :border="true"
173 - @tap="show_popup=true"
174 - :required="false"
175 - :disabled="true" />
176 <!-- 是否发布 --> 80 <!-- 是否发布 -->
177 - <van-field 81 + <van-field :value="publish_status" label-class="label-class-super" input-class="input-class" label="是否发布"
178 - :value="publish_status" 82 + :right-icon="icon_sel" input-align="right" placeholder="请选择" placeholder-style="color: #999;" customStyle=""
179 - label-class="label-class-super" 83 + maxlength="" type="" :border="true" @tap="show_publish_popup=true" :required="false" :disabled="true" />
180 - input-class="input-class"
181 - label="是否发布"
182 - right-icon="arrow-down"
183 - input-align="right"
184 - placeholder="请选择"
185 - placeholder-style="color: #999;"
186 - customStyle=""
187 - maxlength=""
188 - type=""
189 - :border="true"
190 - @tap="show_publish_popup=true"
191 - :required="false"
192 - :disabled="true" />
193 <!-- 活动方式 --> 84 <!-- 活动方式 -->
194 - <van-field 85 + <van-field :value="activity_type" label-class="label-class-super" input-class="input-class" label="活动方式"
195 - :value="activity_type" 86 + :right-icon="icon_sel" input-align="right" placeholder="请选择" placeholder-style="color: #999;" customStyle=""
196 - label-class="label-class-super" 87 + maxlength="" type="" :border="true" @tap="show_activity_type_popup=true" :required="false" :disabled="true" />
197 - input-class="input-class"
198 - label="活动方式"
199 - right-icon="arrow-down"
200 - input-align="right"
201 - placeholder="请选择"
202 - placeholder-style="color: #999;"
203 - customStyle=""
204 - maxlength=""
205 - type=""
206 - :border="true"
207 - @tap="show_activity_type_popup=true"
208 - :required="false"
209 - :disabled="true" />
210 <!-- 活动地址 --> 88 <!-- 活动地址 -->
211 - <van-field 89 + <van-field :value="message1" label-class="label-class-super" input-class="input-class" label="活动地址"
212 - :value="message1" 90 + type="textarea" placeholder="请输入地址或位置说明" placeholder-style="color: #999;" customStyle="" inputAlign="right"
213 - label-class="label-class-super" 91 + rightIcon="" :required="false" maxlength="" :border="false" :autosize="{ maxHeight: 80, minHeight: 20 }"
214 - input-class="input-class" 92 + @change="onChange1" />
215 - label="活动地址"
216 - type="textarea"
217 - placeholder="请输入地址或位置说明"
218 - placeholder-style="color: #999;"
219 - customStyle=""
220 - inputAlign="right"
221 - rightIcon=""
222 - :required="false"
223 - maxlength=""
224 - :border="false"
225 - :autosize="{ maxHeight: 80, minHeight: 20 }"
226 - @change="onChange1"
227 - />
228 </view> 93 </view>
229 <view class="divide-line"></view> 94 <view class="divide-line"></view>
230 <view> 95 <view>
231 - <view class="form-item" style="padding-right: 0;"> 96 + <view class="form-item public-sub">
232 - <view style="border-bottom: 1px solid #F2F2F2; overflow: auto;"> 97 + <view class="public-sub-border">
233 <van-row> 98 <van-row>
234 <van-col span="12"> 99 <van-col span="12">
235 - <view class="form-item-title" style="padding-top: 0.8rem; color: #999;"> 100 + <view class="form-item-title fix">
236 是否公开显示 101 是否公开显示
237 <van-icon :name="icon_vip" size="1rem" color="" class="vip-icon" /> 102 <van-icon :name="icon_vip" size="1rem" color="" class="vip-icon" />
238 </view> 103 </view>
239 </van-col> 104 </van-col>
240 <van-col span="12"> 105 <van-col span="12">
241 - <view style=""> 106 + <view>
242 - <van-field 107 + <van-field :value="public_type" label-class="label-class-super" input-class="input-class" label=""
243 - :value="public_type" 108 + :right-icon="icon_sel" input-align="right" placeholder="请选择" placeholder-style="color: #999;"
244 - label-class="label-class-super" 109 + customStyle="" maxlength="" type="" :border="false" @tap="show_public_popup=true" :required="false"
245 - input-class="input-class" 110 + :disabled="true" />
246 - label=""
247 - right-icon="arrow-down"
248 - input-align="right"
249 - placeholder="请选择"
250 - placeholder-style="color: #999;"
251 - customStyle=""
252 - maxlength=""
253 - type=""
254 - :border="false"
255 - @tap="show_public_popup=true"
256 - :required="false"
257 - :disabled="true" />
258 </view> 111 </view>
259 112
260 </van-col> 113 </van-col>
261 </van-row> 114 </van-row>
262 </view> 115 </view>
263 </view> 116 </view>
264 - <view class="form-item" style="padding-top: 0;"> 117 + <view class="form-item inner-sub">
265 - <view style="padding-bottom: 0.5rem;border-bottom: 1px solid #F2F2F2; overflow: auto;"> 118 + <view class="inner-sub-border">
266 - <view class="form-item-title" style="float: left; padding-top: 0.5rem; color: #999;"> 119 + <view class="form-item-title fix">
267 允许内部人员报名活动 120 允许内部人员报名活动
268 <van-icon :name="icon_vip" size="1rem" color="" class="vip-icon" /> 121 <van-icon :name="icon_vip" size="1rem" color="" class="vip-icon" />
269 </view> 122 </view>
270 - <van-switch 123 + <van-switch style="float: right; padding-top: 0.5rem;" :checked="limit_number" @change="onChangeLimit"
271 - style="float: right; padding-top: 0.5rem;" 124 + size="1.5rem" active-color="#199A74" inactive-color="#FFFFFF" />
272 - :checked="limit_number"
273 - @change="onChangeLimit"
274 - size="1.5rem"
275 - active-color="#199A74"
276 - inactive-color="#FFFFFF"
277 - />
278 </view> 125 </view>
279 </view> 126 </view>
280 - <view class="form-item" style="padding-top: 0;"> 127 + <view class="form-item blacklist-sub">
281 - <view style="padding-bottom: 0.5rem;border-bottom: 1px solid #F2F2F2; overflow: auto;"> 128 + <view class="blacklist-sub-border">
282 - <view class="form-item-title" style="float: left; padding-top: 0.5rem; color: #999;"> 129 + <view class="form-item-title fix">
283 屏蔽黑名单用户 130 屏蔽黑名单用户
284 <van-icon :name="icon_vip" size="1rem" color="" class="vip-icon" /> 131 <van-icon :name="icon_vip" size="1rem" color="" class="vip-icon" />
285 </view> 132 </view>
286 - <van-switch 133 + <van-switch style="float: right; padding-top: 0.5rem;" :checked="limit_number" @change="onChangeLimit"
287 - style="float: right; padding-top: 0.5rem;" 134 + size="1.5rem" active-color="#199A74" inactive-color="#FFFFFF" />
288 - :checked="limit_number"
289 - @change="onChangeLimit"
290 - size="1.5rem"
291 - active-color="#199A74"
292 - inactive-color="#FFFFFF"
293 - />
294 </view> 135 </view>
295 </view> 136 </view>
296 - <view class="form-item" style="padding-top: 0; padding-right: 0;"> 137 + <view class="form-item server-sub">
297 <van-row> 138 <van-row>
298 <van-col span="12"> 139 <van-col span="12">
299 - <view class="form-item-title" style="padding-top: 0.8rem; color: #999;"> 140 + <view class="form-item-title fix">
300 服务岗位报名 141 服务岗位报名
301 <van-icon :name="icon_vip" size="1rem" color="" class="vip-icon" /> 142 <van-icon :name="icon_vip" size="1rem" color="" class="vip-icon" />
302 </view> 143 </view>
303 </van-col> 144 </van-col>
304 <van-col span="12"> 145 <van-col span="12">
305 <view style=""> 146 <view style="">
306 - <van-field 147 + <van-field :value="message1" label-class="label-class-super" input-class="input-class" label=""
307 - :value="message1" 148 + type="textarea" placeholder="岗位名以逗号分隔" placeholder-style="color: #999;" customStyle=""
308 - label-class="label-class-super" 149 + inputAlign="right" rightIcon="" :required="false" maxlength="" :border="false"
309 - input-class="input-class" 150 + :autosize="{ maxHeight: 80, minHeight: 20 }" @change="onChange1" />
310 - label=""
311 - type="textarea"
312 - placeholder="岗位名以逗号分隔"
313 - placeholder-style="color: #999;"
314 - customStyle=""
315 - inputAlign="right"
316 - rightIcon=""
317 - :required="false"
318 - maxlength=""
319 - :border="false"
320 - :autosize="{ maxHeight: 80, minHeight: 20 }"
321 - @change="onChange1"
322 - />
323 </view> 151 </view>
324 152
325 </van-col> 153 </van-col>
...@@ -329,29 +157,23 @@ ...@@ -329,29 +157,23 @@
329 </van-cell-group> 157 </van-cell-group>
330 </view> 158 </view>
331 159
332 - <view style="background-color: #FFFFFF;box-shadow: 0rem -0.17rem 0.67rem 0rem rgba(0,0,0,0.05);"> 160 + <view class="confirm-publish-wrapper">
333 - <view style="padding: 1rem 0; margin: 1rem; padding-bottom: 2rem; margin-top: 0; text-align: center;"> 161 + <view class="box">
334 - <view @tap="onSubmit" style="color: #FFFFFF; background-color: #199A74; padding: 0.65rem 1rem; border-radius: 1.5rem;">确定发布</view> 162 + <view @tap="onSubmit" class="button">确定发布</view>
335 </view> 163 </view>
336 </view> 164 </view>
337 165
338 <!-- 活动主办方弹出框 --> 166 <!-- 活动主办方弹出框 -->
339 <van-popup :show="show_org_popup" position="bottom" custom-style="height: 40%;" :lock-scroll="true"> 167 <van-popup :show="show_org_popup" position="bottom" custom-style="height: 40%;" :lock-scroll="true">
340 - <van-picker 168 + <van-picker :show-toolbar="true" title="" confirm-button-text="确定" :columns="org_type_columns"
341 - :show-toolbar="true" 169 + toolbar-class="picker-toolbar" @confirm="onOrgTypeConfirm" @cancel="onOrgTypeCancel" @change="onOrgTypeChange" />
342 - confirm-button-text="确定"
343 - :columns="org_type_columns"
344 - toolbar-class="picker-toolbar"
345 - @confirm="onOrgTypeConfirm"
346 - @cancel="onOrgTypeCancel"
347 - @change="onOrgTypeChange" />
348 </van-popup> 170 </van-popup>
349 <!-- 报名信息弹出框 --> 171 <!-- 报名信息弹出框 -->
350 <van-overlay :show="show_edit_sign" z-index="999"> 172 <van-overlay :show="show_edit_sign" z-index="999">
351 - <view class="wrapper"> 173 + <view class="sign-wrapper">
352 <view class="block"> 174 <view class="block">
353 - <view style="padding: 1rem 1rem 0.5rem 1rem; text-align: center;"> 175 + <view class="title">
354 - <text class="bg-gradient" style="font-size: 1.15rem;">报名信息</text> 176 + <text class="bg-gradient">报名信息</text>
355 </view> 177 </view>
356 <!-- <view> 178 <!-- <view>
357 <AtInput 179 <AtInput
...@@ -363,44 +185,23 @@ ...@@ -363,44 +185,23 @@
363 /> 185 />
364 </view> --> 186 </view> -->
365 <view style="width: 22rem;"> 187 <view style="width: 22rem;">
366 - <van-field 188 + <van-field :value="message" label-class="label-class" input-class="input-class" rows="1" autosize label="字段名称"
367 - :value="message" 189 + type="textarea" placeholder="请输入字段名称（6个字以内）" placeholder-style="color: #999;" customStyle="" inputAlign=""
368 - label-class="label-class" 190 + rightIcon="" :required="true" :maxlength="6" :border="true" @change="onChange" />
369 - input-class="input-class" 191 + <view class="form-item border">
370 - rows="1" 192 + <view class="form-item-title fix">是否必填</view>
371 - autosize 193 + <van-switch style="float: right; padding-top: 0.5rem;" :checked="checked" @change="onChangeEdit"
372 - label="字段名称" 194 + size="1.5rem" active-color="#199A74" inactive-color="#FFFFFF" />
373 - type="textarea"
374 - placeholder="请输入字段名称（6个字以内）"
375 - placeholder-style="color: #999;"
376 - customStyle=""
377 - inputAlign=""
378 - rightIcon=""
379 - :required="true"
380 - :maxlength="6"
381 - :border="true"
382 - @change="onChange"
383 - />
384 - <view class="form-item" style="overflow: auto; border-bottom: 1px solid #F2F2F2;">
385 - <view class="form-item-title" style="float: left; padding-top: 0.5rem;">是否必填</view>
386 - <van-switch
387 - style="float: right; padding-top: 0.5rem;"
388 - :checked="checked"
389 - @change="onChangeEdit"
390 - size="1.5rem"
391 - active-color="#199A74"
392 - inactive-color="#FFFFFF"
393 - />
394 </view> 195 </view>
395 <van-row> 196 <van-row>
396 <van-col span="12"> 197 <van-col span="12">
397 - <view style="padding: 1rem 0; margin: 1rem; text-align: center;"> 198 + <view class="cancel-box">
398 - <view @tap="closeEditSign" style="color: #199A74; border: 1px solid #199A74; padding: 0.5rem 1rem; border-radius: 1rem;">取消</view> 199 + <view class="button" @tap="closeEditSign">取消</view>
399 </view> 200 </view>
400 </van-col> 201 </van-col>
401 <van-col span="12"> 202 <van-col span="12">
402 - <view style="padding: 1rem 0; margin: 1rem; text-align: center;"> 203 + <view class="confirm-box">
403 - <view @tap="confirmEditSign" style="color: #FFFFFF; background-color: #199A74; padding: 0.5rem 1rem; border-radius: 1rem;">确定</view> 204 + <view class="button" @tap="confirmEditSign">确定</view>
404 </view> 205 </view>
405 </van-col> 206 </van-col>
406 </van-row> 207 </van-row>
...@@ -413,97 +214,57 @@ ...@@ -413,97 +214,57 @@
413 </van-overlay> 214 </van-overlay>
414 <!-- 人数限制弹出框 --> 215 <!-- 人数限制弹出框 -->
415 <van-popup :show="show_popup" position="bottom" custom-style="height: 40%;" :lock-scroll="true"> 216 <van-popup :show="show_popup" position="bottom" custom-style="height: 40%;" :lock-scroll="true">
416 - <view> 217 + <view class="limit-wrapper">
417 - <view class="form-item" style="overflow: auto; border-bottom: 1px solid #F2F2F2;"> 218 + <view class="form-item border">
418 - <view class="form-item-title" style="float: left; padding-top: 0.5rem;">不限制人数</view> 219 + <view class="form-item-title fix">不限制人数</view>
419 - <van-switch 220 + <van-switch style="float: right; padding-top: 0.5rem;" :checked="limit_number" @change="onChangeLimit"
420 - style="float: right; padding-top: 0.5rem;" 221 + size="1.5rem" active-color="#199A74" inactive-color="#FFFFFF" />
421 - :checked="limit_number"
422 - @change="onChangeLimit"
423 - size="1.5rem"
424 - active-color="#199A74"
425 - inactive-color="#FFFFFF"
426 - />
427 </view> 222 </view>
428 - <view v-if="!limit_number" class="form-item" style="overflow: auto; border-bottom: 1px solid #F2F2F2;"> 223 + <view v-if="!limit_number" class="form-item border">
429 - <view class="form-item-title" style="float: left; padding-top: 0.6rem;">人数最小值</view> 224 + <view class="form-item-title fix">人数最小值</view>
430 <view style="float: right;"> 225 <view style="float: right;">
431 - <van-field 226 + <van-field :value="min_number" type="number" label="" placeholder="请输入人数最小值"
432 - :value="min_number" 227 + placeholder-style="color: #999; font-size: 1rem;" input-align="right" customStyle="" rightIcon=""
433 - type="number" 228 + maxlength="" :border="false" />
434 - label=""
435 - placeholder="请输入人数最小值"
436 - placeholder-style="color: #999; font-size: 1rem;"
437 - input-align="right"
438 - customStyle=""
439 - rightIcon=""
440 - maxlength=""
441 - :border="false"
442 - />
443 </view> 229 </view>
444 </view> 230 </view>
445 - <view v-if="!limit_number" class="form-item" style="overflow: auto; border-bottom: 1px solid #F2F2F2;"> 231 + <view v-if="!limit_number" class="form-item border">
446 - <view class="form-item-title" style="float: left; padding-top: 0.6rem;">人数最大值</view> 232 + <view class="form-item-title fix">人数最大值</view>
447 <view style="float: right;"> 233 <view style="float: right;">
448 - <van-field 234 + <van-field :value="max_number" type="number" label="" placeholder="请输入人数最大值"
449 - :value="max_number" 235 + placeholder-style="color: #999; font-size: 1rem;" input-align="right" customStyle="" rightIcon=""
450 - type="number" 236 + maxlength="" :border="false" />
451 - label=""
452 - placeholder="请输入人数最大值"
453 - placeholder-style="color: #999; font-size: 1rem;"
454 - input-align="right"
455 - customStyle=""
456 - rightIcon=""
457 - maxlength=""
458 - :border="false"
459 - />
460 </view> 237 </view>
461 </view> 238 </view>
462 </view> 239 </view>
463 <van-row> 240 <van-row>
464 <van-col span="12"> 241 <van-col span="12">
465 - <view style="padding: 1rem 0; margin: 1rem; text-align: center;"> 242 + <view class="limit-button-wrapper">
466 - <view @tap="closeEditLimit" style="color: #199A74; border: 1px solid #199A74; padding: 0.5rem 1rem; border-radius: 1rem;">取消</view> 243 + <view class="button cancel" @tap="closeEditLimit">取消</view>
467 </view> 244 </view>
468 </van-col> 245 </van-col>
469 <van-col span="12"> 246 <van-col span="12">
470 - <view style="padding: 1rem 0; margin: 1rem; text-align: center;"> 247 + <view class="limit-button-wrapper">
471 - <view @tap="confirmEditLimit" style="color: #FFFFFF; background-color: #199A74; padding: 0.5rem 1rem; border-radius: 1rem;">确定</view> 248 + <view class="button confirm" @tap="confirmEditLimit">确定</view>
472 </view> 249 </view>
473 </van-col> 250 </van-col>
474 </van-row> 251 </van-row>
475 </van-popup> 252 </van-popup>
476 <!-- 是否发布弹出框 --> 253 <!-- 是否发布弹出框 -->
477 <van-popup :show="show_publish_popup" position="bottom" custom-style="height: 40%;" :lock-scroll="true"> 254 <van-popup :show="show_publish_popup" position="bottom" custom-style="height: 40%;" :lock-scroll="true">
478 - <van-picker 255 + <van-picker :show-toolbar="true" title="" confirm-button-text="确定" :columns="columns" toolbar-class="picker-toolbar"
479 - :show-toolbar="true" 256 + @confirm="onPublishConfirm" @cancel="onPublishCancel" @change="onPublishChange" />
480 - confirm-button-text="确定"
481 - :columns="columns"
482 - toolbar-class="picker-toolbar"
483 - @confirm="onPublishConfirm"
484 - @cancel="onPublishCancel"
485 - @change="onPublishChange" />
486 </van-popup> 257 </van-popup>
487 <!-- 活动方式弹出框 --> 258 <!-- 活动方式弹出框 -->
488 <van-popup :show="show_activity_type_popup" position="bottom" custom-style="height: 40%;" :lock-scroll="true"> 259 <van-popup :show="show_activity_type_popup" position="bottom" custom-style="height: 40%;" :lock-scroll="true">
489 - <van-picker 260 + <van-picker :show-toolbar="true" title="" confirm-button-text="确定" :columns="activity_type_columns"
490 - :show-toolbar="true" 261 + toolbar-class="picker-toolbar" @confirm="onActivityTypeConfirm" @cancel="onActivityTypeCancel"
491 - confirm-button-text="确定"
492 - :columns="activity_type_columns"
493 - toolbar-class="picker-toolbar"
494 - @confirm="onActivityTypeConfirm"
495 - @cancel="onActivityTypeCancel"
496 @change="onActivityTypeChange" /> 262 @change="onActivityTypeChange" />
497 </van-popup> 263 </van-popup>
498 <!-- 是否公开显示弹出框 --> 264 <!-- 是否公开显示弹出框 -->
499 <van-popup :show="show_public_popup" position="bottom" custom-style="height: 40%;" :lock-scroll="true"> 265 <van-popup :show="show_public_popup" position="bottom" custom-style="height: 40%;" :lock-scroll="true">
500 - <van-picker 266 + <van-picker :show-toolbar="true" confirm-button-text="确定" title="" :columns="public_type_columns"
501 - :show-toolbar="true" 267 + toolbar-class="picker-toolbar" @confirm="onPublicTypeConfirm" @cancel="onPublicTypeCancel"
502 - confirm-button-text="确定"
503 - :columns="public_type_columns"
504 - toolbar-class="picker-toolbar"
505 - @confirm="onPublicTypeConfirm"
506 - @cancel="onPublicTypeCancel"
507 @change="onPublicTypeChange" /> 268 @change="onPublicTypeChange" />
508 </van-popup> 269 </van-popup>
509 </template> 270 </template>
...@@ -513,6 +274,7 @@ import { ref, onMounted, nextTick } from "vue"; ...@@ -513,6 +274,7 @@ import { ref, onMounted, nextTick } from "vue";
513 // import icon_home1 from '@/images/icon/home01@2x.png' 274 // import icon_home1 from '@/images/icon/home01@2x.png'
514 import icon_upload from '@/images/icon/upload@2x.png' 275 import icon_upload from '@/images/icon/upload@2x.png'
515 import icon_vip from '@/images/icon/vip@2x.png' 276 import icon_vip from '@/images/icon/vip@2x.png'
277 +import icon_sel from '@/images/icon/sel@2x.png'
516 import timePickerData from "@/components/time-picker-data/picker"; 278 import timePickerData from "@/components/time-picker-data/picker";
517 279
518 const value1 = ref(''); 280 const value1 = ref('');
......