ソースを参照

productDetails

youyawu 5 年 前
コミット
b974408fa2

+ 1 - 5
src/components/loadMore.vue

@@ -43,7 +43,6 @@ export default class extends Vue {
   params: object | undefined;
   @Prop({ default: 10 })
   private readonly rows!: number;
-  @Prop(Boolean) private auth!: boolean;
   @Prop(Boolean) private hideTip!: boolean;
   @PropSync("total") totalSync!: number;
 
@@ -61,7 +60,7 @@ export default class extends Vue {
   }
   @Watch("page", { immediate: true })
   async load() {
-    const [err, { rows = [], total = 0 }] = await this.post<IPageResult>(
+    const [err, { rows = [], total = 0 }] = await this.$post<IPageResult>(
       this.url,
       Object.assign({}, this.params, {
         pageNum: this.page,
@@ -80,9 +79,6 @@ export default class extends Vue {
   private setItems(items: any[]) {
     return (this.items = items);
   }
-  get post() {
-    return this.auth ? this.$post_auth : this.$post;
-  }
 }
 </script>
 <style lang="scss" scoped>

+ 1 - 1
src/main.ts

@@ -14,7 +14,7 @@ Vue.use(request);
 Vue.use(message);
 
 Vue.config.productionTip = false;
-
+Vue.prototype.$basePath = `${process.env.VUE_APP_BASE_API}`.replace(/\/$/, "");
 new Vue({
   router,
   store,

+ 1 - 2
src/types/index.d.ts

@@ -3,7 +3,6 @@ declare module "vue/types/vue" {
   interface Vue {
     $post: IRequest;
     $get: IRequest;
-    $post_auth: IRequest;
-    $get_auth: IRequest;
+    $basePath: string;
   }
 }

+ 2 - 2
src/views/account/login.vue

@@ -83,8 +83,8 @@ export default class extends Vue {
   }
   private setVerifyImg() {
     this.verifyImg = `${
-      process.env.VUE_APP_BASE_API
-    }captcha/info/captchaImage?t=${Date.now()}`;
+      this.$basePath
+    }/captcha/info/captchaImage?t=${Date.now()}`;
   }
   async submit() {
     const token = await user.setToken(this.form);

+ 2 - 3
src/views/home/index.vue

@@ -256,13 +256,12 @@ export default {
           noticeType: noticeType
         })
         .then(function(res) {
-          console.log(res);
-          var target = `${process.env.VUE_APP_Target}`.replace(/\/$/, "");
           if (res[0]) {
             that.$message("数据请求错误!");
           } else {
             for (let i = 0; i < res[1].list.length; i++) {
-              res[1].list[i].fmzFileUrl = target + res[1].list[i].fmzFileUrl;
+              res[1].list[i].fmzFileUrl =
+                that.$basePath + res[1].list[i].fmzFileUrl;
             }
             if (noticeType == 1) {
               that.noticeListTzgg = res[1].list;

+ 1 - 1
src/views/info/details/buy.vue

@@ -43,7 +43,7 @@
     </div>
   </div>
 </template>
-<script lang="ts">
+<script>
 import { Component, Vue, Watch } from "vue-property-decorator";
 export default {
   name: "app",

+ 1 - 1
src/views/info/details/supplyDetail.vue

@@ -56,7 +56,7 @@
     </div>
   </div>
 </template>
-<script lang="ts">
+<script>
 import { Component, Vue, Watch } from "vue-property-decorator";
 export default {
   name: "app",

+ 2 - 3
src/views/mall/index.vue

@@ -91,7 +91,7 @@
         >
           <router-link :to="`/shop/${companyId}/${id}`" class="product">
             <div class="img">
-              <img :src="`${target}${cover}`" />
+              <img :src="`${$basePath}${cover}`" />
             </div>
             <div class="amount"><span>¥</span>{{ price }}</div>
             <div class="name">{{ name }}</div>
@@ -110,11 +110,10 @@ import loadMore from "@/components/loadMore.vue";
   components: { loadMore }
 })
 export default class extends Vue {
-  private target = `${process.env.VUE_APP_Target}`.replace(/\/$/, "");
   private currIndex = 0;
   private params = {
     typeId: 0,
-    orderByColumn: "zhpx",
+    // orderByColumn: "zhpx",
     isAsc: "" //asc desc
   };
   private search = {

+ 5 - 0
src/views/shops/details/index.vue

@@ -40,6 +40,11 @@ import { Component, Vue, Watch, Prop } from "vue-property-decorator";
 export default class extends Vue {
   @Prop(String)
   private sid!: string;
+  @Watch("sid", { immediate: true })
+  async load(id: number) {
+    const [err, data] = await this.$post("/company/details", { id });
+    console.log(data);
+  }
 }
 </script>
 <style lang="scss" scoped>

+ 41 - 19
src/views/shops/details/product.vue

@@ -2,40 +2,44 @@
   <div class="productDetails container">
     <div class="payInfo">
       <div class="imgs fl">
-        <img src="@assets/productDetails.jpg" alt="" />
-        <img src="@assets/productDetails.jpg" alt="" />
-        <img src="@assets/productDetails.jpg" alt="" />
-        <img src="@assets/productDetails.jpg" alt="" />
+        <img :src="imgs[currImgIndex]" alt="" />
+        <img
+          v-for="(s, index) in imgs"
+          :key="`imgs${index}`"
+          :src="s"
+          @mouseover="currImgIndex = index"
+        />
       </div>
       <div class="info fl">
-        <div class="title">铁皮柜</div>
+        <div class="title">{{ product.name }}</div>
         <div class="desc">品牌认证</div>
         <div class="row">
           <div class="tit">价格 :</div>
-          <div class="amount fl"><span>¥</span>1800</div>
+          <div class="amount fl"><span>¥</span>{{ product.price }}</div>
         </div>
         <div class="row">
           <div class="tit">规格 :</div>
           <div class="items">
-            <div class="item curr">
-              一斗两门
-            </div>
-            <div class="item">
-              两斗两门
+            <div
+              v-for="({ size }, index) in product.goodsSizes"
+              :key="`goodsSizes${index}`"
+              :class="{ item: true, curr: form.goodsSizes === index }"
+              @click="form.goodsSizes = index"
+            >
+              {{ size }}
             </div>
           </div>
         </div>
         <div class="row">
           <div class="tit">颜色 :</div>
           <div class="items">
-            <div class="item curr">
-              黑色
-            </div>
-            <div class="item">
-              白色
-            </div>
-            <div class="item">
-              灰色
+            <div
+              v-for="({ id, color }, index) in product.goodsColors"
+              :key="`goodsColors${index}`"
+              :class="{ item: true, curr: form.goodsColors === index }"
+              @click="form.goodsColors = index"
+            >
+              {{ color }}
             </div>
           </div>
         </div>
@@ -88,8 +92,25 @@
 import { Component, Vue, Watch, Prop } from "vue-property-decorator";
 @Component
 export default class extends Vue {
+  private currImgIndex = 0;
+  private form = {
+    goodsSizes: "",
+    goodsColors: ""
+  };
   @Prop(String)
   private pid!: string;
+  private product: IAny = {};
+  @Watch("pid", { immediate: true })
+  async load(id: number) {
+    const [err, data] = await this.$post("/goods/info/details", { id });
+    if (err) return;
+    this.product = data;
+  }
+  get imgs() {
+    return (this.product.slideshow + "")
+      .split(",")
+      .map(x => this.$basePath + x);
+  }
 }
 </script>
 <style lang="scss" scoped>
@@ -152,6 +173,7 @@ export default class extends Vue {
             padding: 5px 15px;
             color: rgb(102, 102, 102);
             margin: 0 20px 10px 0;
+            cursor: pointer;
             &.curr {
               border: 1px rgb(253, 85, 34) solid;
               color: rgb(253, 85, 34);