@uxda/appkit 4.2.47 → 4.2.50

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,12 +1,8 @@
1
1
  <template>
2
2
  <div class="user-binding">
3
3
  <div class="user-binding-layout">
4
- <img
5
- class="user-binding-img"
6
- :src="`https://cdn.ddjf.com/static/images/customer-center/user-${
7
- current === 1 ? 'binding' : 'auth'
8
- }.png`"
9
- />
4
+ <img class="user-binding-img" :src="`https://cdn.ddjf.com/static/images/customer-center/user-${current === 1 ? 'binding' : 'auth'
5
+ }.png`" />
10
6
  <nut-steps :current="current" class="user-binding-steps">
11
7
  <nut-step title="身份认证">1</nut-step>
12
8
  <nut-step title="换绑手机">2</nut-step>
@@ -16,82 +12,39 @@
16
12
  <div class="user-binding-layout user-binding-inputlayout" style="flex: 1" v-if="current === 1">
17
13
  <nut-form>
18
14
  <nut-form-item label="手机号码" label-align="left">
19
- <nut-input
20
- v-model="authState.mobile"
21
- placeholder="请输入手机号码"
22
- :max-length="11"
23
- readonly
24
- input-align="right"
25
- />
15
+ <nut-input v-model="authState.mobile" placeholder="请输入手机号码" :max-length="11" readonly input-align="right" />
26
16
  </nut-form-item>
27
17
  <nut-form-item label="验证码" label-align="left">
28
- <nut-input
29
- v-model="authState.code"
30
- placeholder="请输入验证码"
31
- :max-length="6"
32
- input-align="right"
33
- >
18
+ <nut-input v-model="authState.code" placeholder="请输入验证码" :max-length="6" input-align="right">
34
19
  <template #right>
35
- <nut-button
36
- :disabled="countdownActive"
37
- class="user-binding-codebtn"
38
- type="default"
39
- @click="onAuthCode"
40
- >{{ countdownText }}</nut-button
41
- >
20
+ <nut-button :disabled="countdownActive" class="user-binding-codebtn" type="default" @click="onAuthCode">{{
21
+ countdownText }}</nut-button>
42
22
  </template>
43
23
  </nut-input>
44
24
  </nut-form-item>
45
25
  </nut-form>
46
26
 
47
- <nut-button
48
- class="user-binding-btn"
49
- :disabled="!authState.code"
50
- block
51
- type="primary"
52
- @click="onAuth"
53
- >提交</nut-button
54
- >
27
+ <nut-button class="user-binding-btn" :disabled="!authState.code" block type="primary"
28
+ @click="onAuth">提交</nut-button>
55
29
  </div>
56
30
 
57
31
  <div class="user-binding-layout user-binding-inputlayout" style="flex: 1" v-else>
58
32
  <nut-form>
59
33
  <nut-form-item label="手机号码" label-align="left">
60
- <nut-input
61
- v-model="bindingState.mobile"
62
- placeholder="请输入新手机号码"
63
- :max-length="11"
64
- input-align="right"
65
- />
34
+ <nut-input v-model="bindingState.mobile" placeholder="请输入新手机号码" :max-length="11" input-align="right" />
66
35
  </nut-form-item>
67
36
  <nut-form-item label="验证码" label-align="left">
68
- <nut-input
69
- v-model="bindingState.code"
70
- placeholder="请输入验证码"
71
- :max-length="6"
72
- input-align="right"
73
- >
37
+ <nut-input v-model="bindingState.code" placeholder="请输入验证码" :max-length="6" input-align="right">
74
38
  <template #right>
75
- <nut-button
76
- :disabled="countdownActive1"
77
- class="user-binding-codebtn"
78
- type="default"
79
- @click="onBindingCode"
80
- >{{ countdownText1 }}</nut-button
81
- >
39
+ <nut-button :disabled="countdownActive1" class="user-binding-codebtn" type="default"
40
+ @click="onBindingCode">{{ countdownText1 }}</nut-button>
82
41
  </template>
83
42
  </nut-input>
84
43
  </nut-form-item>
85
44
  </nut-form>
86
45
 
87
- <nut-button
88
- class="user-binding-btn"
89
- :disabled="!bindingState.code || !bindingState.mobile"
90
- block
91
- type="primary"
92
- @click="onBinding"
93
- >提交</nut-button
94
- >
46
+ <nut-button class="user-binding-btn" :disabled="!bindingState.code || !bindingState.mobile" block type="primary"
47
+ @click="onBinding">提交</nut-button>
95
48
  </div>
96
49
  </div>
97
50
  </template>
@@ -100,7 +53,7 @@
100
53
  import { ref, reactive, onMounted } from 'vue'
101
54
  import { useCountdown } from '../../shared/composables/useCountdown'
102
55
  import { useValidator } from '../../shared/composables/useValidator'
103
- import Taro from '@tarojs/taro'
56
+ import Taro, { showToast } from '@tarojs/taro'
104
57
  import { useHttp } from '../api'
105
58
  import { useRouter } from '@tarojs/taro'
106
59
 
@@ -116,7 +69,7 @@ const current = ref(1)
116
69
 
117
70
  onMounted(() => {
118
71
  if (!params.mobile) {
119
- return Taro.showToast({ title: '路径缺少mobile参数', icon: 'none' })
72
+ return showToast({ title: '路径缺少mobile参数', icon: 'none' })
120
73
  }
121
74
  authState.mobile = params.mobile
122
75
  })
@@ -136,7 +89,7 @@ function onAuth() {
136
89
  console.log(res, 'res')
137
90
  if (typeof res !== 'boolean') return
138
91
 
139
- Taro.showToast({ title: '身份认证成功', icon: 'success' })
92
+ showToast({ title: '身份认证成功', icon: 'success' })
140
93
  current.value++
141
94
  })
142
95
  }
@@ -147,7 +100,7 @@ function onAuthCode() {
147
100
  $http.get('/cas/sysAccount/getVerifyCodeToUserMobile').then((res) => {
148
101
  if (typeof res !== 'boolean') return
149
102
 
150
- Taro.showToast({ title: '短信发送成功,请注意查收', icon: 'none' })
103
+ showToast({ title: '短信发送成功,请注意查收', icon: 'none' })
151
104
  startCountdown()
152
105
  })
153
106
  }
@@ -162,7 +115,7 @@ const bindingState = reactive({
162
115
  function onBinding() {
163
116
  const msg = phoneValidator(bindingState.mobile)
164
117
  if (msg) {
165
- return Taro.showToast({ title: msg, icon: 'none' })
118
+ return showToast({ title: msg, icon: 'none' })
166
119
  }
167
120
 
168
121
  const $http = useHttp()
@@ -175,17 +128,17 @@ function onBinding() {
175
128
  .then((res) => {
176
129
  if (typeof res !== 'boolean') return
177
130
 
178
- Taro.showToast({ title: '换绑成功', icon: 'success' })
131
+ showToast({ title: '换绑成功', icon: 'success' })
179
132
  emits('success', bindingState.mobile)
180
133
  })
181
134
  }
182
135
  function onBindingCode() {
183
136
  const msg = phoneValidator(bindingState.mobile)
184
137
  if (msg) {
185
- return Taro.showToast({ title: msg, icon: 'none' })
138
+ return showToast({ title: msg, icon: 'none' })
186
139
  }
187
140
  if (params.mobile === bindingState.mobile) {
188
- return Taro.showToast({ title: '新手机号码不应与旧手机号码一致', icon: 'none' })
141
+ return showToast({ title: '新手机号码不应与旧手机号码一致', icon: 'none' })
189
142
  }
190
143
 
191
144
  const $http = useHttp()
@@ -194,7 +147,7 @@ function onBindingCode() {
194
147
  $http.get(`/cas/sysAccount/getVerifyCodeToMobile/${bindingState.mobile}`).then((res) => {
195
148
  if (typeof res !== 'boolean') return
196
149
 
197
- Taro.showToast({ title: '短信发送成功,请注意查收', icon: 'none' })
150
+ showToast({ title: '短信发送成功,请注意查收', icon: 'none' })
198
151
  startCountdown1()
199
152
  })
200
153
  }
@@ -216,6 +169,7 @@ const emits = defineEmits(['success'])
216
169
  width: 351px;
217
170
  height: 192px;
218
171
  }
172
+
219
173
  &-layout {
220
174
  position: relative;
221
175
  width: 351px;
@@ -224,9 +178,11 @@ const emits = defineEmits(['success'])
224
178
  overflow: hidden;
225
179
  margin-bottom: 10px;
226
180
  }
181
+
227
182
  &-inputlayout {
228
183
  padding: 0 10px;
229
184
  box-sizing: border-box;
185
+
230
186
  .nut-input {
231
187
  height: 40px;
232
188
  padding: 0;
@@ -235,14 +191,17 @@ const emits = defineEmits(['success'])
235
191
  font-size: 16px;
236
192
  padding-left: 3px;
237
193
  border-color: #f5f5f5;
194
+
238
195
  .input-text {
239
196
  width: 100%;
240
197
  }
241
198
  }
242
199
  }
200
+
243
201
  .nut-placeholder {
244
202
  color: #cccccc;
245
203
  }
204
+
246
205
  .user-binding-btn {
247
206
  position: absolute;
248
207
  bottom: 50px;
@@ -253,6 +212,7 @@ const emits = defineEmits(['success'])
253
212
  height: 40px;
254
213
  line-height: 38px;
255
214
  }
215
+
256
216
  .user-binding-codebtn {
257
217
  height: 30px;
258
218
  font-size: 12px;
@@ -262,42 +222,53 @@ const emits = defineEmits(['success'])
262
222
  color: var(--app-primary-color, #017fff);
263
223
  background: #f2f2f2;
264
224
  }
225
+
265
226
  .user-binding-steps {
266
227
  margin-top: 15px;
228
+
267
229
  .nut-step-line {
268
230
  background: rgba(220, 220, 220, 1);
269
231
  left: 60%;
270
232
  right: -40%;
271
233
  }
234
+
272
235
  .nut-step-title {
273
236
  font-weight: bold;
274
237
  color: rgba(0, 0, 0, 0.4);
275
238
  }
239
+
276
240
  .nut-step.nut-step-wait .nut-step-icon {
277
241
  background: rgba(243, 243, 243, 1);
278
242
  border-color: rgba(243, 243, 243, 1);
279
243
  color: rgba(0, 0, 0, 0.4);
280
244
  }
245
+
281
246
  .nut-step.nut-step-process .nut-step-icon {
282
247
  background: var(--app-primary-color, #017fff);
283
248
  border-color: var(--app-primary-color, #017fff);
284
249
  }
250
+
285
251
  .nut-step.nut-step-process .nut-step-title {
286
252
  color: var(--app-primary-color, #017fff);
287
253
  }
254
+
288
255
  .nut-step-head {
289
256
  margin-bottom: 8px;
290
257
  }
258
+
291
259
  .nut-step.nut-step-finish .nut-step-title {
292
260
  color: rgba(0, 0, 0, 0.9);
293
261
  }
262
+
294
263
  .nut-step.nut-step-finish .nut-step-line {
295
264
  background: var(--app-primary-color, #017fff);
296
265
  }
266
+
297
267
  .nut-step.nut-step-finish .nut-step-head {
298
268
  color: var(--app-primary-color, #017fff);
299
269
  border-color: var(--app-primary-color, #017fff);
300
270
  }
271
+
301
272
  .nut-step-icon {
302
273
  width: 22px;
303
274
  height: 22px;
@@ -20,7 +20,7 @@
20
20
  <script lang="ts" setup>
21
21
  import { onMounted, ref } from 'vue'
22
22
  import { useRouter } from '@tarojs/taro'
23
- import Taro from '@tarojs/taro'
23
+ import Taro, { showToast } from '@tarojs/taro'
24
24
  import { useEncode } from '../../shared/composables/useEncode'
25
25
 
26
26
  const { params } = useRouter()
@@ -28,7 +28,7 @@ const { encodePhone } = useEncode()
28
28
 
29
29
  onMounted(() => {
30
30
  if (!params.mobile) {
31
- return Taro.showToast({ title: '路径缺少mobile参数', icon: 'none' })
31
+ return showToast({ title: '路径缺少mobile参数', icon: 'none' })
32
32
  }
33
33
  })
34
34
 
@@ -5,64 +5,40 @@
5
5
  style="width: 311px;height:149.5px;margin: 0 auto;" />
6
6
  <div class="user-feedback-tit">补充描述</div>
7
7
  <div class="user-feedback-body">
8
- <editor
9
- id="myEditor"
10
- :show-img-resize="true"
11
- class="user-feedback-editor"
12
- placeholder="请输入补充描述"
13
- />
8
+ <editor id="myEditor" :show-img-resize="true" class="user-feedback-editor" placeholder="请输入补充描述" />
14
9
  <div class="user-feedback-handle">
15
- <div
16
- class="user-feedback-handle-item"
17
- v-for="(item, key) in formState.attachment"
18
- :key="key"
19
- >
10
+ <div class="user-feedback-handle-item" v-for="(item, key) in formState.attachment" :key="key">
20
11
  <template v-if="item.status === 'done'">
21
- <img
22
- v-if="item.type === 'image'"
23
- class="user-feedback-handle-item-img"
24
- mode="aspectFit"
25
- :src="item.url"
26
- />
12
+ <img v-if="item.type === 'image'" class="user-feedback-handle-item-img" mode="aspectFit"
13
+ :src="item.url" />
27
14
  <video class="user-feedback-handle-item-img" :src="item.url" v-else />
28
15
  <div class="user-feedback-handle-item-close" @click="onDelete(key)">
29
- <img
30
- class="user-feedback-handle-item-close-img"
31
- src="https://cdn.ddjf.com/static/images/customer-center/close-filled.png"
32
- />
16
+ <img class="user-feedback-handle-item-close-img"
17
+ src="https://cdn.ddjf.com/static/images/customer-center/close-filled.png" />
33
18
  </div>
34
19
  </template>
35
- <img
36
- class="user-feedback-handle-item-loading"
37
- mode="aspectFit"
38
- src="https://cdn.ddjf.com/static/images/customer-center/loading.png"
39
- alt=""
40
- />
20
+ <img class="user-feedback-handle-item-loading" mode="aspectFit"
21
+ src="https://cdn.ddjf.com/static/images/customer-center/loading.png" alt="" />
41
22
  </div>
42
23
  <div class="user-feedback-handle-item" @click="toUpload">+</div>
43
24
  </div>
44
25
  </div>
45
26
 
46
27
  <div class="user-feedback-footer">
47
- <nut-button class="user-feedback-footer-btn" plain type="primary" @click="onCancel"
48
- >最小化</nut-button
49
- >
28
+ <nut-button class="user-feedback-footer-btn" plain type="primary" @click="onCancel">最小化</nut-button>
50
29
  <nut-button class="user-feedback-footer-btn" type="primary" @click="onOk">反馈</nut-button>
51
30
  </div>
52
31
  </div>
53
32
  <div class="user-feedback-wrap" v-else>
54
- <img
55
- class="user-feedback-success-img"
56
- mode="aspectFit"
57
- src="https://cdn.ddjf.com/static/images/customer-center/success-icon.png"
58
- />
33
+ <img class="user-feedback-success-img" mode="aspectFit"
34
+ src="https://cdn.ddjf.com/static/images/customer-center/success-icon.png" />
59
35
  <div class="user-feedback-success-info">提交成功</div>
60
36
  </div>
61
37
  </div>
62
38
  </template>
63
39
 
64
40
  <script lang="ts" setup>
65
- import Taro from '@tarojs/taro'
41
+ import Taro, { showToast, showLoading, chooseMedia } from '@tarojs/taro'
66
42
  import { onMounted, reactive, ref } from 'vue'
67
43
  import { useAppKitOptions } from '../../Appkit'
68
44
  import { useHttp } from '../api'
@@ -83,7 +59,7 @@ const props = withDefaults(
83
59
  app: '',
84
60
  traceIds: '',
85
61
  value: null,
86
- captureScreen: () => {},
62
+ captureScreen: () => { },
87
63
  }
88
64
  )
89
65
 
@@ -126,12 +102,12 @@ function initEditor() {
126
102
  // 上传图片、视频
127
103
  function toUpload() {
128
104
  if (formState.attachment.length >= 20) {
129
- return Taro.showToast({
105
+ return showToast({
130
106
  title: '最多上传20份附件',
131
107
  icon: 'none',
132
108
  })
133
109
  }
134
- Taro.chooseMedia({
110
+ chooseMedia({
135
111
  count: 20 - formState.attachment.length,
136
112
  mediaType: ['mix'],
137
113
  maxDuration: 60,
@@ -140,7 +116,7 @@ function toUpload() {
140
116
  for (const item of res.tempFiles) {
141
117
  if (item.fileType === 'video') {
142
118
  if (item.size > 1024 * 1024 * 50) {
143
- return Taro.showToast({
119
+ return showToast({
144
120
  title: '视频大小不能超过50M',
145
121
  icon: 'none',
146
122
  })
@@ -208,7 +184,7 @@ function onOk() {
208
184
  success: (res) => {
209
185
  const html = res.html
210
186
  if (html === '<p><br></p>' || !html) {
211
- Taro.showToast({
187
+ showToast({
212
188
  title: '请输入问题描述',
213
189
  icon: 'none',
214
190
  })
@@ -225,7 +201,7 @@ function requestFeedback() {
225
201
  const $http = useHttp()
226
202
  const appkitOptions = useAppKitOptions()
227
203
 
228
- Taro.showLoading({
204
+ showLoading({
229
205
  title: '反馈中...',
230
206
  })
231
207
 
@@ -257,13 +233,15 @@ function requestFeedback() {
257
233
  .then(() => {
258
234
  Taro.hideLoading()
259
235
  emits('success')
260
- // Taro.showToast({ title: '反馈提交成功', icon: 'none' })
261
- // Taro.navigateBack()
262
236
  isSuccess.value = true
263
237
  clearFormState()
264
238
  })
265
239
  .catch(() => {
266
240
  Taro.hideLoading()
241
+ showToast({
242
+ title: '反馈提交失败',
243
+ icon: 'none',
244
+ })
267
245
  })
268
246
  }
269
247
 
@@ -284,15 +262,18 @@ const emits = defineEmits(['minimize', 'success'])
284
262
  min-height: 100vh;
285
263
  box-sizing: border-box;
286
264
  overflow: hidden;
265
+
287
266
  &.isSuccess {
288
267
  margin: 0;
289
268
  padding: 0;
290
269
  height: 100%;
270
+
291
271
  .user-feedback-wrap {
292
272
  height: 100vh;
293
273
  align-items: center;
294
274
  }
295
275
  }
276
+
296
277
  &-wrap {
297
278
  min-height: calc(100vh - calc(75px + env(safe-area-inset-bottom, 0px)));
298
279
  height: 100%;
@@ -303,17 +284,20 @@ const emits = defineEmits(['minimize', 'success'])
303
284
  padding: 10px;
304
285
  border-radius: 5px;
305
286
  }
287
+
306
288
  &-head {
307
289
  background: #f2f9ff;
308
290
  padding: 15px;
309
291
  border-radius: 2px;
310
292
  font-size: 12px;
311
293
  margin-bottom: 8px;
294
+
312
295
  &-info {
313
296
  padding-left: 9px;
314
297
  text-indent: -9px;
315
298
  }
316
299
  }
300
+
317
301
  &-tit {
318
302
  height: 44px;
319
303
  display: flex;
@@ -322,12 +306,14 @@ const emits = defineEmits(['minimize', 'success'])
322
306
  font-weight: 500;
323
307
  font-size: 17px;
324
308
  }
309
+
325
310
  &-body {
326
311
  border-radius: 4px 4px 0px 0px;
327
312
  display: flex;
328
313
  flex-direction: column;
329
314
  overflow: hidden;
330
315
  }
316
+
331
317
  &-editor {
332
318
  padding: 10px;
333
319
  font-size: 14px;
@@ -335,12 +321,14 @@ const emits = defineEmits(['minimize', 'success'])
335
321
  overflow-y: auto;
336
322
  min-height: 165px;
337
323
  }
324
+
338
325
  &-handle {
339
326
  display: flex;
340
327
  align-items: center;
341
328
  flex-wrap: wrap;
342
329
  margin-top: 10px;
343
330
  margin-right: -4px;
331
+
344
332
  &-item {
345
333
  position: relative;
346
334
  border-radius: 2px;
@@ -354,10 +342,12 @@ const emits = defineEmits(['minimize', 'success'])
354
342
  color: rgba(53, 53, 53, 0.3);
355
343
  margin-right: 4px;
356
344
  margin-bottom: 4px;
345
+
357
346
  &-img {
358
347
  max-width: 100%;
359
348
  max-height: 100%;
360
349
  }
350
+
361
351
  &-close {
362
352
  position: absolute;
363
353
  top: -2px;
@@ -367,11 +357,13 @@ const emits = defineEmits(['minimize', 'success'])
367
357
  display: flex;
368
358
  justify-content: center;
369
359
  align-items: center;
360
+
370
361
  &-img {
371
362
  width: 10px;
372
363
  height: 10px;
373
364
  }
374
365
  }
366
+
375
367
  &-loading {
376
368
  width: 17px;
377
369
  height: 17px;
@@ -379,6 +371,7 @@ const emits = defineEmits(['minimize', 'success'])
379
371
  }
380
372
  }
381
373
  }
374
+
382
375
  .ql-editor.ql-blank:before {
383
376
  color: rgba(0, 0, 0, 0.3);
384
377
  font-style: normal;
@@ -397,8 +390,10 @@ const emits = defineEmits(['minimize', 'success'])
397
390
  display: flex;
398
391
  justify-content: space-between;
399
392
  box-sizing: border-box;
393
+
400
394
  &-btn {
401
395
  flex: 1;
396
+
402
397
  &:first-child {
403
398
  margin-right: 10px;
404
399
  }
@@ -412,6 +407,7 @@ const emits = defineEmits(['minimize', 'success'])
412
407
  margin-top: 110px;
413
408
  margin-bottom: 20px;
414
409
  }
410
+
415
411
  &-info {
416
412
  color: #353535;
417
413
  font-size: 16px;
@@ -423,6 +419,7 @@ const emits = defineEmits(['minimize', 'success'])
423
419
  from {
424
420
  transform: rotate(0);
425
421
  }
422
+
426
423
  to {
427
424
  transform: rotate(360deg);
428
425
  }