Browse Source

Merge branch 'dev' of company:project-shenyangk11/sy_k11_H_base_daoshi_vue_ts into dev

pull/2/head
deepblues 3 years ago
parent
commit
c6aed703b3
  1. 3
      src/components/PlateInput/PlateInput.vue
  2. 47
      src/components/Search/Key.vue
  3. 17
      src/components/Search/Result.vue
  4. 4
      src/http/api/brand/index.ts
  5. 6
      src/i18n/lang/en.json
  6. 4
      src/i18n/lang/tw.json
  7. 4
      src/i18n/lang/zh.json
  8. 4
      src/views/Member/Member.vue
  9. 2
      src/views/Parking/Parking.vue
  10. 10
      src/views/ServiceList/ServiceList.vue

3
src/components/PlateInput/PlateInput.vue

@ -19,7 +19,7 @@
</TransitionGroup> </TransitionGroup>
<div class="btn disabled" @click="confirm"> <div class="btn disabled" @click="confirm">
<slot></slot> <slot></slot>
<span>{{ btnText }}</span>
<span>查找车辆</span>
</div> </div>
</div> </div>
</template> </template>
@ -41,7 +41,6 @@ const props = withDefaults(defineProps<Props>(), {
const PLATE_LENGTH = 8 // const PLATE_LENGTH = 8 //
const renderInputLength = computed(() => (props.searchMethod === '车牌' ? PLATE_LENGTH : props.spaceLength)) const renderInputLength = computed(() => (props.searchMethod === '车牌' ? PLATE_LENGTH : props.spaceLength))
const btnText = computed(() => (props.searchMethod === '车牌' ? '寻车缴费' : '寻车导航'))
const emits = defineEmits(['handle-energy', 'confirm']) const emits = defineEmits(['handle-energy', 'confirm'])
const isEnergy = ref(false) const isEnergy = ref(false)

47
src/components/Search/Key.vue

@ -17,8 +17,13 @@
> >
{{ item }} {{ item }}
</li> </li>
<li class="letter del" :class="{ 'active-btn': current === 37 }" @click="del()">
<img src="@/assets/images/search/del.png" alt="" />
<li class="letter del" :class="{ 'active-btn': current === 37 }" @click="del(37)">
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M8.71275 4H27.9994C28.353 4 28.6922 4.14048 28.9422 4.39052C29.1923 4.64057 29.3328 4.97971 29.3328 5.33333V26.6667C29.3328 27.0203 29.1923 27.3594 28.9422 27.6095C28.6922 27.8595 28.353 28 27.9994 28H8.71275C8.4933 28 8.27723 27.9459 8.08371 27.8424C7.89019 27.7389 7.72522 27.5892 7.60342 27.4067L0.492754 16.74C0.346569 16.5209 0.268555 16.2634 0.268555 16C0.268555 15.7366 0.346569 15.4791 0.492754 15.26L7.60342 4.59333C7.72522 4.41078 7.89019 4.26111 8.08371 4.15761C8.27723 4.0541 8.4933 3.99997 8.71275 4ZM9.42609 6.66667L3.20475 16L9.42609 25.3333H26.6661V6.66667H9.42609ZM17.3328 14.1147L21.1034 10.3427L22.9901 12.2293L19.2181 16L22.9901 19.7707L21.1034 21.6573L17.3328 17.8853L13.5621 21.6573L11.6754 19.7707L15.4474 16L11.6754 12.2293L13.5621 10.3427L17.3328 14.1147Z"
:fill="current === 37 ? '#ffffff' : '#9F9585'"
/>
</svg>
</li> </li>
</ul> </ul>
</div> </div>
@ -63,6 +68,7 @@ const letter = [
'M' 'M'
] ]
const current = ref(-1) const current = ref(-1)
const time = ref<any>()
// //
function handleLetter(item: string | number, index: number) { function handleLetter(item: string | number, index: number) {
if (current.value === index) { if (current.value === index) {
@ -71,11 +77,20 @@ function handleLetter(item: string | number, index: number) {
if (props.word.length < 10) { if (props.word.length < 10) {
emit('change', item) emit('change', item)
current.value = index current.value = index
time.value = setTimeout(() => {
clearTimeout(time.value)
current.value = -1
}, 500)
} }
} }
// //
function del() {
function del(index: number) {
current.value = index
time.value = setTimeout(() => {
clearTimeout(time.value)
current.value = -1
}, 500)
emit('del') emit('del')
} }
</script> </script>
@ -160,7 +175,11 @@ function del() {
} }
} }
.active-btn { .active-btn {
animation: gradient 3s ease 1;
color: #fff;
background: #9b8c85;
img {
filter: invert(1) brightness(100%);
}
} }
.del { .del {
width: 184px; width: 184px;
@ -169,24 +188,4 @@ function del() {
} }
} }
} }
@keyframes gradient {
0% {
background: #f4f4f4;
}
25% {
color: #fff;
background: #9b8c85;
}
50% {
color: #fff;
background: #9b8c85;
}
75% {
background: #f4f4f4;
}
100% {
background: #f4f4f4;
}
}
</style> </style>

