zancun

src/common/request.js

@@ -37,7 +37,8 @@ instance.interceptors.request.use(
       if (!!token) {
         config.headers["Authorization"] = `${token}`;
       } else {
-        if (config.method == "get") { // 未登录添加随机字符串 用于推荐
+        if (config.method == "get") {
+          // 未登录添加随机字符串 用于推荐
           config.params
             ? (config.params.rand_user = randoms)
             : (config.params = { rand_user: randoms });
@@ -90,6 +91,10 @@ const responseFilter = (code = -1, data = {}, response, type) => {
         data.msg == "Expired token"
       ) {
         localStorage.removeItem("token");
+        localStorage.removeItem("user_info");
+        localStorage.removeItem("user_level");
+        store.state.userInfo = "";
+        store.state.userLevel = "";
         if (type == "post" && !store.state.is_login.show) {
           store.state.is_login.show = true;
         }

src/common/service.js

@@ -125,6 +125,7 @@ export const UserCenterService = {
       .get("/api/User_center/getUserInfo", data, { notShowLoginWindow })
       .then((res) => {
         if (res.code != -1) {
+          res.data.detail.set_time = new Date().getTime();
           localStorage.setItem("user_info", JSON.stringify(res.data.detail));
           localStorage.setItem(
             "user_level",

src/components/card/card-module/card-content.vue

@@ -13,11 +13,11 @@
       v-else-if="isOverflow && !hide"
     >
       {{ content
-      }}<span class="hideBtn" @click="hide = true"
+      }}<span class="hideBtn" @click.stop="hide = true"
         >收起<img src="@/assets/icon/arrow-blue.png" alt=""
       /></span>
     </div>
-    <span class="showBtn" v-if="isOverflow && hide" @click="hide = false"
+    <span class="showBtn" v-if="isOverflow && hide" @click.stop="hide = false"
       >查看全文<img src="@/assets/icon/arrow-blue.png" alt=""
     /></span>
   </div>

src/components/card/card-module/card-cover-detail.vue

@@ -82,6 +82,7 @@ export default {
     .cover {
       width: 100%;
       height: 100%;
+      object-fit: cover;
     }
     .is_normal {
       width: 100%;

src/components/card/image-text/my-reply-card.vue

@@ -19,6 +19,9 @@
         />
         <CardCoverDetail
           :info="{
+            app_logo: info.parent_comment.app_logo,
+            app_name: info.parent_comment.app_name,
+            cover: info.parent_comment.cover,
             title: info.parent_comment.title,
             series_title: info.parent_comment.series_title,
             ...info,

src/components/card/image-text/reply-my-card.vue

@@ -18,7 +18,16 @@
           style="margin-bottom: 10px"
           :content="`@${userInfo.name}：${info.parent_comment.content}`"
         />
-        <CardCoverDetail :info="info.parent_comment" />
+        <CardCoverDetail
+          :info="{
+            app_logo: info.parent_comment.app_logo,
+            app_name: info.parent_comment.app_name,
+            cover: info.parent_comment.cover,
+            title: info.parent_comment.title,
+            series_title: info.parent_comment.series_title,
+            ...info,
+          }"
+        />
       </div>
     </CardBox>
   </div>

src/components/card/information/like-my-comment-card.vue

@@ -7,6 +7,7 @@
           :name="info.user_name"
           :time="info.create_at"
           :isRead="info.is_read"
+          :btnList="[]"
           v-on="$listeners"
         />
       </div>

src/components/card/information/my-reply-card.vue

@@ -19,6 +19,9 @@
         />
         <CardFileDetail
           :info="{
+            app_logo: info.parent_comment.app_logo,
+            app_name: info.parent_comment.app_name,
+            url: info.parent_comment.url,
             title: info.parent_comment.title,
             series_title: info.parent_comment.series_title,
             ...info,

src/components/card/information/reply-my-card.vue

@@ -18,7 +18,16 @@
           style="margin-bottom: 10px"
           :content="`@${userInfo.name}：${info.parent_comment.content}`"
         />
-        <CardFileDetail :info="info.parent_comment" />
+        <CardFileDetail
+          :info="{
+            app_logo: info.parent_comment.app_logo,
+            app_name: info.parent_comment.app_name,
+            url: info.parent_comment.url,
+            title: info.parent_comment.title,
+            series_title: info.parent_comment.series_title,
+            ...info,
+          }"
+        />
       </div>
     </CardBox>
   </div>

src/components/card/video/my-reply-card.vue

@@ -19,6 +19,9 @@
         />
         <CardCoverDetail
           :info="{
+            app_logo: info.parent_comment.app_logo,
+            app_name: info.parent_comment.app_name,
+            cover: info.parent_comment.cover,
             title: info.parent_comment.title,
             series_title: info.parent_comment.series_title,
             ...info,

src/components/card/video/reply-my-card.vue

@@ -18,7 +18,16 @@
           style="margin-bottom: 10px"
           :content="`@${userInfo.name}：${info.parent_comment.content}`"
         />
-        <CardCoverDetail :info="info.parent_comment" />
+        <CardCoverDetail
+          :info="{
+            app_logo: info.parent_comment.app_logo,
+            app_name: info.parent_comment.app_name,
+            cover: info.parent_comment.cover,
+            title: info.parent_comment.title,
+            series_title: info.parent_comment.series_title,
+            ...info,
+          }"
+        />
       </div>
     </CardBox>
   </div>

src/components/image-text/image-text-collection-card.vue

@@ -53,6 +53,7 @@ export default {
     .cover {
       width: 100%;
       height: 100%;
+      object-fit: cover;
     }
     .vip {
       width: 30px;

src/components/image-text/image-text-recommend-card.vue

@@ -40,7 +40,7 @@
           </div>
         </el-popover>
 
-        <div class="item" @click.stop="reportVisible = true">
+        <div class="item" @click.stop="showReport">
           <img src="@/assets/icon/举报_黑色.png" alt="" />
           <span>举报</span>
         </div>
@@ -76,7 +76,7 @@ export default {
     },
   },
   methods: {
-    //复制
+    // 复制
     handleCopy(value) {
       let that = this;
       navigator.clipboard.writeText(value).then(function () {
@@ -84,6 +84,12 @@ export default {
         that.$emit("handleForward");
       });
     },
+    // 举报
+    showReport() {
+      if (!this.$store.state.userInfo)
+        return (this.$store.state.is_login.show = true);
+      this.reportVisible = true;
+    },
   },
 };
 </script>

src/components/layout/Header.vue

@@ -8,6 +8,10 @@
     </div>
     <div class="header-search">
       <input class="search" type="text" v-model="searchState.value" />
+      <div class="hot">
+        <img src="@/assets/icon/热搜榜.png" />
+        <span>热搜榜</span>
+      </div>
       <div class="btn" @click="handleSearch">
         <i class="el-icon-search"></i>
         搜索
@@ -160,6 +164,7 @@ export default {
     display: flex;
     justify-content: flex-end;
     align-items: center;
+    position: relative;
     .search {
       width: calc(100% - 100px);
       height: 50px;
@@ -173,6 +178,20 @@ export default {
       border-bottom-left-radius: 25px;
       font-size: 16px;
     }
+    .hot {
+      position: absolute;
+      right: 130px;
+      font-size: 14px;
+      font-weight: 400;
+      color: #ff7b15;
+      display: flex;
+      align-items: center;
+      user-select: none;
+      img{
+        width: 18px;
+        height: 18px;
+      }
+    }
     .btn {
       width: 100px;
       height: 50px;

src/components/module/collection.vue

@@ -2,7 +2,7 @@
   <div class="collection">
     <div class="left" @click="$emit('toCollection')">
       <div class="top">
-        <img class="icon" src="@/assets/icon/合集.png" alt="" />
+        <img class="icon" src="@/assets/icon/合集_蓝色.png" alt="" />
         <span class="title">{{ title || "---" }} </span>
         <img class="rightIcon" src="@/assets/icon/right.png" />
       </div>

src/components/module/content-tab.vue

@@ -6,7 +6,7 @@
       :class="{ select: index == current }"
       @click="$emit('changeTab', index)"
     >
-      {{ item.name }}
+      {{ text[index] }}
     </div>
     <div class="refresh" @click="$emit('handleRefresh')" v-if="showRefresh">
       <img src="@/assets/icon/refresh.png" class="icon" alt="" />
@@ -26,6 +26,12 @@ export default {
       type: Boolean,
       default: true,
     },
+    text: {
+      type: Array,
+      default: function () {
+        return ["为你推荐", "全部"];
+      },
+    },
   },
   data() {
     return {

src/components/module/detail-title.vue

@@ -14,8 +14,8 @@
         </div>
       </div>
       <div class="related">
-        <div class="item" @click="visible = true">
-          <img src="@/assets/icon/简介.png" alt="" />
+        <div class="item" v-if="show_desc" @click="visible = true">
+          <img src="@/assets/icon/简介_蓝色.png" alt="" />
           <span>简介</span>
         </div>
         <div
@@ -67,6 +67,10 @@ export default {
     series_info: {
       type: Object,
     },
+    show_desc: {
+      type: Boolean,
+      default: true,
+    },
   },
   data() {
     return {

src/components/module/file-viewer.vue

@@ -11,7 +11,9 @@
         <img class="file-icon" :src="fileIcon" alt="" />
         <div class="none-view">暂不支持预览此类型文件</div>
         <div class="tips" v-if="info.is_down">请尝试下载后使用其他应用打开</div>
-        <div class="download" v-if="info.is_down">点击下载</div>
+        <div class="download" v-if="info.is_down" @click="download">
+          点击下载
+        </div>
       </div>
     </el-dialog>
   </div>

src/components/module/invoice.vue

@@ -0,0 +1,291 @@
+<template>
+  <div class="invoice">
+    <div class="switch">
+      <span>发票</span>
+      <el-switch v-model="invoice_switch" active-color="#2A63F3"> </el-switch>
+    </div>
+    <div class="form-box" v-show="invoice_switch">
+      <div class="item">
+        <div class="label">发票类型</div>
+        <div class="content invoice-type">
+          <div
+            class="type-item"
+            v-for="item in invoice_list"
+            :class="{ select: params.type == item.id }"
+            @click="params.type = item.id"
+          >
+            <span>{{ item.title }}</span>
+            <div class="mark">
+              <i class="el-icon-check"></i>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="item">
+        <div class="label">抬头类型</div>
+        <div class="content header-type">
+          <div class="type-item" :class="{ select: true }">
+            <span> 公司 </span>
+            <div class="mark">
+              <i class="el-icon-check"></i>
+            </div>
+          </div>
+          <div class="get-header">
+            <span>获取搞一下汽车电子发票抬头</span>
+          </div>
+        </div>
+      </div>
+      <div class="item">
+        <div class="label">发票抬头</div>
+        <div class="content">
+          <input
+            v-model="params.header"
+            placeholder="填写需要开具发票的企业名称"
+          />
+        </div>
+      </div>
+      <div class="item">
+        <div class="label">纳税人识别号</div>
+        <div class="content">
+          <input
+            v-model="params.identify_number"
+            placeholder="填写纳税人识别号"
+          />
+        </div>
+      </div>
+      <div class="item">
+        <div class="label">邮箱</div>
+        <div class="content">
+          <input v-model="params.email" placeholder="请填写您的邮箱" />
+        </div>
+      </div>
+      <div class="item">
+        <div class="label require-no">备注</div>
+        <div class="content">
+          <textarea
+            v-model="params.remark"
+            placeholder="最多300字"
+            maxlength="300"
+          ></textarea>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { BillService } from "@/common/service";
+export default {
+  props: {
+    params: {
+      type: Object,
+      default: function () {
+        return {};
+      },
+    },
+  },
+  data() {
+    return {
+      invoice_switch: true,
+      invoice_list: [],
+    };
+  },
+  mounted() {
+    this.getBillType();
+  },
+  methods: {
+    // 获取发票类型
+    getBillType() {
+      BillService.getBillType().then(({ data }) => {
+        this.invoice_list = data.list;
+        this.params.type = data.list ? data.list[0].id : "";
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.invoice {
+  .switch {
+    font-size: 20px;
+    font-weight: 500;
+    color: #030303;
+    display: flex;
+    align-items: center;
+    margin-bottom: 10px;
+    span {
+      margin-right: 10px;
+      line-height: 20px;
+    }
+  }
+  .form-box {
+    margin-top: 30px;
+    width: 100%;
+    overflow: hidden;
+    padding-top: 5px;
+    .item {
+      display: flex;
+      align-items: flex-start;
+      margin-bottom: 15px;
+      .label {
+        width: 120px;
+        height: 50px;
+        font-size: 16px;
+        font-weight: 400;
+        color: #030303;
+        text-align: right;
+        line-height: 50px;
+        margin-right: 25px;
+      }
+      .label::after {
+        content: "*";
+        color: #e02020;
+      }
+      .require-no::after {
+        display: none;
+      }
+      .content {
+        width: calc(100% - 150px);
+        input {
+          width: 100%;
+          height: 50px;
+          outline: none;
+          background: #f4f4f4;
+          border-radius: 4px;
+          border: 1px solid #dbdbdb;
+          line-height: 50px;
+          box-sizing: border-box;
+          padding: 15px;
+          font-size: 14px;
+        }
+        input::placeholder {
+          font-size: 14px;
+          font-weight: 400;
+          color: #999999;
+        }
+        textarea {
+          width: 100%;
+          height: 120px;
+          outline: none;
+          background: #f4f4f4;
+          border-radius: 4px;
+          border: 1px solid #dbdbdb;
+          box-sizing: border-box;
+          padding: 15px;
+          font-size: 14px;
+          resize: none;
+        }
+        textarea::placeholder {
+          font-size: 14px;
+          font-weight: 400;
+          color: #999999;
+        }
+      }
+      .invoice-type {
+        display: flex;
+        align-items: center;
+        height: 50px;
+        .type-item {
+          width: 220px;
+          height: 50px;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          border: 1px solid #e9e9e9;
+          margin-right: 20px;
+          cursor: pointer;
+          font-size: 15px;
+          font-weight: 400;
+          color: #444444;
+          .mark {
+            position: absolute;
+            opacity: 0;
+          }
+        }
+        .select {
+          border: 1px solid #2a63f3;
+          position: relative;
+          .mark {
+            transition: all 0.1s;
+            opacity: 1;
+            position: absolute;
+            bottom: 0;
+            right: 0;
+            border-top: 12px solid transparent;
+            border-left: 12px solid transparent;
+            border-right: 12px solid #2a63f3;
+            border-bottom: 12px solid #2a63f3;
+            i {
+              position: absolute;
+              color: white;
+              font-size: 12px;
+              right: -11px;
+              bottom: -11px;
+              transition: opacity 0.2s;
+            }
+          }
+        }
+      }
+      .header-type {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        height: 50px;
+        .type-item {
+          width: 140px;
+          height: 50px;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          border: 1px solid #e9e9e9;
+          margin-right: 20px;
+          cursor: pointer;
+          font-size: 15px;
+          font-weight: 400;
+          color: #444444;
+          .mark {
+            position: absolute;
+            opacity: 0;
+          }
+        }
+        .select {
+          border: 1px solid #2a63f3;
+          position: relative;
+          .mark {
+            transition: all 0.1s;
+            opacity: 1;
+            position: absolute;
+            bottom: 0;
+            right: 0;
+            border-top: 12px solid transparent;
+            border-left: 12px solid transparent;
+            border-right: 12px solid #2a63f3;
+            border-bottom: 12px solid #2a63f3;
+            i {
+              position: absolute;
+              color: white;
+              font-size: 12px;
+              right: -11px;
+              bottom: -11px;
+              transition: opacity 0.2s;
+            }
+          }
+        }
+        .get-header {
+          height: 50px;
+          font-size: 14px;
+          font-family: PingFangSC-Regular, PingFang SC;
+          font-weight: 400;
+          color: #2a63f3;
+          display: flex;
+          align-items: flex-end;
+          span {
+            cursor: pointer;
+          }
+        }
+      }
+    }
+  }
+}
+</style>

src/components/module/screen.vue

@@ -15,7 +15,7 @@
         {{ item.title }}
       </div>
     </div>
-    <div class="children">
+    <div class="children" v-if="show_second">
       <div
         class="children-item"
         v-for="item in current.children"
@@ -35,6 +35,10 @@ export default {
     list: {
       type: Array,
     },
+    show_second: {
+      type: Boolean,
+      default: true,
+    },
   },
   data() {
     return {

src/components/vip/order-card.vue

@@ -13,7 +13,7 @@
       </div>
     </div>
     <div class="card-footer">
-      <div class="btn">
+      <div class="btn" @click="toInvoice">
         {{
           info.bill_info ? "查看发票" : info.bill_apply ? "开票中" : "申请开票"
         }}
@@ -31,6 +31,20 @@ export default {
       type: Object,
     },
   },
+  methods: {
+    toInvoice() {
+      this.$router.push({
+        path: this.info.bill_info
+          ? ""
+          : this.info.bill_apply
+          ? ""
+          : "/vip-invoice-apply",
+        query: {
+          order_id: this.info.id,
+        },
+      });
+    },
+  },
 };
 </script>
 

src/components/vip/payment-window-wx.vue

@@ -78,6 +78,9 @@ export default {
         }, 1000);
       });
     },
+    hide() {
+      this.visible = false;
+    },
     createQRCode() {
       QRCode.toCanvas(this.$refs["wx-payment-qrcode"], this.wx_code_url, {
         errorCorrectionLevel: "H", //容错级别

src/components/vip/payment-window-zfb.vue

@@ -42,6 +42,9 @@ export default {
     show() {
       this.visible = true;
     },
+    hide() {
+      this.visible = false;
+    },
   },
 };
 </script>

src/router/index.js

@@ -127,16 +127,16 @@ router.open = (path) => {
 
 // 初始化store
 function initStore() {
-  if (localStorage.getItem("token") && !localStorage.getItem("user_info")) {
+  const user_info = JSON.parse(localStorage.getItem("user_info"));
+  let update = user_info
+    ? new Date().getTime() - user_info.set_time > 6000
+    : true;
+
+  if (localStorage.getItem("token") && (!store.state.userInfo || update)) {
     UserCenterService.getUserInfo(null, false);
   }
-  if (localStorage.getItem("token") && !store.state.userInfo) {
-    store.state.userInfo = JSON.parse(localStorage.getItem("user_info"));
-  }
-  if (localStorage.getItem("token") && !store.state.userLevel) {
-    store.state.userLevel = JSON.parse(localStorage.getItem("user_level"));
-  }
   if (!store.state.reportCase.length) {
+    // 获取举报类目
     store.dispatch("getReportCase");
   }
 }

src/router/vip-routes.js

@@ -33,5 +33,12 @@ export const vipRoutes = [
       title: "会员", // 页面标题title
     },
     component: () => import("@/views/vip/vip-member.vue"),
-  }
+  },
+  {
+    path: "/vip-invoice-apply",
+    meta: {
+      title: "申请发票", // 页面标题title
+    },
+    component: () => import("@/views/vip/vip-invoice-apply.vue"),
+  },
 ];

src/views/image-text/children/my-collect.vue

@@ -66,7 +66,7 @@
       v-model="visible"
       :info="info"
       :option="comment_option"
-      :reportType="2"
+      :reportType="8"
     />
   </div>
 </template>
@@ -211,7 +211,7 @@ export default {
     handleForward(item) {
       ArticleService.articleTransmit({
         item_id: item.id,
-      });
+      }).then((_) => (this.info.transmit_num += 1));
     },
     // 评论
     handleComment(item) {

src/views/image-text/children/my-like.vue

@@ -103,7 +103,7 @@
       v-model="commentVisible"
       :info="info"
       :option="comment_option"
-      :reportType="2"
+      :reportType="8"
     />
     <Reply v-model="replyVisible" :info="info" @handleReply="handleReply" />
   </div>
@@ -281,7 +281,7 @@ export default {
     handleForward(item) {
       ArticleService.articleTransmit({
         item_id: item.id,
-      });
+      }).then((_) => (this.info.transmit_num += 1));
     },
     // 评论
     handleComment(item) {

src/views/image-text/image-text-detail.vue

@@ -165,7 +165,7 @@ export default {
         },
       });
     },
-    // 跳转资料
+    // 跳转图文
     toImageTextDetail() {
       this.$router.push({
         path: "/image-text-detail",
@@ -213,9 +213,9 @@ export default {
     },
     // 分享---统计分享量
     handleForward() {
-      ArticleService.articleTransmit({ item_id: this.info.id }).then((_) => {
-        this.info.transmit_num += 1;
-      });
+      ArticleService.articleTransmit({ item_id: this.info.id }).then(
+        (_) => (this.info.transmit_num += 1)
+      );
     },
     // 举报
     handleReport() {

src/views/image-text/index.vue

@@ -67,7 +67,8 @@ export default {
     };
   },
   mounted() {
-    this.$store.dispatch("getMarkNum", "imageText");
+    if (this.$store.state.userInfo)
+      this.$store.dispatch("getMarkNum", "imageText");
   },
   methods: {},
 };

src/views/index.vue

@@ -15,6 +15,10 @@
     <div class="content">
       <div class="search">
         <div class="search-content">
+          <div class="hot">
+            <img src="@/assets/icon/热搜榜.png" />
+            <span>热搜榜</span>
+          </div>
           <div class="search-btn">搜索</div>
         </div>
       </div>
@@ -209,7 +213,7 @@ $width: $body-width-100;
     height: calc(#{$width} * 0.3);
     .banner-container {
       height: 100%;
-       .el-carousel__container {
+      .el-carousel__container {
         height: 100%;
       }
     }
@@ -248,6 +252,7 @@ $width: $body-width-100;
         display: flex;
         justify-content: flex-end;
         align-items: center;
+        position: relative;
 
         .search-btn {
           background: linear-gradient(to right, #38bbe8, #32e2e2);
@@ -260,6 +265,20 @@ $width: $body-width-100;
           border-radius: 60px;
           margin: 4px;
         }
+        .hot {
+          position: absolute;
+          right: 150px;
+          font-size: 14px;
+          font-weight: 400;
+          color: #ff7b15;
+          display: flex;
+          align-items: center;
+          user-select: none;
+          img {
+            width: 18px;
+            height: 18px;
+          }
+        }
       }
     }
 
@@ -442,8 +461,8 @@ $width: $body-width-100;
                 transform: translate(0, 2px);
               }
               img {
-                height: 16px;
-                width: 16px;
+                height: 12px;
+                width: 12px;
                 transform: translate(0, 1px);
               }
             }

src/views/information/children/my-collect.vue

@@ -66,7 +66,7 @@
       v-model="visible"
       :info="info"
       :option="comment_option"
-      :reportType="2"
+      :reportType="10"
     />
   </div>
 </template>
@@ -211,7 +211,7 @@ export default {
       DatumService.articleTransmit({
         video_id: item.video_id,
         url_id: item.url_id,
-      });
+      }).then((_) => (this.info.transmit_num += 1));
     },
     // 评论
     handleComment(item) {

src/views/information/children/my-like.vue

@@ -103,7 +103,7 @@
       v-model="commentVisible"
       :info="info"
       :option="comment_option"
-      :reportType="2"
+      :reportType="10"
     />
     <Reply v-model="replyVisible" :info="info" @handleReply="handleReply" />
   </div>
@@ -281,7 +281,7 @@ export default {
       DatumService.articleTransmit({
         video_id: item.video_id,
         url_id: item.url_id,
-      });
+      }).then((_) => (this.info.transmit_num += 1));
     },
     // 评论
     handleComment(item) {

src/views/information/components/content.vue

@@ -4,6 +4,7 @@
       <ContentTab
         :current="current"
         :showRefresh="!current"
+        :text="['为你推荐', '专栏']"
         @changeTab="changeTab"
         @handleRefresh="handleRefresh"
       />
@@ -35,16 +36,17 @@
       :style="{ opacity: current == 1 ? 1 : 0 }"
       v-if="current == 1"
     >
-      <div class="screen">
+      <!-- <div class="screen">
         <Screen
           :list="cateTree"
+          :show_second="false"
           v-if="cateTree.length"
           @changeCurrent="changeCurrent"
         />
       </div>
       <div class="sort">
         <Sort :current="listParams.sort_type" @changeSort="changeSort" />
-      </div>
+      </div> -->
       <div class="card-box">
         <div
           class="card-item"

src/views/information/index.vue

@@ -62,7 +62,10 @@ export default {
       ],
     };
   },
-  mounted() {this.$store.dispatch("getMarkNum", "information");},
+  mounted() {
+    if (this.$store.state.userInfo)
+      this.$store.dispatch("getMarkNum", "information");
+  },
   methods: {},
 };
 </script>

src/views/information/information-collection.vue

@@ -12,40 +12,121 @@
       />
     </div>
     <div class="sort">
-      <Sort :current="sort_type" @changeSort="changeSort" />
+      <Sort v-if="!manageType" :current="sort_type" @changeSort="changeSort" />
+      <div class="all_select" v-if="manageType">
+        <el-checkbox
+          v-model="allChecked"
+          @change="(type) => changeChecked(type, 'all')"
+        ></el-checkbox>
+        <span>全选</span>
+      </div>
+      <div
+        class="control"
+        v-if="!manageType && download_list.length"
+        @click="manageType = true"
+      >
+        管理
+      </div>
+      <div class="cancel" v-if="manageType" @click="manageType = false">
+        取消
+      </div>
     </div>
-    <div class="list">
+    <div class="list" v-if="!manageType">
       <div
         class="list-item"
-        v-for="item in info.url_arr"
-        @click="toDetail(item.datum_id, item.id)"
+        v-for="item in !manageType ? info.url_arr : download_list"
       >
-        <InformationCollectionCard :info="item" />
+        <div class="card" @click="toDetail(item.datum_id, item.id)">
+          <InformationCollectionCard :info="item" />
+        </div>
       </div>
     </div>
+    <div class="list" v-else>
+      <div class="list-item" v-for="item in download_list">
+        <div class="radio">
+          <el-checkbox
+            v-model="item.checked"
+            @change="(type) => changeChecked(type, item)"
+          ></el-checkbox>
+        </div>
+        <div class="card" :style="{ width: 'calc(100% - 60px)' }">
+          <InformationCollectionCard :info="item" />
+        </div>
+      </div>
+    </div>
+    <div
+      class="related"
+      v-if="
+        (manageType && download_list.length) || info.video_id || info.goods_id
+      "
+    >
+      <div
+        class="item"
+        v-if="info.goods_id"
+        @click="$message.success('敬请期待')"
+      >
+        <img src="@/assets/icon/产品_蓝色.png" alt="" />
+        <span>相关产品</span>
+      </div>
+      <div class="item" v-if="info.video_id" @click="toVideoDetail">
+        <img src="@/assets/icon/视频.png" alt="" />
+        <span>相关视频</span>
+      </div>
+      <div
+        class="item download"
+        v-if="manageType && download_list.length"
+        @click="handleClick"
+      >
+        <img src="@/assets/icon/视频.png" alt="" />
+        <span>下载</span>
+      </div>
+    </div>
+    <IsVip ref="isLoginVip" v-model="vipVisible" />
   </div>
 </template>
 
 <script>
 import { DatumService, GeneralService } from "@/common/service";
+import { downloadLocalFile } from "@/common/request";
 import Collection from "@/components/module/collection.vue";
 import Sort from "@/components/module/sort.vue";
+import IsVip from "@/components/module/is-vip.vue";
 import InformationCollectionCard from "@/components/information/information-collection-card.vue";
 
 export default {
-  components: { Collection, Sort, InformationCollectionCard },
+  components: { Collection, Sort, InformationCollectionCard, IsVip },
   data() {
     return {
       info: {},
       sort_type: 1,
+      manageType: false,
+      allChecked: false,
+      download_list: [],
+      vipVisible: false,
     };
   },
+  watch: {
+    manageType(val) {
+      !val ? (this.allChecked = false) : "";
+      this.download_list.forEach((item) => (item.checked = false));
+    },
+  },
   mounted() {
     const option = this.$route.query;
     this.info.id = option.id;
     this.getDetail();
   },
   methods: {
+    // 选择全部
+    changeChecked(type, item) {
+      if (item == "all") {
+        this.download_list.forEach((item) => (item.checked = type));
+      } else {
+        this.allChecked =
+          this.download_list.filter((item) => item.checked).length ==
+          this.download_list.length;
+      }
+    },
     // 更改排序方式
     changeSort(type) {
       this.sort_type = type;
@@ -58,11 +139,16 @@ export default {
         sort_type: this.sort_type,
       }).then(({ data }) => {
         this.info = data.detail;
+        this.download_list = data.detail.url_arr;
+        this.download_list = data.detail.url_arr.filter((item) => {
+          this.$set(item, "checked", false);
+          return item.is_down ? item : false;
+        });
       });
     },
     // 订阅
     handleSwitch() {
-      GeneralService.switchSet({ id: this.info.id, type: 3 }).then(
+      GeneralService.switchSet({ id: this.info.id, type: 4 }).then(
         ({ data, msg }) => {
           this.info.follow_switch = data.status;
           this.$message.success(msg);
@@ -79,22 +165,62 @@ export default {
         },
       });
     },
+    // 跳转视频
+    toVideoDetail() {
+      this.$router.push({
+        path: "/video-detail",
+        query: {
+          id: this.info.video_id,
+          videoArrId: this.info.video_item,
+        },
+      });
+    },
+    // 下载
+    handleClick() {
+      if (this.download_list.filter((item) => item.checked).length == 0)
+        return this.$message.error("请选中至少一项");
+      this.download_list.forEach((item) => {
+        let can_download = true;
+        if (
+          item.is_vip &&
+          !item.is_recently &&
+          !this.$store.state.userInfo.level_id
+        ) {
+          can_download = false;
+          this.vipVisible = true;
+          return;
+        }
+        if (item.checked && can_download) {
+          DatumService.datumDownload({
+            datum_id: this.info.id,
+            url_id: item.id,
+          }).then(() => {
+            downloadLocalFile(item.url, item.title);
+          });
+        }
+      });
+    },
   },
 };
 </script>
 
 <style lang="scss" scoped>
 .wrap {
-  width: calc(100% - 240px);
-  max-width: 1200px;
+  width: 1200px;
   margin: 0 auto;
   .back {
+    width: 100px;
+    height: 50px;
+    line-height: 50px;
     margin-top: 20px;
     font-size: 22px;
     font-weight: 400;
     color: #222222;
     display: flex;
     align-items: center;
+    justify-content: center;
+    background-color: white;
+    border-radius: 4px;
     cursor: pointer;
     img {
       width: 12px;
@@ -107,8 +233,45 @@ export default {
     border-radius: 10px;
     margin-top: 20px;
   }
-  .sort {
-    margin-top: 20px;
+  > .sort {
+    margin-top: 30px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    .all_select {
+      width: 110px;
+      height: 40px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      font-size: 16px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      font-weight: 400;
+      color: #555555;
+      background: #ffffff;
+      border-radius: 19px;
+      span {
+        margin-left: 10px;
+      }
+    }
+    .control {
+      width: 80px;
+      height: 35px;
+      background: #2a63f3;
+      border-radius: 10px;
+      text-align: center;
+      line-height: 35px;
+      font-size: 14px;
+      font-weight: 500;
+      color: #ffffff;
+      cursor: pointer;
+    }
+    .cancel {
+      font-size: 14px;
+      font-weight: 500;
+      color: #2a63f3;
+      cursor: pointer;
+    }
   }
   .list {
     margin-top: 20px;
@@ -116,10 +279,73 @@ export default {
     align-items: center;
     justify-content: space-between;
     flex-wrap: wrap;
+    padding-bottom: 200px;
     .list-item {
       margin-bottom: 15px;
       width: calc((100% - 20px) / 2);
       margin: 10px 0;
+      display: flex;
+      align-items: center;
+      justify-content: flex-end;
+      position: relative;
+      .radio {
+        width: 45px;
+        background-color: white;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        position: absolute;
+        top: 0;
+        bottom: 0;
+        left: 0;
+        border-radius: 10px;
+      }
+      .card {
+        width: 100%;
+      }
+    }
+  }
+
+  .related {
+    height: 100px;
+    width: calc(100% - 8px);
+    padding-right: calc((100% - 8px - 250px - 1200px) / 2);
+    box-sizing: border-box;
+    background-color: white;
+
+    position: fixed;
+    left: 0;
+    bottom: 0;
+    z-index: 100;
+
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    .item {
+      width: 120px;
+      height: 50px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      font-size: 14px;
+      font-weight: 400;
+      color: #2a63f3;
+      border-radius: 8px;
+      border: 1px solid #2a63f3;
+      cursor: pointer;
+      margin-left: 10px;
+      img {
+        width: 20px;
+        height: 20px;
+        margin-right: 5px;
+      }
+    }
+    .download {
+      width: 100px;
+      height: 50px;
+      background: #2a63f3;
+      border-radius: 8px;
+      color: white;
     }
   }
 }

src/views/information/information-detail.vue

@@ -3,6 +3,7 @@
     <div class="title">
       <DetailTitle
         :info="info"
+        :show_desc="false"
         :series_info="datum_info"
         @handleSwitch="handleSwitch"
         @toVideoDetail="toVideoDetail"
@@ -45,7 +46,7 @@
       :option="comment_option"
       :reportType="8"
     />
-    <Report :type="5" :info="info" v-model="reportVisible" />
+    <Report :type="4" :info="info" v-model="reportVisible" />
     <FileViewer :info="info" v-model="viewerVisible" />
   </div>
 </template>
@@ -181,7 +182,7 @@ export default {
         },
       });
     },
-    // 跳转资料
+    // 跳转图文
     toImageTextDetail() {
       this.$router.push({
         path: "/image-text-detail",
@@ -233,9 +234,7 @@ export default {
       DatumService.datumTransmit({
         datum_id: this.datum_info.id,
         url_id: this.info.id,
-      }).then((_) => {
-        this.info.transmit_num += 1;
-      });
+      }).then((_) => (this.info.transmit_num += 1));
     },
     // 举报
     handleReport() {

src/views/video/children/my-collect.vue

@@ -216,7 +216,7 @@ export default {
       VideoService.videoTransmit({
         video_id: item.video_id,
         url_id: item.url_id,
-      });
+      }).then((_) => (this.info.transmit_num += 1));
     },
     // 评论
     handleComment(item) {

src/views/video/children/my-like.vue

@@ -286,7 +286,7 @@ export default {
       VideoService.videoTransmit({
         video_id: item.video_id,
         url_id: item.url_id,
-      });
+      }).then((_) => (this.info.transmit_num += 1));
     },
     // 评论
     handleComment(item) {

src/views/video/components/content.vue

@@ -16,7 +16,7 @@
       <div
         class="list-item"
         v-for="item in recommendList"
-        @click="jumpDetail(item.video_id, item.id)"
+        @click="toDetail(item.video_id, item.id)"
       >
         <VideoRecommendCard :info="item" style="width: 500px; height: 380px" />
       </div>
@@ -48,7 +48,7 @@
       <div
         class="card-item"
         v-for="item in allList"
-        @click="jumpDetail(item.id, item.video_arr[0].id)"
+        @click="toDetail(item.id, item.video_arr[0].id)"
       >
         <VideoAllCard :info="item" />
       </div>
@@ -197,7 +197,7 @@ export default {
       });
     },
     // 跳转详情
-    jumpDetail(id, videoArrId) {
+    toDetail(id, videoArrId) {
       this.$router.push({
         path: "/video-detail",
         query: {

src/views/video/index.vue

@@ -67,7 +67,7 @@ export default {
     };
   },
   mounted() {
-    this.$store.dispatch("getMarkNum", "video");
+    if (this.$store.state.userInfo) this.$store.dispatch("getMarkNum", "video");
   },
   methods: {},
 };

src/views/vip/vip-invoice-apply.vue

@@ -0,0 +1,182 @@
+<template>
+  <div class="wrap">
+    <div class="wrap-content">
+      <div class="back" @click="$router.back()">
+        <img src="@/assets/icon/back.png" /><span>返回</span>
+      </div>
+      <div class="order">
+        <div class="order-header">
+          <div class="order-no">{{ info.order_no }}</div>
+          <div class="time">{{ info.create_at }}</div>
+        </div>
+        <div class="order-type">
+          {{ info.level_name }}{{ info.level_set ? info.level_set.title : "" }}
+        </div>
+        <div class="price">实付款：¥{{ info.price_total }}</div>
+        <div class="price">开票金额：¥{{ info.price_total }}</div>
+      </div>
+      <div class="invoice-box">
+        <Invoice :params="params" />
+      </div>
+      <div class="confirm-btn" @click="submit">提交申请</div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapState } from "vuex";
+import { LevelOrderService } from "@/common/service";
+import Invoice from "@/components/module/invoice.vue";
+
+export default {
+  components: { Invoice },
+  data() {
+    return {
+      info: {},
+      invoice_switch: true,
+      invoice_list: [],
+      params: {
+        order_id: "", // 订单id
+        type: "", // 发票类型
+        header: "", // 发票抬头
+        identify_number: "", // 纳税人识别号
+        email: "", // 邮箱
+        remark: "", // 备注
+      },
+    };
+  },
+  computed: {
+    ...mapState(["userInfo", "userLevel"]),
+    isVip() {
+      return !!this.userInfo.level_id;
+    },
+  },
+  created() {
+    const query = this.$route.query;
+    this.info.id = this.params.order_id = query.order_id;
+    this.getOrderDetail();
+  },
+  methods: {
+    // 获取订单详情
+    getOrderDetail() {
+      LevelOrderService.getOrderDetail({ order_id: this.info.id }).then(
+        ({ data }) => {
+          this.info = data.detail;
+        }
+      );
+    },
+
+    // 校验
+    checkForm() {
+      if (!this.params.header) {
+        this.$message.error("请填写发票抬头");
+        return false;
+      }
+      if (!this.params.identify_number) {
+        this.$message.error("请填写纳税人识别号");
+        return false;
+      }
+      if (!this.params.email) {
+        this.$message.error("请填写邮箱");
+        return false;
+      }
+    },
+    // 提交
+    submit() {
+      if (!this.checkForm()) return;
+      
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.wrap {
+  width: calc((100% - 240px));
+  .wrap-content {
+    width: 80%;
+    margin: 0 auto;
+    min-width: 900px;
+    padding-bottom: 300px;
+
+    .back {
+      width: 90px;
+      height: 40px;
+      line-height: 50px;
+      margin-top: 20px;
+      font-size: 16px;
+      font-weight: 400;
+      color: #222222;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      background-color: white;
+      border-radius: 4px;
+      border-radius: 10px;
+      cursor: pointer;
+      img {
+        width: 10px;
+        height: 16px;
+        margin-right: 5px;
+      }
+    }
+    .order {
+      width: 100%;
+      height: 160px;
+      padding: 20px;
+      display: flex;
+      flex-direction: column;
+      box-sizing: border-box;
+      user-select: none;
+      background-color: white;
+      margin-top: 20px;
+      .order-header {
+        width: 100%;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        .order-no {
+          font-size: 13px;
+          font-weight: 400;
+          color: #444444;
+        }
+        .time {
+          font-size: 13px;
+          color: #969696;
+        }
+      }
+      .order-type {
+        font-size: 18px;
+        font-weight: 500;
+        color: #444444;
+        margin-top: 20px;
+      }
+      .price {
+        margin-top: 10px;
+        font-size: 14px;
+        font-weight: 500;
+        color: #333333;
+      }
+    }
+    .invoice-box {
+      padding: 25px 20px 20px;
+      margin-top: 20px;
+      background-color: white;
+    }
+    .confirm-btn {
+      width: 200px;
+      height: 70px;
+      margin-top: 20px;
+      background: #2a63f3;
+      border-radius: 6px;
+      font-size: 24px;
+      font-weight: 400;
+      color: #ffffff;
+      text-align: center;
+      line-height: 70px;
+      float: right;
+      cursor: pointer;
+    }
+  }
+}
+</style>

src/views/vip/vip-member.vue

@@ -130,10 +130,28 @@ export default {
           div.children.alipaysubmit.submit();
         } else {
           this.wx_code_url = data.code_url;
+          this.watchOrderState(data.order_id);
           this.$refs.PaymentWindowWX.show();
         }
       });
     },
+    // 监听订单状态
+    watchOrderState(order_id) {
+      this.getOrderDetail(order_id).then(({ data }) => {
+        if (!data.detail.pay_state) {
+          setTimeout((_) => this.watchOrderState(order_id), 3000);
+        } else {
+          this.$message.success("支付成功！");
+          setTimeout((_) => {
+            this.$refs.PaymentWindowWX.hide();
+          }, 1000);
+        }
+      });
+    },
+    // 获取订单状态
+    async getOrderDetail(order_id) {
+      return await LevelOrderService.getOrderDetail({ order_id });
+    },
   },
 };
 </script>