20261008

2026-10-08 18:34:09 +08:00
commit 2933904f4c
905 changed files with 112129 additions and 0 deletions
@@ -0,0 +1,196 @@
+<template>
+  <view>
+    <view class="layout-semicircle">
+      <view class="background">
+        <view class="text-25 text-white text-right mb-15">客服电话：400 686 5559</view>
+        <view class="title">
+          <image class="title" src="/static/img/sem.jpg" mode=""></image>
+        </view>
+        <view class="flex justify-start items-center mt-20 type-list ml-10">
+          <text class="item" :class="{active: active === 1}" @click="active = 1">现货</text>
+          <text class="item" :class="{active: active === 2}" @click="active = 2">找供应</text>
+          <text class="item" :class="{active: active === 3}" @click="active = 3">找加工</text>
+          <text class="item" :class="{active: active === 4}" @click="active = 4">旧货</text>
+          <text class="item" :class="{active: active === 0}" @click="active = 0">商品</text>
+        </view>
+        <view class="search-box flex justify-between align-center"
+              :style="{borderTopLeftRadius: active === 0 ? '0' : '10rpx'}">
+          <u-icon name="search" size="20"></u-icon>
+          <input class="flex-1 search-input" type="text" placeholder="请输入关键词" v-model="keyword"/>
+          <view class="search-btn" @click="search">搜索</view>
+        </view>
+      </view>
+      <view class="text-white text-25 px-30 flex justify-start items-center" style="background-color: #A92924; padding-bottom: 20rpx">
+        <view class="sort-text mr-10">分类 | </view>
+        <view class="flex justify-start items-center flex-wrap">
+          <view class="mr-10" style="flex-shrink: 0;" v-for="(item,index) in categoryData" :key="index" @click="cateSearch(item.name)">
+            {{ item.name }}
+          </view>
+        </view>
+      </view>
+      <!--			<view class="tel flex justify-center align-center">-->
+      <!--				<u-icon name="phone" size="16"></u-icon>-->
+      <!--				<view class="text" @click="handTel">咨询热线：100-768-1458</view>-->
+      <!--			</view>-->
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      isLogin: false,
+      categoryData: [],
+      active: 1,
+      keyword: ''
+    }
+  },
+  methods: {
+    handTel() {
+      uni.makePhoneCall({
+        phoneNumber: '100-768-1458'
+      })
+    },
+    getCateList() {
+      vk.callFunction({
+        url: 'client/spot/category/pub/getTree',
+        loading: false,
+        data: {},
+        success: (data) => {
+          data.rows.map(item => {
+            item.showChild = false
+            return item
+          })
+          this.categoryData = data.rows
+        }
+      });
+    },
+    search() {
+      if (!this.keyword) return
+      this.$emit('search', {
+        keyword: this.keyword,
+        type: this.active
+      })
+    },
+    cateSearch(keyword) {
+      this.$emit('search', {
+        keyword,
+        type: 1
+      })
+    }
+  },
+  mounted() {
+    this.getCateList()
+  },
+}
+</script>
+
+<style lang="scss">
+.layout-semicircle {
+  background: #ffffff;
+
+  .title {
+    margin: 0 auto;
+    width: 550rpx;
+    height: 58rpx;
+  }
+
+  .tel {
+    padding: 6rpx 0;
+    font-size: 24rpx;
+    line-height: 40rpx;
+    color: #9A9A9A;
+  }
+}
+
+.background {
+  padding: 30rpx 30rpx 24rpx;
+  background: #A92924;
+}
+
+.search-box {
+  //margin-top: 30rpx;
+  height: 80rpx;
+  padding: 0 20rpx;
+  background: #ffffff;
+  border-bottom-left-radius: 10rpx;
+  border-bottom-right-radius: 10rpx;
+  border-top-right-radius: 10rpx;
+  overflow: hidden;
+
+  .search-input {
+    padding: 4rpx 10rpx;
+    font-size: 24rpx;
+    line-height: 32rpx;
+    color: #333333;
+  }
+
+  .search-btn {
+    font-size: 24rpx;
+    line-height: 36rpx;
+    color: #A92924;
+  }
+}
+
+.sort-box {
+  position: relative;
+  height: 80rpx;
+  padding: 10rpx 30rpx 0;
+  //background: url(@/static/img/elliptic.png) center no-repeat;
+  background-color: #A92924;
+  background-size: 100% 100%;
+
+  .sort-text {
+    position: absolute;
+    left: 30rpx;
+    top: 20rpx;
+    z-index: 9;
+    width: 80rpx;
+    height: 28rpx;
+    font-size: 24rpx;
+    font-weight: 600;
+    line-height: 28rpx;
+    text-align: center;
+    color: #ffffff;
+    border-right: 1px solid #ffffff;
+  }
+}
+
+.scroll-box {
+  position: absolute;
+  left: 110rpx;
+  top: 10rpx;
+  z-index: 9;
+  width: 600rpx;
+  height: 40rpx;
+  display: flex;
+  align-items: center;
+  white-space: nowrap;
+
+  .item {
+    display: inline-block;
+    padding: 0 12rpx;
+    font-size: 24rpx;
+    line-height: 40rpx;
+    text-align: center;
+    color: #ffffff;
+  }
+}
+
+.type-list {
+  .item {
+    color: white;
+    margin-right: 10rpx;
+    font-size: 25rpx;
+    padding: 10rpx;
+  }
+
+  .active {
+    color: #A92924;
+    background-color: white;
+    border-top-right-radius: 10rpx;
+    border-top-left-radius: 10rpx;
+  }
+}
+</style>