17
src/components/Search/Result.vue

@ -1,6 +1,6 @@
<template> <template>
<div class="result-container"> <div class="result-container">
<ScrollView class="myScoll" :list="list" :pull-up="false">
<ScrollView v-if="list.length" class="myScoll" :list="list" :pull-up="false">
<div class="shop_list"> <div class="shop_list">
<div v-for="item in list" :key="item.shopCode" class="shop_item" @click="show(item)"> <div v-for="item in list" :key="item.shopCode" class="shop_item" @click="show(item)">
<div class="left"> <div class="left">
@ -16,6 +16,7 @@
</div> </div>
</div> </div>
</ScrollView> </ScrollView>
<img v-else class="empty" src="@/assets/images/nodata.svg" alt="" />
</div> </div>
</template> </template>
@ -37,17 +38,16 @@ function show(item: Shop) {
.result-container { .result-container {
width: 714px; width: 714px;
height: 694px; height: 694px;
padding-top: 64px;
padding-left: 65px;
padding: 64px 85px 0 65px;
background: #fff; background: #fff;
border-radius: 12px;
border-radius: 12px 12px 0 0;
.myScoll { .myScoll {
overflow: hidden; overflow: hidden;
height: 630px; height: 630px;
} }
.shop_list { .shop_list {
display: grid; display: grid;
gap: 32px 180px;
gap: 32px 150px;
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;
padding-bottom: 10px; padding-bottom: 10px;
.shop_item { .shop_item {
@ -70,12 +70,12 @@ function show(item: Shop) {
} }
} }
.info { .info {
width: 96px;
width: 120px;
height: 60px; height: 60px;
.name { .name {
@include no-wrap; @include no-wrap;
width: 96px;
width: 120px;
height: 32px; height: 32px;
margin-bottom: 6px; margin-bottom: 6px;
font-size: 24px; font-size: 24px;
@ -104,5 +104,8 @@ function show(item: Shop) {
} }
} }
} }
.empty {
margin-left: 45px;
}
} }
</style> </style>

4
src/http/api/brand/index.ts

@ -8,6 +8,6 @@ export const getShopListByFloor = () => request<{ list: GroupList }>({ url: `/JS
export const getShopListByIndustry = () => request<{ list: GroupList }>({ url: `/JSON/getBrandShopListByIndustryId.json` }) export const getShopListByIndustry = () => request<{ list: GroupList }>({ url: `/JSON/getBrandShopListByIndustryId.json` })
//点击喜欢按钮 //点击喜欢按钮
export const setBrandStar = (data: starPara) => request<{ code: number }>({ url: `/api/guide/v1/web/setBrandStar`, data, method: 'get' })
export const setBrandStar = (params: starPara) => request<{ code: number }>({ url: `/guide/v1/web/setBrandStar`, params, method: 'get' })
//获取喜欢按钮 //获取喜欢按钮
export const getBrandStar = (data: starPara) => request({ url: `/api/guide/v1/web/getBrandStar`, data, method: 'get' })
export const getBrandStar = (params: starPara) => request({ url: `/guide/v1/web/getBrandStar`, params, method: 'get' })

6
src/i18n/lang/en.json

@ -22,8 +22,10 @@
}, },
"dispoint": "Activity and Discount", "dispoint": "Activity and Discount",
"service": "Service", "service": "Service",
"school": "College Of Culture",
"school": "School",
"hot": "Hot Shop", "hot": "Hot Shop",
"searB": "Search Brand", "searB": "Search Brand",
"road": "Traffic"
"road": "Traffic",
"navt": "Navigate to",
"fuwu": "Service Desk"
} }

4
src/i18n/lang/tw.json

@ -25,5 +25,7 @@
"school": "文化學院", "school": "文化學院",
"hot": "熱門店鋪", "hot": "熱門店鋪",
"searB": "搜索品牌", "searB": "搜索品牌",
"road": "路況說明"
"road": "路況說明",
"navt": "導航至",
"fuwu": "服務臺"
} }

4
src/i18n/lang/zh.json

@ -25,5 +25,7 @@
"school": "文化学院", "school": "文化学院",
"hot": "热门店铺", "hot": "热门店铺",
"searB": "搜索品牌", "searB": "搜索品牌",
"road": "路况说明"
"road": "路况说明",
"navt": "导航至",
"fuwu": "服务台"
} }

4
src/views/Member/Member.vue

@ -3,8 +3,8 @@
<transition appear enter-active-class="animate__animated animate__fadeIn" leave-active-class="animate__animated animate__zoomOut"> <transition appear enter-active-class="animate__animated animate__fadeIn" leave-active-class="animate__animated animate__zoomOut">
<div class="carousel"> <div class="carousel">
<Carousel :ac-list="memberInfo" /> <Carousel :ac-list="memberInfo" />
</div> </transition
>>
</div>
</transition>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">

2
src/views/Parking/Parking.vue

@ -162,6 +162,7 @@ getParkingInfo().then(({ data }) => {
.title { .title {
margin: 0 48px 12px; margin: 0 48px 12px;
font-size: 24px; font-size: 24px;
font-family: 'font_bold';
color: #595447; color: #595447;
font-weight: 700; font-weight: 700;
line-height: 32px; line-height: 32px;
@ -187,6 +188,7 @@ getParkingInfo().then(({ data }) => {
.intro { .intro {
padding-right: 24px; padding-right: 24px;
font-size: 14px; font-size: 14px;
font-family: 'font_regular';
text-align: justify; text-align: justify;
color: #736661; color: #736661;
line-height: 28px; line-height: 28px;

10
src/views/ServiceList/ServiceList.vue

@ -11,8 +11,10 @@
</div> </div>
</transition> </transition>
<div class="btn" @click="go"> <div class="btn" @click="go">
<span class="text">导航至</span>
<span class="textC">服务台</span>
<div class="text-container">
<div class="text">{{ $t('navt') }}</div>
<div class="textC">{{ $t('fuwu') }}</div>
</div>
</div> </div>
</template> </template>
@ -93,6 +95,9 @@ function go() {
height: 98px; height: 98px;
background: #d6bd86; background: #d6bd86;
border-radius: 16px; border-radius: 16px;
.text-container {
@include fl(center, flex-end);
}
.text { .text {
margin-right: 8px; margin-right: 8px;
font-size: 28px; font-size: 28px;
@ -103,6 +108,7 @@ function go() {
line-height: 36px; line-height: 36px;
} }
.textC { .textC {
margin-bottom: 1px;
font-size: 16px; font-size: 16px;
font-family: 'font_regular'; font-family: 'font_regular';
color: #fff; color: #fff;

Loading…
Cancel
Save