Merge branch 'HitSheep' of http://39.105.160.25:10880/post-project-ui/post-ui into HitSheep

src/api/collection/collection.js

@@ -1,9 +1,10 @@
 import request from '@/utils/request'
 
 // 添加套系
-export function addCollection() {
+export function addCollection(data) {
   return request({
-    url: '/post/series' ,
-    method: 'post'
+    url: '/post/series/add' ,
+    method: 'post',
+    data
   })
 }

src/views/collection/addCollection.vue

@@ -3,10 +3,11 @@
     
     <!-- <el-page-header @back="goBack" content="创建消息"></el-page-header> -->
     <div class="message-add-box">
-      <el-form :model="message" :rules="rules" ref="form" label-width="100px">
+      <el-form :model="form" :rules="rules" ref="form" label-width="125px">
       
-        <el-form-item label="藏品名称:" prop="collectionName">
-          <el-input v-model="message.collectionName" style="width: 550px" placeholder="请输入藏品名称"></el-input>
+        <el-form-item label="藏品名称（套）:" prop="collectionName" style="width: 550px">
+          <el-input v-model="form.collectionName" maxlength="20"
+          show-word-limit placeholder="请输入藏品名称"></el-input>
         </el-form-item> 
         <el-form-item label="藏品头图:" prop="imageUrl">
           <el-upload
@@ -16,81 +17,32 @@
           :on-success="handleAvatarSuccess"
           :before-upload="beforeAvatarUpload"
         >
-          <img v-if="imageUrl" :src="imageUrl" class="avatar" />
+          <img v-if="form.imageUrl" :src="form.imageUrl" class="avatar" />
           <i
             v-else
             class="el-icon-plus avatar-uploader-icon"
           ></i> </el-upload>
         </el-form-item> 
-
-        <el-form-item label="3D模板:" prop="">
-          <el-upload
-          class="avatar-uploader"
-          action="https://jsonplaceholder.typicode.com/posts/"
-          :show-file-list="false"
-          :on-success="handleAvatarSuccess"
-          :before-upload="beforeAvatarUpload"
-        >
-          <img v-if="imageUrl" :src="imageUrl" class="avatar" />
-          <i
-            v-else
-            class="el-icon-plus avatar-uploader-icon"
-          ></i> </el-upload>
+        <el-form-item label="设置套系时间 ：" prop="collectionTime" style="width: 550px">
+          <el-date-picker
+              v-model="form.collectionTime"
+              type="datetimerange"
+              align="right"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              value-format="yyyy-MM-dd hh:mm::ss"
+              :default-time="['12:00:00', '08:00:00']">
+            </el-date-picker>
         </el-form-item> 
-        <el-form-item label="藏品价格:" prop="collectionPrice">
-          <el-input v-model="message.collectionPrice" style="width: 550px" placeholder="请输入藏品价格"></el-input>
-        </el-form-item> 
-        <el-form-item label="藏品数量:" prop="collectionCount">
-          <el-input v-model="message.collectionCount" style="width: 550px" placeholder="请输入藏品数量"></el-input>
-        </el-form-item> 
-        <el-form-item label="发行方:" prop="collectionPublisher">
-          <el-input v-model="message.collectionPublisher" style="width: 550px" placeholder="请输入发行方"></el-input>
-        </el-form-item> 
-        
-        <el-dialog :visible.sync="dialogVisible">
-          <img width="100%" :src="dialogImageUrl" alt="">
-        </el-dialog>
-        <el-form-item label="藏品故事:" prop="collectionHistory">
-            <el-upload
-          action="#"
-          list-type="picture-card"
-          :auto-upload="false">
-            <i slot="default" class="el-icon-plus"></i>
-            <div slot="file" slot-scope="{file}">
-              <img
-                class="el-upload-list__item-thumbnail"
-                :src="file.url" alt=""
-              >
-              <span class="el-upload-list__item-actions">
-                <span
-                  class="el-upload-list__item-preview"
-                  @click="handlePictureCardPreview(file)"
-                >
-                  <i class="el-icon-zoom-in"></i>
-                </span>
-                <span
-                  v-if="!disabled"
-                  class="el-upload-list__item-delete"
-                  @click="handleDownload(file)"
-                >
-                  <i class="el-icon-download"></i>
-                </span>
-                <span
-                  v-if="!disabled"
-                  class="el-upload-list__item-delete"
-                  @click="handleRemove(file)"
-                >
-                  <i class="el-icon-delete"></i>
-                </span>
-              </span>
-            </div>
-        </el-upload>
-          <label for="">点击查看</label>
+        <el-form-item label="线下礼品兑换 ：" prop="radio" style="width: 550px">
+            <el-radio v-model="form.radio" label="1">可兑换</el-radio>
+            <el-radio v-model="form.radio" label="2">不可兑换</el-radio>
         </el-form-item> 
+          
         <el-form-item>
           <el-button type="primary" @click="addCollection('form')">提交</el-button>
-          <el-button @click="resetForm('form')">重置</el-button>
-          <el-button @click="importForm('form')">导入</el-button>
+          <!-- <el-button @click="resetForm('form')">重置</el-button>
+          <el-button @click="importForm('form')">导入</el-button> -->
         </el-form-item>
       </el-form>
     </div>     
@@ -104,33 +56,26 @@ import {addCollection} from '../../api/collection/collection.js'
   
     data() {
       return {
-        message: {
+        
+        form:{
           collectionName:'',
           imageUrl: '',
-          collectionPrice:'' , 
-          collectionCount:'' ,
-          collectionPublisher:'' , 
-          collectionHistory:'',
+          collectionTime:'' , 
+          radio: '1',
         },
         rules:{
           collectionName: [
             { required: true, message: '请输入藏品名称', trigger: 'blur' }
           ],
           imageUrl: [
-            { required: true, message: '请导入藏品图片', trigger: 'blur' }
-          ],
-          collectionPrice: [
-            { required: true, message: '请输入藏品价格', trigger: 'blur' }
-          ],
-          collectionCount: [
-            { required: true, message: '请输入藏品数量', trigger: 'blur' }
-          ],
-          collectionPublisher: [
-            { required: true, message: '请输入发布人', trigger: 'blur' }
+            { required: true, message: '请按照规范上传尺寸为750px*750px的图片', trigger: 'blur' }
           ],
-          collectionHistory: [
-            { required: true, message: '请输入藏品故事', trigger: 'blur' }
+          collectionTime: [
+            { required: true, message: '请输入套系时间', trigger: 'blur' }
           ],
+          radio:[
+            {required : true , trigger: 'blur' }
+          ]
         }
     }
   },
@@ -139,43 +84,76 @@ import {addCollection} from '../../api/collection/collection.js'
   },
   methods: {
         handleAvatarSuccess(res, file) {
-          this.imageUrl = URL.createObjectURL(file.raw);
+          this.form.imageUrl = URL.createObjectURL(file.raw);
+        },
+          beforeAvatarUpload(file) {
+          const isJPG = file.type === 'image/jpeg';
+          const isLt2M = file.size / 1024 / 1024 < 2;
+          if (!isJPG) {
+            this.$message.error('上传头像图片只能是 JPG 格式!');
+          }
+          if (!isLt2M) {
+            this.$message.error('上传头像图片大小不能超过 2MB!');
+          }
+          return isJPG && isLt2M;
         },
-        beforeAvatarUpload(file) {
-        const isJPG = file.type === 'image/jpeg';
-        const isLt2M = file.size / 1024 / 1024 < 2;
-
-        if (!isJPG) {
-          this.$message.error('上传头像图片只能是 JPG 格式!');
-        }
-        if (!isLt2M) {
-          this.$message.error('上传头像图片大小不能超过 2MB!');
-        }
-        return isJPG && isLt2M;
-      },
       addCollection() { 
-        console.log( "-****" , this.message.collectionName);
-        console.log( "-****" , this.message.imageUrl);
-        console.log( "-****" , this.message.collectionPrice);
-        console.log( "-****" , this.message.collectionCount);
-        console.log( "-****" , this.message.collectionPublisher);
-        console.log( "-****" , this.message.collectionHistory);
-        addCollection(this.collectionName) .then((res)=>{
+        console.log( "-****" , this.form.collectionName);
+        console.log( "-****" , this.form.imageUrl);
+        console.log( "-****" , this.form.collectionTime);
+        console.log( "-****" , this.form.radio);
+        addCollection({
+          seriesName :this.form.collectionName ,
+          seriesImage:this.form.imageUrl,
+          startTime :this.form.collectionTime[0] , 
+          endTime: this.form.collectionTime[1], 
+          collectionCounts:"0",
+          exchangeStatus:  this.form.radio
+        }) .then((res)=>{
           console.log(res);
+          this.$message({
+              message:"套系添加成功！",
+              type:"success",
+          });
         })
       },
       resetForm(formName) {
         this.$refs[formName].resetFields();
       },
-      // importForm(formName) {
-        
-      // }
     }
 }
 </script>
 
 <style>
+.down{
+  margin-left: 15px;
+}
+.demonstration{
+    text-align: right;
+    vertical-align: middle;
+    font-size: 14px;
+    color: #606266;
+    line-height: 40px;
+    padding: 0 12px 0 0;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    text-align: right;
+    vertical-align: middle;
+    font-size: 14px;
+    color: #606266;
+    line-height: 40px;
+    padding: 0 12px 0 0;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    font-weight: 700;
+}
+.el-icon-plus{
+  margin-top: 85px;
+}
+
 .avatar-uploader .el-upload {
+    width: 370px; 
+    height: 370px;
     border: 1px dashed #d9d9d9;
     border-radius: 6px;
     cursor: pointer;
@@ -232,4 +210,8 @@ import {addCollection} from '../../api/collection/collection.js'
     border-top: 0px;
     width: 450px;
 }
+.avatar{
+  width: 370px;
+  height: 370px;
+}
 </style>