提交

src/view/finance/index.vue

@@ -3,12 +3,22 @@
     <img src="../../assets/img/financeBanner.jpg" style="width: 100%" />
     <div class="guize" @click="showGuize">投票规则</div>
     <div class="guize" style="top: 4em" @click="paiming">查看排名</div>
-    <van-tabs color="#ff2c2c" background="#e0f2fa">
+    <van-search
+      :background="background"
+      clearable
+      @update:model-value="upsearch"
+      shape="round"
+      placeholder="请输入搜索关键词"
+    />
+    <van-tabs :color="theme" :background="background">
       <van-tab title="网络短视频">
         <van-row gutter="8">
           <van-col
             span="12"
-            style="position: relative"
+            :style="{
+              position: 'relative',
+              display: item.noShow ? 'none' : 'inline-block',
+            }"
             v-for="item in list"
             :key="item.id"
           >
@@ -27,7 +37,7 @@
               <van-col
                 span="24"
                 style="text-align: center"
-                class="van-ellipsis"
+                class="van-ellipsis--l2"
                 >{{ item.name }}</van-col
               >
             </van-row>
@@ -35,7 +45,7 @@
             <van-checkbox
               class="act"
               v-model="ids[item.phone].select"
-              checked-color="#ff2c2c"
+              :checked-color="theme"
             />
           </van-col>
         </van-row>
@@ -44,7 +54,10 @@
         <van-row gutter="8">
           <van-col
             span="12"
-            style="position: relative"
+            :style="{
+              position: 'relative',
+              display: item.noShow ? 'none' : 'inline-block',
+            }"
             v-for="item in list_self"
             :key="item.id"
           >
@@ -63,7 +76,7 @@
               <van-col
                 span="24"
                 style="text-align: center"
-                class="van-ellipsis"
+                class="van-ellipsis--l2"
                 >{{ item.name }}</van-col
               >
             </van-row>
@@ -71,7 +84,7 @@
             <van-checkbox
               class="act"
               v-model="ids[item.phone].select"
-              checked-color="#ff2c2c"
+              :checked-color="theme"
             />
           </van-col>
         </van-row>
@@ -84,11 +97,11 @@
     >
       投票
     </div>
-    <Shanshipin v-if="!config.isShanShiPin" color="#e0f2fa" />
+    <Shanshipin v-if="!config.isShanShiPin" :color="background" />
     <!-- 投票框 -->
     <van-dialog v-model:show="showPaihang" confirm-button-text="关闭">
       <div style="height: 50vh">
-        <van-tabs color="#ff2c2c">
+        <van-tabs :color="theme">
           <van-tab title="网络短视频">
             <div class="SilkList">
               <van-cell-group inset>
@@ -151,7 +164,7 @@
               @click="getCode"
               size="small"
               type="primary"
-              color="#ff2c2c"
+              :color="theme"
             >
               发送验证码
             </van-button>
@@ -181,7 +194,8 @@ import {
 } from '@/api/SilkRoadSpringGala.js';
 
 import Shanshipin from '@/components/shanshipin.vue';
-
+const theme = '#38379f';
+const background = '#e0f2fa';
 // import {
 //   isIpad,
 //   isIpod,
@@ -263,6 +277,24 @@ const getRankList = Call => {
   });
 };
 
+let time = null;
+const upsearch = res => {
+  if (time) clearTimeout(time);
+  time = setTimeout(() => {
+    const rex = new RegExp(res);
+    for (let i = 0; i < list.value.length; i++) {
+      const v = list.value[i];
+      list.value[i].noShow = !rex.test(v.name);
+    }
+    for (let i = 0; i < list_self.value.length; i++) {
+      const v = list_self.value[i];
+      list_self.value[i].noShow = !rex.test(v.name);
+    }
+    clearTimeout(time);
+    time = null;
+  }, 200);
+};
+
 const getCode = () => {
   // 获取验证码
   if (!/1[0-9]{10}/.test(login.phone)) {
@@ -304,7 +336,7 @@ const toupiao = function () {
             resolve(true);
           })
           .catch(err => {
-            showToast(err.message ||'投票失败！');
+            showToast(err.message || '投票失败！');
             resolve(true);
           });
       });
@@ -400,20 +432,14 @@ const formmate = num => {
 };
 
 const clickShowVideo = item => {
-  console.log(item, window.TideApp);
-  //   if (!config.isShanShiPin) return (location.href = item.file);
-  //   if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
-  //     window.location.href = 'tidecontent://tide?url=' + item.file;
-  //   } else {
-  //     window.TideApp.content(item.file);
-  //   }
   location.href = item.file;
 };
 </script>
 <style lang="scss">
 .finance {
+  $color: #38379f;
   width: 100vw;
-  padding-bottom: 80px;
+  padding-bottom: 120px;
   background-color: #e0f2fa;
   min-height: 100vh;
 
@@ -430,7 +456,7 @@ const clickShowVideo = item => {
     padding: 10px 16px;
   }
   .guize {
-    background-color: #ff2c2c;
+    background-color: $color;
     position: fixed;
     right: 0;
     top: 2em;
@@ -454,7 +480,7 @@ const clickShowVideo = item => {
     height: 2.5em;
     left: 5%;
     width: 90%;
-    background-color: #ff2c2c;
+    background-color: $color;
     z-index: 2;
     padding: 3px 0;
     border-radius: 5px;