quan_H5上传_优化

assets/css/user/article.css

@@ -3,8 +3,8 @@
       font-size: 0.22rem;
   }
   .article-right,.article-right>img{
-    width:2.16rem;
-    height:1.6rem;
+    width:29vw !important;
+    height:21vw !important;
   }
   .article.no-img .source{
     padding-right:2.16rem;

pages/user/collect_article/_id/_type.vue

@@ -53,7 +53,7 @@
                   </div>
                   <div class="live-time gray-153 align-center">
                     <img class="icon" src="@/assets/quan/icon/zan.png"></img>
-                    <div>{{art.updated_at}}</div>
+                    <div>{{art.like_count}}</div>
                   </div>
                   <div class="live-people gray-153 align-center">
                     <img class="icon" src="@/assets/quan/icon/common.png"></img>

pages/user/new_video_upload.vue

@@ -2,49 +2,21 @@
   <div class="box">
     <form @submit.prevent="onSubmit">
       <div class="top flex align-center">
-        <van-field
-          v-model="message"
-          name="title"
-          rows="5"
-          autosize
-          type="textarea"
-          maxlength="150"
-          placeholder="添加标题并使用合适的合集，能让更多人看到~"
-          show-word-limit
-        />
+        <van-field v-model="message" name="title" rows="5" autosize type="textarea" maxlength="150" placeholder="添加标题并使用合适的合集，能让更多人看到~"
+          show-word-limit />
         <div>
-          <van-uploader
-            v-model="fileList"
-            result-type="file"
-            multiple
-            accept="image/*"
-            :max-count="1"
-            :after-read="afterRead"
-          />
+          <van-uploader v-model="fileList" result-type="file" multiple accept="image/*" :max-count="1" :after-read="afterRead" />
           <p>选择封面</p>
         </div>
       </div>
 
       <div class="tip">
         <div>添加到合集</div>
-        <van-field
-          readonly
-          clickable
-          name="provier_id"
-          :value="value.title"
-          right-icon="arrow-down"
-          placeholder="请选择"
-          @click="showPicker = true"
-        />
+        <van-field readonly clickable name="provier_id" :value="value.title" right-icon="arrow-down" placeholder="请选择"
+          @click="showPicker = true" />
         <van-popup v-model="showPicker" position="bottom">
-          <van-picker
-            show-toolbar
-            :columns="columns"
-            value-key="title"
-            @cancel="showPicker = false"
-            @confirm="onConfirm"
-            @change="onChange"
-          />
+          <van-picker show-toolbar :columns="columns" value-key="title" @cancel="showPicker = false" @confirm="onConfirm"
+            @change="onChange" />
         </van-popup>
         <van-button class="btn" native-type="button" type="info" block @click="createVideo()">发布</van-button>
       </div>
@@ -53,169 +25,180 @@
 </template>
 
 <script>
-import "@/assets/css/common.css";
-import Vue from "vue";
-import { Uploader, Icon, Form, Toast, Field } from "vant";
+  import "@/assets/css/common.css";
+  import Vue from "vue";
+  import {
+    Uploader,
+    Icon,
+    Form,
+    Toast,
+    Field
+  } from "vant";
 
-export default {
-  layout: "opacity_header",
-  async asyncData({ $axios, params, req }) {
-    let id = params.id;
-    let headers = req && req.headers;
-    title: "发布视频";
-  },
-  head() {
-    return {
-      title: this.title,
-      script: [
-        {
+  export default {
+    layout: "opacity_header",
+    async asyncData({
+      $axios,
+      params,
+      req
+    }) {
+      let id = params.id;
+      let headers = req && req.headers;
+      title: "发布视频";
+    },
+    head() {
+      return {
+        title: this.title,
+        script: [{
           src: "https://hm.baidu.com/hm.js?18455f493c982100e5a82ec978a8d06e"
-        }
-      ]
-    };
-  },
-  data() {
-    return {
-      value: "",
-      showPicker: false,
-      message: "",
-      src: "",
-      fileList: [],
-      columns: [],
-      collectID: null,
-      vid: this.$route.query.vid,
-      file: null
-    };
-  },
-  created() {
-    this.needLogin();
-    this.getCollect();
-  },
-  methods: {
-    afterRead(file) {
-      console.log(file);
-      if (file.file.size > 1024 * 1024 * 5) {
-        Toast.fail("图片文件超过5M,情重新上传！");
-        this.fileList = [];
-        return false;
-      }
-      let that = this;
-      let par = new FormData();
-      par.append("file", file.file);
-      file.status = "uploading";
-      file.message = "上传中...";
-      this.$axios
-        .$post("/upload_image", par, {
-          headers: { "Content-Type": "multipart/form-data" }
-        })
-        .then(res => {
-          that.fileList = [{ url: res.filename }];
-          file.status = "done";
-          file.message = "上传成功";
-        });
+        }]
+      };
     },
-    onChange(picker, value, index) {
-      this.collectID = index;
+    data() {
+      return {
+        value: "",
+        showPicker: false,
+        message: "",
+        src: "",
+        fileList: [],
+        columns: [],
+        collectID: null,
+        vid: this.$route.query.vid,
+        file: null
+      };
     },
-    createVideo() {
-      let that = this;
+    created() {
+      this.needLogin();
+      this.getCollect();
+    },
+    methods: {
+      afterRead(file) {
+        console.log(file);
+        if (file.file.size > 1024 * 1024 * 5) {
+          Toast.fail("图片文件超过5M,情重新上传！");
+          this.fileList = [];
+          return false;
+        }
+        let that = this;
+        let par = new FormData();
+        par.append("file", file.file);
+        file.status = "uploading";
+        file.message = "上传中...";
+        this.$axios
+          .$post("/upload_image", par, {
+            headers: {
+              "Content-Type": "multipart/form-data"
+            }
+          })
+          .then(res => {
+            that.fileList = [{
+              url: res.filename
+            }];
+            file.status = "done";
+            file.message = "上传成功";
+          });
+      },
+      onChange(picker, value, index) {
+        this.collectID = index;
+      },
+      createVideo() {
+        let that = this;
 
-      //检测描述的长度
-      let message = that.message.replace(/(^\s*)|(\s*$)/g, "");
-      if (message.length < 10) {
-        Toast.fail("视频描述应大于10个字");
-        return false;
-      }
-      if (message.length > 150) {
-        Toast.fail("视频描述不能超过150字");
-        return false;
-      }
+        //检测描述的长度
+        let message = that.message.replace(/(^\s*)|(\s*$)/g, "");
+        if (message.length < 10) {
+          Toast.fail("视频描述应大于10个字");
+          return false;
+        }
+        if (message.length > 150) {
+          Toast.fail("视频描述不能超过150字");
+          return false;
+        }
 
-      Toast.loading({
-        message: "正在发布...",
-        forbidClick: true,
-        loadingType: "spinner"
-      });
-      var pdata = {
+        Toast.loading({
+          message: "正在发布...",
+          forbidClick: true,
+          loadingType: "spinner"
+        });
+        var pdata = {
           video_id: that.vid,
           title: that.message,
-          provider_id: Number(that.value.id)
-          
+          provider_id: Number(that.value.id) ? Number(that.value.id) : ''
+
         }
-      if(that.fileList[0]){
-        pdata.cover_url = that.fileList[0].url
-      }
+        if (that.fileList[0]) {
+          pdata.cover_url = that.fileList[0].url ? that.fileList[0].url : ''
+        }
+
 
 
-      this.$axios
-        .$post("/api/jishuquan/create_video", pdata)
-        .then(res => {
-          Toast.setDefaultOptions({
-            onClose: function() {
-              window.location.href = "/";
+        this.$axios
+          .$post("/api/jishuquan/create_video", pdata)
+          .then(res => {
+            Toast.setDefaultOptions({
+              onClose: function() {
+                window.location.href = "/";
+              }
+            });
+            Toast.success("发布成功");
+            Toast.resetDefaultOptions();
+          });
+      },
+      getCollect() {
+        let that = this;
+        this.$axios
+          .$post(
+            "/api/jishuquan/get_collections", {
+              uid: this.userinfo.uid
+            }, {
+              neverLogout: true
             }
+          )
+          .then(res => {
+            that.columns = res.data;
           });
-          Toast.success("发布成功");
-          Toast.resetDefaultOptions();
-        });
-    },
-    getCollect() {
-      let that = this;
-      this.$axios
-        .$post(
-          "/api/jishuquan/get_collections",
-          {
-            uid: this.userinfo.uid
-          },
-          {
-            neverLogout: true
-          }
-        )
-        .then(res => {
-          that.columns = res.data;
-        });
-    },
-    onConfirm(value) {
-      this.value = value;
-      this.showPicker = false;
+      },
+      onConfirm(value) {
+        this.value = value;
+        this.showPicker = false;
+      }
     }
-  }
-};
+  };
 </script>
-<style >
-.btn {
-  margin: 0.86rem 0;
-}
+<style>
+  .btn {
+    margin: 0.86rem 0;
+  }
 
-.van-cell.van-cell--clickable {
-  margin-top: 0.1rem;
-  padding: 0.2rem 0.2rem;
-  border-radius: 0.06rem;
-  font-weight: 400px;
-  border: 1px solid rgba(215, 223, 232, 0.5);
-}
+  .van-cell.van-cell--clickable {
+    margin-top: 0.1rem;
+    padding: 0.2rem 0.2rem;
+    border-radius: 0.06rem;
+    font-weight: 400px;
+    border: 1px solid rgba(215, 223, 232, 0.5);
+  }
 
-.tip {
-  font-size: 0.28rem;
-  font-family: PingFangSC-Medium, PingFang SC;
-  font-weight: 600;
-  color: rgba(25, 34, 46, 1);
-  line-height: 0.4rem;
-  padding: 0.2rem 0.4rem;
-}
+  .tip {
+    font-size: 0.28rem;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 600;
+    color: rgba(25, 34, 46, 1);
+    line-height: 0.4rem;
+    padding: 0.2rem 0.4rem;
+  }
 
-.top {
-  width: 100%;
-}
+  .top {
+    width: 100%;
+  }
 
-.box {
-  width: 95%;
-  margin: 0.4rem auto;
-}
+  .box {
+    width: 95%;
+    margin: 0.4rem auto;
+  }
 
-body {
-  background-color: white;
-}
+  body {
+    background-color: white;
+  }
 </style>
 <style lang='less' scoped>
 </style>