提交

src/view/motorVehicle/components/fingerboard.vue

@@ -49,12 +49,16 @@
 </template>
 
 <script setup>
-import { ref, defineExpose, defineEmits } from 'vue';
+import { ref, defineExpose, defineEmits, defineProps } from 'vue';
 import { showToast } from 'vant';
 const show = ref(false);
 const isNew = ref(false);
 const emit = defineEmits(['changeIsNew']);
-
+const props = defineProps({
+    isNew: {
+        type: Boolean,
+    }
+})
 const jp = [
   [0, 1, 2, 3, 4, 5, 6, 7, 8, 9],
   ['Q', 'W', 'E', 'R', 'T', 'Y', 'U', 'I', 'O', 'P'],
@@ -74,7 +78,6 @@ const setKey = key => {
     if (fingerboardChepai.length >= 6) return showToast('超出车牌位数限制');
   }
   if (fingerboardChepai.length === 0 && /[0-9]/.test(key)) return showToast('车牌首位必须为字母');
-  console.log(key)
   key !== '' && fingerboardChepai.push(key);
 };
 
@@ -89,6 +92,7 @@ const isNewFunc = () => {
 
 const changeShow = (F = false, defaultText = []) => {
   show.value = F;
+  isNew.value = props.isNew;
   fingerboardChepai = defaultText;
 };
 defineExpose({

src/view/motorVehicle/components/three.vue

@@ -17,21 +17,19 @@
       {{ labels.jialing }}
     </label>
     <div class="chepaiLabel">
-      <div
-        class="chepai"
-        :style="isNew ? 'width: 363px' : ''"
-        @click="showFingerboard"
-      >
+      <div class="chepai" style="width: 363px" @click="showFingerboard">
         <div class="item">
           <img :src="chepai" style="width: 32px; height: 28px" />
         </div>
         <template v-if="isNew">
           <div
-            :class="{ item: true, newClass: index == 6 }"
+            :class="{ item: true, newClass: (!labels.chepai[index] && labels.chepai[index] !== 0) && index == 6 }"
             v-for="(item, index) in 7"
             :key="index"
-            v-text="labels.chepai[index] !== '' ? labels.chepai[index] : ''"
-          ></div>
+          >
+            <span v-if="labels.chepai[index] || labels.chepai[index] === 0 && index != 6" v-text="labels.chepai[index]"></span>
+            <span v-else-if="index === 6" style="color: #aaa;">新</span>
+          </div>
         </template>
         <template v-else>
           <div
@@ -40,6 +38,14 @@
             :key="index"
             v-text="labels.chepai[index] !== '' ? labels.chepai[index] : ''"
           ></div>
+          <div
+            class="item"
+            style="font-size: 18px; line-height: 1em; border-color: #fff"
+            @click.stop="()=>setIsNew(true)"
+          >
+            <van-icon color="#1e3c95" name="add-o" />
+            <div style="font-size: 12px">新能源</div>
+          </div>
         </template>
       </div>
     </div>
@@ -109,8 +115,13 @@ const setIsNew = value => {
   isNew.value = value;
 };
 
+const getIsNew = () => {
+  return isNew.value;
+};
+
 defineExpose({
   setIsNew,
+  getIsNew
 });
 </script>
 <style scoped>
@@ -190,8 +201,9 @@ defineExpose({
   margin-left: -100%;
 }
 
-.newClass {
-  background: green;
+.chepai .newClass {
+    font-size: 30px;
+    line-height: 1.1em;
 }
 </style>
 <style>

src/view/motorVehicle/index.vue

@@ -21,7 +21,7 @@
         <four :car="car"></four></div
     ></van-swipe-item>
   </van-swipe>
-  <Fingerboard ref="finger" @changeIsNew="changeIsNew" />
+  <Fingerboard ref="finger" @changeIsNew="changeIsNew" :isNew="threeFunc ? threeFunc.getIsNew() : false" />
 </template>
 <script setup>
 import { ref } from 'vue';