From 15027e51ee5508f3aa80a50fd96fb1e152df27fb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?lemon=E6=A9=AA?= <17633066053@163.com>
Date: Mon, 7 Feb 2022 14:41:18 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E5=AE=89=E5=8D=93app?=
 =?UTF-8?q?=E5=9C=A8=E7=99=BB=E5=BD=95=E9=AA=8C=E8=AF=81=E9=A1=B5=E9=9D=A2?=
 =?UTF-8?q?=E5=9B=BE=E5=83=8F=E5=8F=AF=E8=83=BD=E6=98=BE=E7=A4=BA=E5=BC=82?=
 =?UTF-8?q?=E5=B8=B8=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/verification/verification.vue | 94 ++++++++++++++++++------
 1 file changed, 72 insertions(+), 22 deletions(-)

diff --git a/components/verification/verification.vue b/components/verification/verification.vue
index 1ba7f26..a2deb81 100644
--- a/components/verification/verification.vue
+++ b/components/verification/verification.vue
@@ -1,39 +1,87 @@
 <template>
   <view>
-    <view v-if="!hid" class="flex-row-center" :style="{ top: scHight }" style="width: 750rpx; position: fixed; z-index: 100; left: 0">
-      <view class="flex-column-center" style="background-color: #fcfcfc; padding: 30rpx; border-radius: 10rpx">
-        <movable-area class="flex" style="width: 100%" animation="false" :style="{ height: originalHeight }">
-          <movable-view scale-value="1" animation="false" damping="5000" :x="moveX" :style="{
+    <view
+      v-if="!hid"
+      class="flex-row-center"
+      :style="{ top: scHight }"
+      style="width: 750rpx; position: fixed; z-index: 100; left: 0"
+    >
+      <view
+        class="flex-column-center"
+        style="background-color: #fcfcfc; padding: 30rpx; border-radius: 10rpx"
+      >
+        <movable-area
+          class="flex"
+          style="width: 100%"
+          animation="false"
+          :style="{ height: originalHeight }"
+        >
+          <movable-view
+            scale-value="1"
+            animation="false"
+            damping="5000"
+            :x="moveX"
+            :style="{
               height: sliderHeight,
               width: sliderWidth,
               'z-index': 101,
-            }" direction="horizontal">
-            <image :src="imgbk" class="image" mode="aspectFit" :style="{
+            }"
+            direction="horizontal"
+          >
+            <image
+              :src="imgbk"
+              class="image"
+              mode="aspectFit"
+              :style="{
                 height: sliderHeight,
                 width: sliderWidth,
                 'margin-top': imgbKH,
-              }"></image>
+              }"
+            ></image>
           </movable-view>
-          <image :src="img" mode="aspectFit" :style="{ height: originalHeight, width: originalWidth }" style="border-radius: 10rpx"></image>
+          <image
+            :src="img"
+            mode="aspectFit"
+            :style="{ height: originalHeight, width: originalWidth }"
+            style="border-radius: 10rpx"
+          ></image>
         </movable-area>
 
-        <movable-area class="flex-row-start" style="
+        <movable-area
+          class="flex-row-start"
+          style="
             width: 100%;
             background-color: #efefef;
             height: 80rpx;
             border-radius: 40rpx;
             margin-top: 30rpx;
-          ">
-          <movable-view scale-value="1" animation="false" damping="50" :x="movePv" class="flex-row-center" style="
+          "
+        >
+          <movable-view
+            scale-value="1"
+            animation="false"
+            damping="50"
+            :x="movePv"
+            class="flex-row-center"
+            style="
               border-radius: 50%;
               height: 100rpx;
               width: 100rpx;
               background-color: #ffffff;
               border: 2rpx solid #e3e3e3;
               margin-top: -13rpx;
-            " direction="horizontal" @change="moveChange" @touchend="end">
-            <view :class="endLoad ? 'cuIcon-right' : 'cuIcon-loading turn-load'" class="loadIcon" style="">
-            </view>
+            "
+            direction="horizontal"
+            @change="moveChange"
+            @touchend="end"
+          >
+            <u-icon
+              :color="mainColor"
+              size="40"
+              v-if="endLoad"
+              name="arrow-right"
+            ></u-icon>
+            <u-icon :color="mainColor" size="40" v-else name="reload"></u-icon>
           </movable-view>
 
           <text style="padding-left: 140rpx" :style="{ color: col }">{{
@@ -41,15 +89,20 @@
           }}</text>
         </movable-area>
         <view class="flex-row-around padding-top" style="width: 100%">
-          <view @click="hide" class="cuIcon-close" style="font-size: 50rpx; color: #e25915">
-          </view>
+          <u-icon
+            @click="hide"
+            :color="mainColor"
+            size="40"
+            name="close"
+          ></u-icon>
 
           <text class="cu-tag bg-cyan round" @click="getCode">刷新拼图</text>
-          <text class="my-neirong-sm cuIcon-safe" style="color: #c1c1c1">Lili-FRAMEWORK</text>
+          <text class="my-neirong-sm cuIcon-safe" style="color: #c1c1c1"
+            >Lili-FRAMEWORK</text
+          >
         </view>
       </view>
     </view>
-
   </view>
 </template>
 
@@ -90,6 +143,7 @@ export default {
   },
   data() {
     return {
+      mainColor: this.$mainColor,
       flage: false,
       key: "", //key
       vsrtx: "点击进行验证", //按钮提示语
@@ -252,10 +306,6 @@ export default {
 .border-index {
   border: 1rpx solid $main-color;
 }
-.loadIcon {
-  color: $main-color;
-  font-size: 40rpx;
-}
 
 .status_bar {
   height: var(--status-bar-height);