预售页面接口联调

package-lock.json

@@ -27,6 +27,7 @@
         "qrcode": "^1.5.3",
         "vue": "^3.3.11",
         "vue-i18n": "^9.1.9",
+        "vue-router": "^4.4.3",
         "wot-design-uni": "^1.3.7"
       },
       "devDependencies": {

package.json

@@ -27,6 +27,7 @@
     "qrcode": "^1.5.3",
     "vue": "^3.3.11",
     "vue-i18n": "^9.1.9",
+    "vue-router": "^4.4.3",
     "wot-design-uni": "^1.3.7"
   },
   "devDependencies": {

src/pages/assistingAgriculture/index/building.vue

@@ -27,12 +27,14 @@
           src="/static/assistingAgriculture/assets/culture.png"
           style="width: 366rpx; height: 362rpx"
         />
-        <view v-for="(item, index) in rightList" :key="index">
-          <img
-            class="right-sort"
-            :src="item.icon"
-            style="width: 336rpx; height: 176rpx; margin-left: 8rpx"
-          />
+        <view>
+          <view v-for="(item, index) in rightList" :key="index" @click="toPresale(item.categoryId)">
+            <img
+              class="right-sort"
+              :src="item.icon"
+              style="width: 336rpx; height: 176rpx; margin-left: 8rpx"
+            />
+          </view>
         </view>
       </view>
     </view>
@@ -157,18 +159,24 @@ const getStrictSelectionList = () => {
     rightList.value = res.data.splice(0, 2);
   });
 };
+const toPresale = (id) => {
+  console.log(id, 121);
+  xma.navigateTo({
+    url: `/pages/assistingAgriculture/index/presale?categoryId=${id}`,
+  });
+};
 function handleClick(e) {
   console.log(e);
 }
 function onChange(e) {
   console.log(e);
 }
-function toPresale() {
-  // TODO: 跳转到预售
-  xma.navigateTo({
-    url: '/pages/assistingAgriculture/index/presale',
-  });
-}
+// function toPresale() {
+//   // TODO: 跳转到预售
+//   xma.navigateTo({
+//     url: '/pages/assistingAgriculture/index/presale',
+//   });
+// }
 function toDetail() {
   // TODO: 跳转到详情页
   xma.navigateTo({
@@ -386,4 +394,23 @@ page {
   width: 56rpx;
   height: 56rpx;
 }
+.container1 {
+  display: flex;
+}
+
+.left-box {
+  width: 33.33%;
+  background-color: lightblue;
+}
+
+.right-box {
+  width: 66.66%;
+  display: flex;
+  flex-direction: column;
+}
+
+.right-top-box {
+  height: 100%;
+  background-color: lightgreen;
+}
 </style>

src/pages/assistingAgriculture/index/presale.vue

@@ -143,8 +143,13 @@
 
 <script setup>
 import Search from '../../../components/assistingAgriculture/index/Search.vue';
+import { useRoute } from 'vue-router';
 import { ref, onMounted } from 'vue';
-import { getPresaleList } from '../../../api/assistingAgriculture/building';
+import {
+  getGoodSaleProdList,
+  getPresaleList,
+  getPresaleProdList,
+} from '../../../api/assistingAgriculture/building';
 const swiperList = ref([]);
 const current = ref(0);
 // 轮播图数据
@@ -228,8 +233,10 @@ const goodList = ref([
     price: 69.9,
   },
 ]);
+const router = useRoute();
 onMounted(async () => {
   getPresale();
+  getPresaleProd();
 });
 // 预售板块轮播图
 const getPresale = () => {
@@ -244,6 +251,12 @@ const getPresale = () => {
     });
   });
 };
+// 筑农首页-分类查询商品列表
+const getPresaleProd = () => {
+  getPresaleProdList(router.query).then((res) => {
+    console.log(res, 111);
+  });
+};
 // 左侧数据列表
 const LeftList = ref([]);
 // 右侧数据列表