fix

pages/index.vue

@@ -5,8 +5,38 @@
       <div class="container-fluid">
         <div class="row align-items-stretch">
           <div class="col-12 col-lg-5 order-1 order-lg-0">
-            <div class="boxBg inquiry">
+            <div v-if="!open" class="boxBg inquiry">
+              <h2>نوع محصول را انتخاب کنید:</h2>
+              <div class="brandsList">
+                <CRow>
+                  <CCol col="12">
+                    <p>
+                      ضمن خوش آمدگویی شما به مجموعه آسان سرویس چنانچه محصول خریداری شده شما دارای سریال گارانتی میباشد
+                      میتوانید با وارد کردن سریال گارانتی در کادر زیر از وضعیت گارانتی محصول و یا با انتخاب گزینه اصالت
+                      کالا و وارد کردن شماره سریال خود دستگاه از اصالت دستگاه مطلع شوید.
+                    </p>
+                  </CCol>
+                 
+                    <div class="brand" :class="g === 1 && 'selected'">
+                      <button @click="openModal(1)">
+                        <i class="fas fa-phone-laptop"></i>
+                        <span>لوازم جانبی کامپیوتر ، موبایل و محصولات حافظه</span>
+                      </button>
+                    </div>
+                    <div class="brand" :class="g === 2 && 'selected'">
+                      <button @click="openModal(1)">
+                        <i class="fas fa-photo-video"></i>
+                        <span>لوازم صوتی و تصویری خودرو</span>
+                      </button>
+                    </div>
+                
+                </CRow>
+              </div>
+            </div>
+            <div v-if="open" class="boxBg inquiry">
               <h2>استعلام گارانتی و اصالت کالا</h2>
+              <span v-if="g === 1">لوازم جانبی کامپیوتر ، موبایل و محصولات حافظه</span>
+              <span v-else>لوازم صوتی و تصویری خودرو</span>
               <p>
                 ضمن خوش آمدگویی شما به مجموعه آسان سرویس چنانچه محصول خریداری شده شما دارای سریال گارانتی میباشد
                 میتوانید با وارد کردن سریال گارانتی در کادر زیر از وضعیت گارانتی محصول و یا با انتخاب گزینه اصالت کالا و
@@ -75,21 +105,18 @@
       </div>
     </div>
 
-    <div v-if="$route.query?.brand == 2 " class="p-3" style="background-color: white;  position: relative;
+    <div v-if="$route.query?.brand == 2" class="p-3" style="background-color: white; position: relative; z-index: 999">
-    z-index: 999;">
       <div>
         <el-carousel :interval="5000" type="card" height="250px">
-          <el-carousel-item style="display: flex; justify-content: center; align-items: center;" v-for="item, i in brands" :key="i">
+          <el-carousel-item
-           <a :href="item.link" class="m-2 p-2" style="  width: 100%;   height: 100%;">
+            style="display: flex; justify-content: center; align-items: center"
-          
+            v-for="(item, i) in brands"
+            :key="i"
+          >
+            <a :href="item.link" class="m-2 p-2" style="width: 100%; height: 100%">
               <div class="row box-shape">
-             
+                <div class="col-lg-4 col-sm-12" style="display: flex; justify-content: center; align-items: center">
-              <div class=" col-lg-4 col-sm-12" style="display: flex; justify-content: center; align-items: center;">
+                  <img width="188" :src="'/uploads/images/brands/' + item.logo" />
- 
-              <img width="188" 
-                :src="'/uploads/images/brands/' + item.logo"
-               
-              />
                 </div>
 
                 <div class="col-lg-8 col-sm-12 desc-box p-3">
@@ -99,10 +126,8 @@
                   <p>
                     {{ item.description }}
                   </p>
-
                 </div>
               </div>
-           
             </a>
           </el-carousel-item>
         </el-carousel>
@@ -132,7 +157,8 @@ export default {
       inquiryType: 'guaranteeSerial',
       checkingSerial: false,
       brands: [],
-      g: 1
+      g: 1,
+      open: false
     }
   },
   head() {
@@ -154,13 +180,18 @@ export default {
     }
   },
   mounted() {
-      this.$axios.get(`/api/public/brand`).then((res)=>{
+    this.$axios.get(`/api/public/brand`).then(res => {
       this.brands = res.data
-
     })
   },
   methods: {
-    
+    openModal(g) {
+      this.g = g
+      this.open = true
+    },
+    closeModal() {
+      this.open = false
+    },
     checkSerial() {
       // validation
       if (this.checkingSerial) {
@@ -216,7 +247,92 @@ export default {
 }
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
+.brandsList {
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: stretch;
+
+  .brand {
+    flex-basis: 50%;
+    max-width: 200px;
+    padding: 10px;
+    text-align: center;
+
+    &.selected {
+      button {
+        background: #065495;
+
+        img {
+          opacity: 0;
+
+          &.alt {
+            opacity: 1;
+          }
+        }
+
+        i,
+        span {
+          color: #fff;
+        }
+      }
+    }
+
+    button {
+      width: 100%;
+      height: 100%;
+      display: inline-block;
+      overflow: hidden;
+      border: 1px solid #065495;
+      cursor: pointer;
+      border-radius: 10px;
+      background: transparent;
+      position: relative;
+      padding: 5px;
+
+      &:hover {
+        background: #065495;
+
+        img {
+          opacity: 0;
+
+          &.alt {
+            opacity: 1;
+          }
+        }
+        i,
+        span {
+          color: #fff;
+        }
+      }
+
+      img {
+        display: block;
+        width: 100%;
+
+        &.alt {
+          position: absolute;
+          top: 0;
+          left: 0;
+          z-index: 1;
+          opacity: 0;
+        }
+      }
+
+      i {
+        display: block;
+        font-size: 50px;
+        margin: 10px 0;
+        color: #065495;
+      }
+      span {
+        color: #065495;
+        font-family: 'iranYekanB';
+      }
+    }
+  }
+}
 .rounded {
   border-radius: 5px;
 }

server/plugins/asanServiceSerialChecker.js

@@ -1,8 +1,8 @@
 const fs = require('fs')
 const readXlsxFile = require('read-excel-file/node')
 
-const guaranteeSerialsPath = './static/uploads/serials'
+const guaranteeSerialsPath = './static/uploads/serials/'
-const productSerialsPath = './static/uploads/serials_products'
+const productSerialsPath = './static/uploads/serials_products/'
 
 const serialChecker = async (serial, type = 'guaranteeSerial', g = 1) => {
   let exelsPath