weixin_52219567 há 2 meses atrás
pai
commit
d54ee48ef1

+ 29 - 0
src/api/goods/index.ts

@@ -0,0 +1,29 @@
+import request from '@/utils/request';
+
+//商品详情
+
+export const getProductDetail = (id: any) => {
+  return request({
+    url: '/product/indexProduct/getProductDetail/' + id,
+    method: 'get'
+  });
+};
+
+//将商品添加到购物车
+export const addProductShoppingCart = (params: any) => {
+  return request({
+    url: '/product/myProduct/addProductShoppingCart',
+    method: 'post',
+    data: params
+  });
+};
+
+
+//查询商品购物车列表
+
+export const shoppingCartList = (params: any) => {
+  return request({
+    url: '/product/shoppingCart/list',
+    method: 'get'
+  });
+};

+ 21 - 1
src/api/home/index.ts

@@ -36,6 +36,16 @@ export function getEnterpriseMemberEquityList(query: any) {
   });
 }
 
+//首页三联广告(平台装修-楼层广告-首页三联广告)
+
+export function getHomeThreeAdList(query: any) {
+  return request({
+    url: '/system/indexSystem/getHomeThreeAdList',
+    method: 'get',
+    params: query
+  });
+}
+
 //热门方案标题
 export function getHotSchemeTitle(query: any) {
   return request({
@@ -102,7 +112,7 @@ export function getExpertSelectionTitle(query: any) {
 //行家精选列表
 export function getExpertSelectionList(query: any) {
   return request({
-    url: '/system/indexSystem/getExpertSelectionList',
+    url: '/product/indexProduct/getExpertSelectionList',
     method: 'get',
     params: query
   });
@@ -162,3 +172,13 @@ export function getProjectCaseTitle(query: any) {
     params: query
   });
 }
+
+//项目案例列表(平台装修-项目案例)
+
+export function getProjectCaseList(query: any) {
+  return request({
+    url: '/product/indexProduct/getProjectCaseList',
+    method: 'get',
+    params: query
+  });
+}

+ 1 - 1
src/api/login.ts

@@ -17,7 +17,7 @@ export function login(data: LoginData): AxiosPromise<LoginResult> {
     grantType: data.grantType || 'password'
   };
   return request({
-    url: '/auth/login',
+    url: '/auth/client/login',
     headers: {
       isToken: false,
       isEncrypt: true,

+ 81 - 23
src/views/index.vue

@@ -35,7 +35,17 @@
             </el-carousel-item>
           </el-carousel>
         </div>
-        <div class="head-box"></div>
+        <div class="head-box">
+          <div v-for="(item, index) in AdList" :key="index" class="head-item">
+            <img :src="item.imageUrl" alt="" />
+            <div class="head-title">
+              <div class="head1">{{ item.title }}</div>
+              <div class="head2">
+                <div>查看方案</div>
+              </div>
+            </div>
+          </div>
+        </div>
       </div>
       <div class="head-right">
         <div class="login-bos">
@@ -92,7 +102,7 @@
         <div class="hot-list flex-column-center" v-if="Number(index) < 4">
           <div class="hot1">{{ item.advertTitle }}</div>
           <div class="hot2">{{ item.advertBrief }}</div>
-          <img :src="item.img" alt="" />
+          <img :src="item.coverImage" alt="" />
         </div>
       </template>
     </div>
@@ -116,7 +126,7 @@
             <div class="scene1">{{ item.advertTitle }}</div>
             <div class="scene2">{{ item.advertBrief }}</div>
           </div>
-          <img :src="item.img" alt="" />
+          <img :src="item.coverImage" alt="" />
         </div>
       </template>
     </div>
@@ -134,11 +144,11 @@
       </div>
     </div>
     <div class="big-brand">
-      <img class="bigBrand-one" :src="bigbrandOne.img" alt="" />
+      <img class="bigBrand-one" :src="bigbrandOne.coverImage" alt="" />
       <div class="bigBrand-bos">
         <template v-for="(item, index) in bigbrandList" :key="index">
           <div class="bigBrand-list" v-if="Number(index) < 10">
-            <img :src="item.img" alt="" />
+            <img :src="item.coverImage" alt="" />
             <div class="bigBrand1">{{ item.advertTitle || '' }}</div>
             <div class="bigBrand2">
               {{ item.advertBrief || '' }}
@@ -164,10 +174,10 @@
       <template v-for="(item, index) in expertList" :key="index">
         <div class="expert-list" v-if="Number(index) < 5">
           <img :src="item.productImage" alt="" />
-          <div class="itemName ellipsis">{{ item.itemName || '格力KFR-72LW/定频冷暖空调柜机3P' }}</div>
+          <div class="itemName ellipsis">{{ item.itemName || '' }}</div>
           <div class="price">
-            <span class="memberPrice">¥12{{ item.memberPrice }}</span>
-            <span class="marketPrice">¥30{{ item.marketPrice }}</span>
+            <span class="memberPrice">¥{{ item.memberPrice }}</span>
+            <span class="marketPrice">¥{{ item.marketPrice }}</span>
           </div>
         </div>
       </template>
@@ -277,7 +287,7 @@
           </div>
         </div>
         <template v-for="(item2, index2) in item1.shopList" :key="index2">
-          <div class="shop-list" v-if="Number(index2) < 4">
+          <div class="shop-list" v-if="Number(index2) < 4" @click="onInfo(item2)">
             <img :src="item2.productImage" alt="" />
             <div class="itemName">{{ item2.itemName }}</div>
             <div class="price">
@@ -304,19 +314,16 @@
     <div class="project-bos">
       <template v-for="(item, index) in projectList" :key="index">
         <div class="project-list" v-if="Number(index) < 3">
-          <img :src="item.productImage" alt="" />
+          <img :src="item.uploadProgram" alt="" />
           <div class="project-box">
-            <div class="project1">{{ item.itemName || '优易365-中南设计集团电子商城项目指定电商' }}</div>
+            <div class="project1">{{ item.caseTitle || '' }}</div>
             <div class="project2">
-              {{
-                item.itemName ||
-                '中南工程咨询设计集团有限公司(以下简称“中南设计集团”),是湖北省政府出资组建的综合型工程咨询新型专利、软件著作权320余项。'
-              }}
+              {{ item.projectBrief || '' }}
             </div>
             <div class="project-more flex-row-between">
               <div></div>
               <div class="flex-row-start">
-                <div style="margin-right: 5px;">了解详情</div>
+                <div style="margin-right: 5px">了解详情</div>
                 <el-icon :size="14" color="#E7000B"><ArrowRight /></el-icon>
               </div>
             </div>
@@ -333,6 +340,7 @@ import {
   getHomeAdList,
   getYouYiZiXunPage,
   getEnterpriseMemberEquityList,
+  getHomeThreeAdList,
   getHotSchemeTitle,
   getHotSchemeList,
   getScenePurchaseTitle,
@@ -346,7 +354,8 @@ import {
   getClassificationFloorDetail,
   getClassificationFloorLabel,
   getClassificationFloorDetail2,
-  getProjectCaseTitle
+  getProjectCaseTitle,
+  getProjectCaseList
 } from '@/api/home/index';
 
 const classifyList = ref<any>([]);
@@ -356,6 +365,7 @@ const classifyInfo = ref<any>([]);
 const carouselList = ref<any>([]);
 const realList = ref<any>([]);
 const interestsList = ref<any>([]);
+const AdList = ref<any>([]);
 const hotTitle = ref<any>('');
 const hotList = ref<any>([]);
 const sceneTitle = ref<any>('');
@@ -372,6 +382,7 @@ const bigbrandList = ref<any>([]);
 const bigbrandOne = ref<any>({});
 
 const homeList = ref<any>([]);
+const router = useRouter();
 
 const enterClassify = (res: any) => {
   classifyShow.value = true;
@@ -411,6 +422,13 @@ getEnterpriseMemberEquityList({}).then((res) => {
   }
 });
 
+//首页三联广告(平台装修-楼层广告-首页三联广告)
+getHomeThreeAdList({}).then((res) => {
+  if (res.code == 200) {
+    AdList.value = res.data;
+  }
+});
+
 //热门方案标题
 getHotSchemeTitle({}).then((res) => {
   if (res.code == 200) {
@@ -464,11 +482,11 @@ getExpertSelectionTitle({}).then((res) => {
 });
 
 //行家精选列表
-// getExpertSelectionList({}).then((res) => {
-//   if (res.code == 200) {
-//     expertList.value = res.data;
-//   }
-// });
+getExpertSelectionList({}).then((res) => {
+  if (res.code == 200) {
+    expertList.value = res.data;
+  }
+});
 
 //采购指南标题
 getPurchaseGuideTitle({}).then((res) => {
@@ -484,6 +502,13 @@ getProjectCaseTitle({}).then((res) => {
   }
 });
 
+//项目案例列表(平台装修-项目案例)
+getProjectCaseList({}).then((res) => {
+  if (res.code == 200) {
+    projectList.value = res.data;
+  }
+});
+
 //外面循环
 getClassificationFloorList({}).then(async (res) => {
   if (res.code == 200) {
@@ -520,6 +545,10 @@ getClassificationFloorList({}).then(async (res) => {
     homeList.value = res.data;
   }
 });
+
+const onInfo = (res: any) => {
+  router.push('/shop/info?id=' + res.id);
+};
 </script>
 
 <style lang="scss" scoped>
@@ -659,8 +688,37 @@ getClassificationFloorList({}).then(async (res) => {
       .head-box {
         width: 756px;
         height: 122px;
-        background: #ffffff;
         margin-top: 10px;
+        display: flex;
+        gap: 0 10px;
+        .head-item {
+          flex: 1;
+          background-color: #ffffff;
+          height: 122px;
+          display: flex;
+          padding-left: 20px;
+          align-items: center;
+          img {
+            width: 84px;
+            height: 84px;
+            margin-right: 10px;
+          }
+          .head-title {
+            .head1 {
+              font-weight: 600;
+              font-size: 22px;
+              color: #101828;
+            }
+            .head2 {
+              width: 76px;
+              height: 21px;
+              border-radius: 34px;
+              border: 1px solid #000000;
+              font-size: 12px;
+              color: #000000;
+            }
+          }
+        }
       }
     }
 

+ 1 - 7
src/views/login.vue

@@ -19,13 +19,7 @@
               </el-input>
             </el-form-item>
             <el-form-item prop="password">
-              <el-input
-                class="login-input"
-                type="password"
-                v-model="loginForm.password"
-                placeholder="输入登录密码"
-                @keyup.enter="handleLogin"
-              >
+              <el-input class="login-input" type="password" v-model="loginForm.password" placeholder="输入登录密码" @keyup.enter="handleLogin">
                 <template #prefix>
                   <el-icon><Lock /></el-icon>
                 </template>

+ 14 - 0
src/views/shop/cart.vue

@@ -133,6 +133,20 @@
 <script setup lang="ts">
 const tableData = ref<any>([{}, {}, {}, {}]);
 const checked1 = ref(false);
+
+import { shoppingCartList } from '@/api/goods/index';
+
+onMounted(() => {
+  getInfo();
+});
+
+const getInfo = () => {
+  shoppingCartList({}).then((res) => {
+    if (res.code == 200) {
+      tableData.value = res.data;
+    }
+  });
+};
 </script>
 
 <style lang="scss" scoped>

+ 69 - 4
src/views/shop/info.vue

@@ -16,7 +16,7 @@
       <img :src="carousel[carouselIndex].img" alt="" class="carousel-img" />
       <div class="head-right flex-column-between">
         <div>
-          <div class="right-title">格力KFR-72LW/(72532)NhAa-3定频冷暖空调柜机3P格力KFR-72LW定频冷暖空调柜机3P</div>
+          <div class="right-title">{{ dataInfo.itemName || '' }}</div>
           <div class="right-num">商品库存 999套</div>
           <div class="right-price flex-row-between">
             <div class="flex-row-start">
@@ -39,7 +39,9 @@
             <img class="address-img" src="@/assets/images/dark.svg" alt="" />
             <div>配送至</div>
             <div class="address-text ellipsis">湖北省武汉市洪山区湖北省武汉市洪山区</div>
-            <el-icon color="#000000" size="15"><ArrowDown /></el-icon>
+            <el-icon color="#000000" size="15">
+              <ArrowDown />
+            </el-icon>
           </div>
           <div class="specs-bos">
             <div v-for="(item1, index1) in specsList" :key="index1" class="specs-list">
@@ -65,7 +67,7 @@
           </div>
         </div>
         <div class="bnt-bos flex-row-start">
-          <div>加入购物车</div>
+          <div @click="onCart">加入购物车</div>
           <div>立即购买</div>
         </div>
       </div>
@@ -81,7 +83,9 @@
       </div>
       <div class="flex-row-start">
         <div class="more3">查看更多</div>
-        <el-icon color="#364153" size="14"><ArrowRight /></el-icon>
+        <el-icon color="#364153" size="14">
+          <ArrowRight />
+        </el-icon>
       </div>
     </div>
     <div class="data-bos">
@@ -106,6 +110,30 @@ import back5 from '@/assets/images/login-background.jpg';
 import { el } from 'element-plus/es/locale/index.mjs';
 import { title } from 'process';
 
+import { getProductDetail, addProductShoppingCart } from '@/api/goods/index';
+
+const route = useRoute();
+const id = ref<any>(null);
+const dataInfo = ref<any>({});
+onMounted(() => {
+  id.value = route.query.id;
+  getInfo();
+});
+
+const getInfo = () => {
+  getProductDetail(id.value).then((res) => {
+    if (res.code == 200) {
+      dataInfo.value = res.data;
+    }
+  });
+};
+
+// getProductDetail({}).then((res) => {
+//   if (res.code == 200) {
+//     realList.value = res.data;
+//   }
+// });
+
 const num = ref<any>(1);
 const carousel = ref<any>([
   {
@@ -166,6 +194,17 @@ const onCarousel = (type: number, index?: any) => {
 const handleChange = (val: any) => {
   // num.value = val;
 };
+
+const onCart = () => {
+  addProductShoppingCart({
+    productId: id.value,
+    productNum: 3
+  }).then((res) => {
+    if (res.code == 200) {
+      ElMessage.success('加入购物车成功');
+    }
+  });
+};
 </script>
 
 <style lang="scss" scoped>
@@ -245,6 +284,7 @@ const handleChange = (val: any) => {
 
       .right-price {
         margin-top: 10px;
+
         .price1 {
           font-size: 12px;
           color: #e7000b;
@@ -295,6 +335,7 @@ const handleChange = (val: any) => {
           margin-right: 10px;
           margin-top: 2px;
         }
+
         .address-text {
           margin-left: 10px;
           width: 138px;
@@ -307,10 +348,12 @@ const handleChange = (val: any) => {
           font-size: 14px;
           color: #364153;
         }
+
         .specs-box {
           display: flex;
           gap: 8px 10px;
           padding-top: 8px;
+
           .specs-item {
             padding: 0 14px;
             height: 32px;
@@ -318,12 +361,15 @@ const handleChange = (val: any) => {
             border: 1px solid #e8e8ea;
             line-height: 32px;
             cursor: pointer;
+
             &.hig {
               border: 1px solid #e7000b;
               color: #e7000b;
             }
+
             &.disabled {
               opacity: 0.5;
+
               &:hover {
                 cursor: not-allowed;
               }
@@ -331,31 +377,37 @@ const handleChange = (val: any) => {
           }
         }
       }
+
       .number-bos {
         margin-top: 20px;
         font-size: 14px;
         color: #364153;
+
         .number-box {
           font-size: 14px;
           color: #6a7282;
           margin-top: 8px;
         }
       }
+
       .bnt-bos {
         width: 428px;
         height: 44px;
         border-radius: 10px;
         overflow: hidden;
+
         div {
           width: 214px;
           height: 44px;
           line-height: 44px;
           text-align: center;
           cursor: pointer;
+
           &:nth-of-type(1) {
             background: #fcecf1;
             color: #e7000b;
           }
+
           &:nth-of-type(2) {
             background: #e7000b;
             color: #ffffff;
@@ -375,13 +427,16 @@ const handleChange = (val: any) => {
     padding-left: 32px;
     font-size: 16px;
     color: #364153;
+
     div {
       cursor: pointer;
     }
+
     .hig {
       color: #101828;
     }
   }
+
   .shop-img {
     width: 696px;
     height: 752px;
@@ -391,16 +446,19 @@ const handleChange = (val: any) => {
   .shop-more {
     width: 696px;
     margin-top: 34px;
+
     .more1 {
       font-weight: 600;
       font-size: 20px;
       color: #101828;
     }
+
     .more2 {
       font-size: 14px;
       color: #364153;
       margin-left: 10px;
     }
+
     .more3 {
       font-size: 14px;
       color: #364153;
@@ -416,29 +474,35 @@ const handleChange = (val: any) => {
     flex-wrap: wrap;
     margin-bottom: 40px;
     margin-top: 24px;
+
     .data-list {
       width: 224px;
       background: #ffffff;
       border-radius: 10px;
       padding: 20px 20px 22px 20px;
       cursor: pointer;
+
       .data-img {
         width: 184px;
         height: 184px;
         border-radius: 10px;
       }
+
       .data-title {
         margin-top: 4px;
         font-size: 14px;
         color: #101828;
         height: 40px;
       }
+
       .money {
         margin-top: 4px;
+
         .money1 {
           font-size: 16px;
           color: #e7000b;
         }
+
         .money2 {
           font-size: 12px;
           color: #99a1af;
@@ -446,6 +510,7 @@ const handleChange = (val: any) => {
           padding-left: 6px;
         }
       }
+
       .data-cat {
         width: 86px;
         height: 26px;