UI：车牌｜首页｜支付页面

src/pages/parkingFee/mixins/parkingFeePayment.js

@@ -1,17 +1,23 @@
+import uni from "@/utils/uniHooks";
 import { mapState } from 'vuex';
 
 export default {
   created() {
     const params = this.$route.query;
     this.msg = params.msg;
-    this.carno = params.carno;
+    this.vehicleNo = params.vehicleNo;
+    setTimeout(() => {
+      uni.setNavigationBarTitle({
+        title: '停车出场提示',
+      });
+    }, 300);
     setTimeout(() => {
       window?.toWXSendMsg({
         type: 'uni_func',
         funcName: 'setNavigationBarColor',
         options: {
           frontColor: '#000000',
-          backgroundColor: '#FBFCFF',
+          backgroundColor: '#FAFBFF',
         },
       });
     }, 500)
@@ -19,7 +25,7 @@ export default {
   data() {
     return {
       msg: '',
-      carno: '',
+      vehicleNo: '',
       picUrl: this.$picUrl,
       colorAry: ['blue', 'green'],
     };

src/pages/parkingFee/parkingFee.vue

@@ -361,7 +361,7 @@ export default {
             margin: 0 3px;
             &.dashed {
               background-color: #fafbff;
-              border-style: dashed;
+              border: 1px dashed #fafbff;
             }
             &.van-hairline--surround {
               &::after{

src/pages/parkingFee/parkingFeeDetail.vue

@@ -229,7 +229,7 @@ export default {
 
 .info-box {
   background: #FAFBFF;
-  padding-top: 48.5px;
+  padding-top: 30px;
 
   width: 702px;
   margin-left: 24px;
@@ -237,7 +237,7 @@ export default {
   .info-item-box {
     display: flex;
     justify-content: space-between;
-    padding-bottom: 39px;
+    padding-bottom: 30px;
     &.npb{
       padding-bottom: 0;
     }

src/pages/parkingFee/parkingFeePayment.vue

@@ -2,9 +2,10 @@
   <scroll-view :class="['box', theme]">
     <div>
       <img
-        :src="require('./static/images/no-car.png')" />
-      <div class="carno">{{carno | formatCarno}}</div>
-      <div class="msg">{{msg}}</div>
+        :src="require('./static/images/no-car.svg')" />
+<!--      <div class="carno">{{vehicleNo | formatCarno}}</div>-->
+      <div class="msg">未查询到场内记录</div>
+      <div class="msg-sub">请联系车场管理员</div>
       <div class="searchPrice" @click="search">重新查询</div>
     </div>
   </scroll-view>
@@ -22,13 +23,14 @@ export default {
 
 .box {
   text-align: center;
-  background-color: #F4F7FF;
+  background-color: #FBFCFF;
   opacity: 1;
 
   img {
-    width: 80%;
+    width: 500px;
     // height: 200px;
-    margin-top: 200px;
+    display: block;
+    margin: 149px auto 0;
   }
 
   div {
@@ -43,16 +45,30 @@ export default {
   }
 
   .msg {
+    font-style: normal;
+    font-weight: 500;
     font-size: 36px;
+    line-height: 50px;
+    text-align: right;
+    color: #333333;
+    text-align: center;
+  }
+  
+  .msg-sub {
+    font-family: 'PingFang SC';
+    font-style: normal;
     font-weight: 400;
+    font-size: 28px;
+    line-height: 39px;
+    text-align: center;
     color: #919BAA;
-    line-height: 36px;
+    margin-top: 16px;
   }
 
   .searchPrice {
     color: #fff !important;
     margin: 0 auto;
-    margin-top: 40px;
+    margin-top: 66px;
     height: 90px;
     width: 80%;
     line-height: 90px;
@@ -62,8 +78,11 @@ export default {
 
     background-color: var(--k-color-primary);
     border-radius: 45px;
-    font-size: 34px;
     font-weight: 400;
+    
+    font-style: normal;
+    font-weight: 400;
+    font-size: 32px;
   }
 
   // .blueSearchPrice {

src/pages/parkingFee/static/images/no-car.svg

@@ -0,0 +1,72 @@
+<svg width="392" height="246" viewBox="0 0 392 246" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g opacity="0.6">
+<ellipse cx="202.169" cy="166.25" rx="189.11" ry="78.92" fill="url(#paint0_linear_5576_4961)"/>
+<circle opacity="0.2" cx="308.38" cy="114.12" r="8.15" fill="url(#paint1_linear_5576_4961)"/>
+<circle cx="222.53" cy="48.48" r="12.44" fill="url(#paint2_linear_5576_4961)"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M372.599 28.8198H371.919C368.609 19.3198 356.629 12.2798 342.339 12.2798C327.039 12.2798 314.339 20.3598 312.189 30.8898C303.549 33.1298 297.449 38.5898 297.449 44.9798C297.449 53.3698 307.969 60.1698 320.949 60.1698C326.811 60.281 332.585 58.7276 337.599 55.6898C339.173 55.8628 340.756 55.9496 342.339 55.9498C348.092 55.9949 353.786 54.7798 359.019 52.3898C362.917 55.3575 367.701 56.9252 372.599 56.8398C382.889 56.8398 391.219 50.5598 391.219 42.8398C391.219 35.1198 382.889 28.8198 372.599 28.8198Z" fill="url(#paint3_linear_5576_4961)"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M94.37 20.77C94.08 20.77 93.8 20.77 93.51 20.77C89.36 8.84 74.31 0 56.37 0C37.15 0 21.25 10.14 18.51 23.37C7.66 26.18 0 33.04 0 41.06C0 51.59 13.21 60.13 29.51 60.13C37.68 60.13 45.08 57.98 50.43 54.51C52.4022 54.7321 54.3854 54.8423 56.37 54.84C63.5961 54.899 70.7473 53.3732 77.32 50.37C82.2113 54.1019 88.2185 56.0749 94.37 55.97C107.29 55.97 117.76 48.08 117.76 38.36C117.76 28.64 107.29 20.77 94.37 20.77Z" fill="url(#paint4_linear_5576_4961)"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M325.169 73.05H324.819C323.099 68.13 316.889 64.48 309.479 64.48C301.549 64.48 294.979 68.66 293.849 74.12C289.369 75.29 286.199 78.12 286.199 81.43C286.199 85.78 291.659 89.31 298.389 89.31C301.432 89.3709 304.429 88.5626 307.029 86.98C307.843 87.0723 308.661 87.1191 309.479 87.12C312.463 87.1427 315.416 86.5112 318.129 85.27C320.137 86.8036 322.603 87.6172 325.129 87.58C330.469 87.58 334.789 84.33 334.789 80.31C334.789 76.29 330.469 73.05 325.169 73.05Z" fill="url(#paint5_linear_5576_4961)"/>
+<ellipse opacity="0.414504" cx="200.168" cy="133.482" rx="81.93" ry="18.2817" fill="#D8DDE8"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M264.5 50.3399C264.74 50.3399 271.88 50.3399 271.88 58.0799H271.82C271.82 65.0999 264.41 65.8199 264.41 65.8199C264.509 65.9249 264.608 66.0297 264.707 66.1344C268.304 69.9399 271.79 73.6272 271.79 81.1599V107.97C271.79 115.24 271.68 115.71 268.11 115.71V119.52C268.11 124.88 263.95 127.25 258.95 127.25H255.27C250.16 127.25 246.11 124.86 246.11 119.52V115.71H158.11V119.52C158.11 124.88 153.95 127.25 148.95 127.25H145.27C140.16 127.25 136.11 124.86 136.11 119.52V115.71C132.67 115.71 132.43 115.11 132.43 107.97V81.1599C132.43 73.4299 136.13 69.1499 139.81 65.8199C139.81 65.8199 132.43 65.2199 132.43 58.0799C132.43 50.3399 139.34 50.3399 139.81 50.3399H147.17L161.84 31.1899C162.458 30.4394 163.034 29.7289 163.578 29.0574C168.909 22.482 171.205 19.6499 180.17 19.6499H224.23C233.618 19.6499 235.394 21.9432 241.553 29.8927C241.876 30.3094 242.211 30.7416 242.56 31.1899L257.17 50.3399H264.5ZM170.82 28.3499L155.22 52.9699V52.9899C152.68 57.6899 155.35 61.1099 163.09 61.1099H241.3C249.29 61.1099 252.09 57.7999 249.17 52.8599L233.56 28.3499C231.698 25.8623 228.796 24.3689 225.69 24.2999H178.69C175.596 24.4174 172.714 25.9007 170.82 28.3499Z" fill="url(#paint6_linear_5576_4961)"/>
+<ellipse cx="153.549" cy="87.8043" rx="8.29" ry="14.82" transform="rotate(-64.38 153.549 87.8043)" fill="#9BA4B2"/>
+<ellipse cx="251.772" cy="87.7914" rx="14.82" ry="8.29" transform="rotate(-25.62 251.772 87.7914)" fill="#9BA4B2"/>
+<path d="M237.311 112.46V112.06C237.305 107.806 233.855 104.36 229.601 104.36H174.671C170.417 104.36 166.966 107.806 166.961 112.06V112.46H237.311Z" fill="#909AA9"/>
+<ellipse cx="153.549" cy="85.7018" rx="8.29" ry="14.82" transform="rotate(-64.38 153.549 85.7018)" fill="#D5DDE9"/>
+<ellipse cx="251.768" cy="85.6786" rx="14.82" ry="8.29" transform="rotate(-25.62 251.768 85.6786)" fill="#D5DDE9"/>
+<path d="M237.311 110.35V109.97C237.311 105.712 233.859 102.26 229.601 102.26H174.671C170.413 102.26 166.961 105.712 166.961 109.97V110.36L237.311 110.35Z" fill="#D5DDE9"/>
+<path d="M163.09 61.1099C155.35 61.1099 152.68 57.6899 155.22 52.9899L170.82 28.3699C172.714 25.9207 175.596 24.4374 178.69 24.3199H208.69L210.89 19.6499H180.17C170.29 19.6499 168.51 23.0899 161.84 31.1899L147.17 50.3399H139.81C139.34 50.3399 132.43 50.3399 132.43 58.0799C132.43 65.2199 139.81 65.8199 139.81 65.8199C136.13 69.1499 132.43 73.4299 132.43 81.1599V107.97C132.43 115.11 132.67 115.71 136.11 115.71V119.52C136.11 124.86 140.16 127.25 145.27 127.25H148.95C153.95 127.25 158.11 124.88 158.11 119.52V115.71H165.56L191.31 61.1599L163.09 61.1099Z" fill="url(#paint7_linear_5576_4961)"/>
+</g>
+<path d="M42.4839 132.133C42.7094 126.534 36.8999 120.634 35.0385 128.638C33.1772 136.641 30.0754 139.61 30.0754 139.61C30.0754 139.61 24.2101 149.661 24.2101 142.653C24.2101 135.646 24.4926 131.659 22.8568 123.478C21.221 115.298 15.7498 117.341 13.8327 122.54C11.9156 127.74 16.3707 134.587 15.1859 139.612C14.0012 144.636 10.4833 146.391 9.09509 137.975C7.70686 129.56 10.307 112.727 10.307 112.727C10.307 112.727 8.38218 110.689 6.8384 110.861C5.29463 111.034 4.13194 113.437 4.13194 113.437C4.13194 113.437 -1.22655 132.834 2.1008 144.285C5.42814 155.735 13.2688 146.676 17.4426 159.241C21.6164 171.806 20.827 192.892 20.827 192.892C22.9258 193.628 25.1483 193.946 27.3689 193.827C29.0617 193.518 30.585 192.605 31.6554 191.256C31.6554 191.256 27.0876 174.898 27.3689 165.316C27.6502 155.735 30.2452 159.477 33.6853 154.567C35.857 151.382 37.6003 147.925 38.8701 144.285C38.8701 144.285 42.2583 137.733 42.4839 132.133Z" fill="#E0E4EC"/>
+<path d="M82.3515 109.322C82.509 105.413 78.4537 101.295 77.1544 106.882C75.8551 112.469 73.6899 114.541 73.6899 114.541C73.6899 114.541 69.5957 121.556 69.5957 116.665C69.5957 111.774 69.7929 108.99 68.6511 103.28C67.5092 97.57 63.6901 98.9957 62.3519 102.625C61.0137 106.255 64.1235 111.035 63.2965 114.542C62.4695 118.049 60.0139 119.274 59.0449 113.4C58.0758 107.526 59.8908 95.7756 59.8908 95.7756C59.8908 95.7756 58.5472 94.3526 57.4696 94.4731C56.392 94.5935 55.5804 96.2711 55.5804 96.2711C55.5804 96.2711 51.8399 109.811 54.1626 117.804C56.4852 125.796 61.9583 119.473 64.8717 128.244C67.7852 137.015 67.2342 151.734 67.2342 151.734C68.6992 152.248 70.2506 152.469 71.8007 152.386C72.9823 152.171 74.0456 151.533 74.7929 150.592C74.7929 150.592 71.6043 139.173 71.8007 132.485C71.997 125.796 73.8084 128.409 76.2098 124.981C77.7257 122.758 78.9426 120.345 79.829 117.804C79.829 117.804 82.1941 113.23 82.3515 109.322Z" fill="#E0E4EC"/>
+<path opacity="0.4" fill-rule="evenodd" clip-rule="evenodd" d="M300.138 154.938C296.601 157.494 292.256 159 287.559 159C275.684 159 266.059 149.374 266.059 137.5C266.059 125.626 275.684 116 287.559 116C299.433 116 309.059 125.626 309.059 137.5C309.059 142.654 307.245 147.385 304.221 151.088L313.669 160.659C314.747 161.752 314.747 163.508 313.669 164.6C312.57 165.713 310.774 165.713 309.676 164.6L300.138 154.938ZM303.45 137.5C303.45 146.277 296.335 153.391 287.559 153.391C278.782 153.391 271.667 146.277 271.667 137.5C271.667 128.723 278.782 121.609 287.559 121.609C296.335 121.609 303.45 128.723 303.45 137.5Z" fill="url(#paint8_linear_5576_4961)"/>
+<defs>
+<linearGradient id="paint0_linear_5576_4961" x1="346.526" y1="-43.8409" x2="255.465" y2="204.24" gradientUnits="userSpaceOnUse">
+<stop stop-color="#E0E5EF" stop-opacity="0.01"/>
+<stop offset="0.26621" stop-color="#C5CCD8"/>
+<stop offset="1" stop-color="white" stop-opacity="0.01"/>
+</linearGradient>
+<linearGradient id="paint1_linear_5576_4961" x1="296.539" y1="98.5863" x2="296.539" y2="122.27" gradientUnits="userSpaceOnUse">
+<stop stop-color="#E0E5EF" stop-opacity="0.01"/>
+<stop offset="1" stop-color="#E0E5EF"/>
+</linearGradient>
+<linearGradient id="paint2_linear_5576_4961" x1="210.09" y1="36.04" x2="210.09" y2="60.92" gradientUnits="userSpaceOnUse">
+<stop stop-color="#E0E5EF" stop-opacity="0.01"/>
+<stop stop-color="#C5CCD8"/>
+<stop offset="1" stop-color="white" stop-opacity="0.01"/>
+</linearGradient>
+<linearGradient id="paint3_linear_5576_4961" x1="245.451" y1="-31.6631" x2="245.451" y2="69.3519" gradientUnits="userSpaceOnUse">
+<stop stop-color="#E0E5EF" stop-opacity="0.01"/>
+<stop offset="0.453044" stop-color="#C5CCD8"/>
+<stop offset="1" stop-color="white" stop-opacity="0.01"/>
+</linearGradient>
+<linearGradient id="paint4_linear_5576_4961" x1="0" y1="0" x2="0" y2="60.13" gradientUnits="userSpaceOnUse">
+<stop stop-color="#E0E5EF" stop-opacity="0.01"/>
+<stop stop-color="#C5CCD8"/>
+<stop offset="1" stop-color="white" stop-opacity="0.01"/>
+</linearGradient>
+<linearGradient id="paint5_linear_5576_4961" x1="275.03" y1="64.48" x2="275.03" y2="100.73" gradientUnits="userSpaceOnUse">
+<stop stop-color="#E0E5EF" stop-opacity="0.01"/>
+<stop stop-color="#C5CCD8"/>
+<stop offset="1" stop-color="white" stop-opacity="0.01"/>
+</linearGradient>
+<linearGradient id="paint6_linear_5576_4961" x1="125.204" y1="15.1613" x2="124.574" y2="97.8517" gradientUnits="userSpaceOnUse">
+<stop stop-color="#ACB4C2"/>
+<stop offset="0.05" stop-color="#E1E6EF"/>
+<stop offset="0.54" stop-color="#DEE4EE"/>
+<stop offset="1" stop-color="#ACB5C2"/>
+<stop offset="1" stop-color="#A6AFBC"/>
+</linearGradient>
+<linearGradient id="paint7_linear_5576_4961" x1="150.019" y1="-29.9193" x2="90.9246" y2="56.7072" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.3"/>
+<stop offset="0.03" stop-color="white" stop-opacity="0.28"/>
+<stop offset="0.29" stop-color="white" stop-opacity="0.16"/>
+<stop offset="0.55" stop-color="white" stop-opacity="0.07"/>
+<stop offset="0.79" stop-color="white" stop-opacity="0.02"/>
+<stop offset="1" stop-color="white" stop-opacity="0.01"/>
+</linearGradient>
+<linearGradient id="paint8_linear_5576_4961" x1="254.507" y1="144.524" x2="295.13" y2="184.901" gradientUnits="userSpaceOnUse">
+<stop stop-color="#909AA9"/>
+<stop offset="1" stop-color="#C5CCD8"/>
+</linearGradient>
+</defs>
+</svg>

src/pages/parkingFee/vehicleAddOrEdit.vue

@@ -32,7 +32,7 @@
         <div :class="[' van-hairline--surround li', active === 6 ? 'active' : '']" @click="clickShowKeyboard(6)">
           {{ numArr[6] }}
         </div>
-        <div class="van-hairline--surround li dashed green-active" @click="clickShowKeyboard(7)" :class="[active === 7 ? 'active' : '']" >
+        <div class="li dashed green-active" @click="clickShowKeyboard(7)" :class="[active === 7 ? 'active' : '']" >
           <span v-if="numArr[7] && carType === 1">{{ numArr[7] }}</span>
           <img v-else :src="require('./static/images/unlicensed/leaf.svg')">
         </div>
@@ -138,7 +138,7 @@ export default {
       margin: 0 3px;
       &.dashed {
         background-color: #fafbff;
-        border-style: dashed;
+        border: 1px dashed #fafbff;
       }
       &.active {
         border-color: var(--k-color-primary);

vue.config.js

@@ -122,8 +122,8 @@ module.exports = {
         },
       },
       '/msApi': {
-        // target: 'https://dev-kip-service-internal.kerryonvip.com/temporary-parking-service', //代理地址，这里设置的地址会代替axios中设置的baseURL
-        target: 'http://172.20.51.70:8080', // 代理地址，这里设置的地址会代替axios中设置的baseURL
+        target: 'https://dev-kip-service-internal.kerryonvip.com/temporary-parking-service', //代理地址，这里设置的地址会代替axios中设置的baseURL
+        // target: 'http://172.20.51.70:8080', // 代理地址，这里设置的地址会代替axios中设置的baseURL
         changeOrigin: true, // 如果接口跨域，需要进行这个参数配置
         //ws: true, // proxy websockets
         //pathRewrite方法重写url