12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182 |
- <template>
- <view class="content">
- <view class="one">
- <u-search shape="square" v-model="value" :show-action="true" action-text="取消" placeholder="想买什么车"
- @change="toChange" @custom="toCustom"></u-search>
- </view>
- <view class="two">
- <view class="list" v-for="(item, index) in list" :key="index" @tap="toView(item)">
- <view class="left">
- <image v-if="item.file" class="image" :src="item.file&&item.file.length>0?item.file[0].url:''">
- </image>
- <u-icon v-else size="14px" name="search"></u-icon>
- </view>
- <view class="right">
- {{item.name}}
- </view>
- </view>
- </view>
- </view>
- </template>
- <script setup lang="ts">
- import { getCurrentInstance, ref } from 'vue';
- // 请求接口
- const $api = getCurrentInstance()?.appContext.config.globalProperties.$api;
- const value = ref('');
- const list = ref([]);
- // 查询
- const search = async () => {
- };
- // 搜索
- const toChange = async () => {
- };
- // 取消
- const toCustom = async () => {
- value.value = ''
- };
- // 查看详情
- const toView = (item) => {
- console.log(item);
- uni.navigateTo({
- url: `/pagesHome/search/index?type=${item.type || ''}`
- })
- };
-
- </script>
- <style lang="scss" scoped>
- .content {
- display: flex;
- flex-direction: column;
- width: 100vw;
- height: 100vh;
- .one {
- padding: 2vw;
- }
- .two {
- .list {
- display: flex;
- align-items: center;
- margin: 1vw 0 0 0;
- padding: 1vw;
- border-bottom: 1px solid var(--f9Color);
- }
- .left {
- .image {
- width: 40px;
- height: 40px;
- border-radius: 40px;
- }
- }
- .right {
- margin: 0 0 0 2vw;
- font-size: var(--font14Size);
- }
- }
- }
- </style>
|