增加报纸 编辑报纸

src/views/content_manage/newspaper_manage/ChannelList.vue

@@ -346,10 +346,10 @@ export default {
     },
     //计算table高度(动态设置table高度)
     getTableHeight() {
-      let tableH = 300; //距离页面下方的高度
+      let tableH = 320; //距离页面下方的高度
       let tableHeightDetil = window.innerHeight - tableH;
-      if (tableHeightDetil <= 300) {
-        this.tableHeight = 300;
+      if (tableHeightDetil <= 320) {
+        this.tableHeight = 320;
       } else {
         this.tableHeight = window.innerHeight - tableH;
       }

src/views/content_manage/newspaper_manage/CreateNewspaper.vue

@@ -49,8 +49,8 @@
                                 </el-option>
                             </el-select>
                         </el-form-item>
-                        <el-form-item label="是否合刊" prop="comb_flag">
-                            <el-radio-group v-model="newspaperForm.comb_flag" :disabled="id?true:false">
+                        <el-form-item label="是否合刊" required="" prop="comb_flag">
+                            <el-radio-group v-model="newspaperForm.comb_flag">
                                 <el-radio :label="0">否</el-radio>
                                 <el-radio :label="1">是</el-radio>
                             </el-radio-group>
@@ -60,7 +60,7 @@
                                 <template slot="append">期</template>
                             </el-input>
                         </el-form-item>
-                        <el-form-item label="期数" required prop="iss_no" class="iss-no-box" v-if="newspaperForm.comb_flag===1">
+                        <el-form-item label="期数" prop="iss_no_start" class="iss-no-box" v-if="newspaperForm.comb_flag===1">
                             <el-input v-model="newspaperForm.iss_no_start" type="number" class="iss-start">
                                 <template slot="append">-</template>
                             </el-input>
@@ -97,8 +97,84 @@
                                 </el-option>
                             </el-select>
                         </el-form-item>
+                        <el-form-item label="栏目模版" prop="chn_data">
+                            <el-select v-model="newspaperForm.chn_data" filterable placeholder="请选择" @change="handleChangeChn">
+                                <el-option
+                                    v-for="item in tplList"
+                                    :key="item.id"
+                                    :label="item.tpl_name"
+                                    :value="item.chn_data_string">
+                                </el-option>
+                            </el-select>
+                            <a @click="handleLinkChannel" class="tpl-maintain">栏目模版维护</a>
+                            <br/>
+                            <el-input
+                                type="textarea"
+                                :rows="4"
+                                readonly="readonly"
+                                style="margin-top: 20px"
+                                v-model="newspaperForm.chn_data_str">
+                            </el-input>
+                        </el-form-item>
+                        <el-form-item label="标签" prop="info_tag_data">
+                            <el-select v-model="newspaperForm.info_tag_data" multiple filterable allow-create default-first-option placeholder="请选择">
+                                <el-option
+                                    v-for="(item,i) in tabsList"
+                                    :key="item+i"
+                                    :label="item"
+                                    :value="item">
+                                </el-option>
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item label="简介" prop="iss_note">
+                            <el-input
+                                type="textarea"
+                                :rows="4"
+                                placeholder="请输入简介"
+                                v-model="newspaperForm.iss_note"
+                                maxlength="140"
+                                show-word-limit>
+                            </el-input>
+                        </el-form-item>
+                        <el-form-item label="讲解版" required="" prop="with_addon_flag">
+                            <el-radio-group v-model="newspaperForm.with_addon_flag">
+                                <el-radio :label="0">否</el-radio>
+                                <el-radio :label="1">是</el-radio>
+                            </el-radio-group>
+                        </el-form-item>
+                        <template v-if="newspaperForm.with_addon_flag===1">
+                            <el-divider></el-divider>
+                            <h6>讲解版售价</h6>
+                            <el-form-item label="原价" prop="with_addon_price_org" class="price-box" :key="'with_addon_price'">
+                                <el-input-number v-model="newspaperForm.with_addon_price_org" :min="0" size="small" :precision="2" class="personal-ceil"></el-input-number>
+                                <span class="prepend">￥</span>
+                                <span class="append">元</span>
+                                <p class="tips">&#160; </p>
+                            </el-form-item>
+                            <el-form-item label="优惠价格" prop="with_addon_price_sell" class="price-box" :key="'with_addon_price_1'">
+                                <el-input-number v-model="newspaperForm.with_addon_price_sell" :min="0" size="small" :precision="2" class="personal-ceil"></el-input-number>
+                                <span class="prepend">￥</span>
+                                <span class="append">元</span>
+                                <p class="tips">优惠价格必须低于原价</p>
+                            </el-form-item>
+                        </template>
+                        <el-divider></el-divider>
+                        <h6>普通版售价</h6>
+                        <template>
+                            <el-form-item label="原价" prop="iss_price_org" class="price-box" :key="'iss_price'">
+                                <el-input-number v-model="newspaperForm.iss_price_org" :min="0" size="small" :precision="2" class="personal-ceil"></el-input-number>
+                                <span class="prepend">￥</span>
+                                <span class="append">元</span>
+                                <p class="tips">&#160; </p>
+                            </el-form-item>
+                            <el-form-item label="优惠价格" prop="iss_price_sell" class="price-box" :key="'iss_price_1'">
+                                <el-input-number v-model="newspaperForm.iss_price_sell" :min="0" size="small" :precision="2" class="personal-ceil"></el-input-number>
+                                <span class="prepend">￥</span>
+                                <span class="append">元</span>
+                                <p class="tips">优惠价格必须低于原价</p>
+                            </el-form-item>
+                        </template>
                     </el-form>
-                    <!-- <a @click="handleLinkChannel">栏目模版维护</a>  -->
                 </template>
                 <div v-if="stepIndex===1">
                    
@@ -132,6 +208,63 @@ export default {
   components: { Header, NavMenu, Breadcrumb, Upload },
   props: {},
   data() {
+    const validateIssNo = (rule, value, callback) => {
+        if (value === '') {
+            callback(new Error('请输入期数'));
+        } else {
+            let start = this.newspaperForm.iss_no_start
+            let end = this.newspaperForm.iss_no_end
+            if (start!==null&&end!==null) {
+                if(start>=end){
+                    callback(new Error('开始期数需小于结束期数'));
+                }else{
+                    callback();
+                }
+            } else {
+                callback(new Error('请输入期数'));
+            }
+        }
+    };
+    const validatePrice = (rule, value, callback) => {
+        if (value === '') {
+            callback(new Error('请输入价格'));
+        } else {
+            let price = this.newspaperForm.iss_price_org
+            let currentPrice = this.newspaperForm.iss_price_sell
+            if (price!==undefined&&currentPrice!==undefined) {
+                if(price===0&&rule.fullField==='price'){
+                    callback(new Error('原价需大于0'));
+                }else if(currentPrice>=price){
+                    callback(new Error('优惠价格必须低于原价'));
+                }else{
+                    callback();
+                }
+            } else {
+                callback(new Error('请输入'));
+            }
+            
+        }
+    };
+    const validatePrices = (rule, value, callback) => {
+        if (value === '') {
+            callback(new Error('请输入价格'));
+        } else {
+            let price = this.newspaperForm.with_addon_price_org
+            let currentPrice = this.newspaperForm.with_addon_price_sell
+            if (price!==undefined&&currentPrice!==undefined) {
+                if(price===0&&rule.fullField==='price'){
+                    callback(new Error('原价需大于0'));
+                }else if(currentPrice>=price){
+                    callback(new Error('优惠价格必须低于原价'));
+                }else{
+                    callback();
+                }
+            } else {
+                callback(new Error('请输入'));
+            }
+            
+        }
+    };
     return {
         activeMenuIndex: "newspaper_manage",
         breadcrumbList:[
@@ -160,7 +293,7 @@ export default {
             cover_image_list: [],
             cover_image_id: null,
             iss_name: '',
-            vendor_name: '二十一世纪学生英文报',
+            vendor_name: '21世纪报社',
             comb_flag: 0,
             iss_no: null,
             iss_no_start: null,
@@ -168,7 +301,8 @@ export default {
             release_date: '',
             study_phase: null,
             vl_id: '',
-            chn_data: [],
+            chn_data: '',
+            chn_data_str:'',
             info_tag_data: [],
             iss_note: '',
             with_addon_flag: 1,
@@ -184,9 +318,42 @@ export default {
             vendor_name: [
                 { required: true, message: '请输入出版机构', trigger: 'blur' }
             ],
+            iss_no: [
+                { required: true, message: '请输入期数', trigger: 'blur' }
+            ],
+            iss_no_start: [
+                { required: true, validator: validateIssNo, trigger: 'blur' }
+            ],
+            iss_no_end: [
+                { required: true, validator: validateIssNo, trigger: 'blur' }
+            ],
+            study_phase: [
+                { required: true, message: '请选择学段', trigger: 'change' }
+            ],
+            vl_id: [
+                { required: true, message: '请选择课标词表', trigger: 'change' }
+            ],
+            chn_data: [
+                { required: true, message: '请选择栏目模板', trigger: 'change' }
+            ],
+            iss_price_org:[
+                { required: true, validator: validatePrice, trigger: 'blur' },
+            ],
+            iss_price_sell:[
+                { required: true, validator: validatePrice, trigger: 'blur' },
+            ],
+            with_addon_price_org:[
+                { required: true, validator: validatePrices, trigger: 'blur' },
+            ],
+            with_addon_price_sell:[
+                { required: true, validator: validatePrices, trigger: 'blur' },
+            ],
         },
         vendorList: [], // 出版机构列表
         vlList: [], // 课标词表
+        tplList: [], // 栏目列表
+        tabsList:['中英双语','少儿必读'],
+        issueId: ''
     }
   },
   //计算属性 类似于data概念
@@ -204,7 +371,17 @@ export default {
         if(type=='-'){
             if(this.stepIndex>0) this.stepIndex--
         }else{
-            if(this.stepIndex<2) this.stepIndex++
+            if(this.stepIndex===0){
+                this.$refs['newspaperForm'].validate((valid) => {
+                    if (valid) {
+                        this.handleAddIssue()
+                    } else {
+                        return false;
+                    }
+                });
+            }else if(this.stepIndex===1){
+                this.stepIndex++
+            }
         }
     },
     // 返回列表
@@ -232,6 +409,7 @@ export default {
             this.newspaperForm.cover_image_list = fileList
             this.newspaperForm.cover_image_id = fileList[0]&&fileList[0].response&&fileList[0].response.file_info_list&&fileList[0].response.file_info_list[0]?fileList[0].response.file_info_list[0].file_id:''
             this.newspaperForm.cover_image_url = fileList[0]&&fileList[0].response&&fileList[0].response.file_info_list&&fileList[0].response.file_info_list[0]?fileList[0].response.file_info_list[0].file_url:''
+            this.$forceUpdate()
         }
     },
     Imagemouseover(item,flag) {
@@ -247,6 +425,7 @@ export default {
             this.newspaperForm.cover_image_list.splice(i, 1);
             this.newspaperForm.cover_image_url = ''
             this.newspaperForm.cover_image_id = null
+            this.$forceUpdate()
         }
       });
     },
@@ -272,6 +451,8 @@ export default {
     // 课标词表
     getVlList(){
         this.newspaperForm.vl_id = ''
+        this.newspaperForm.chn_data = ''
+        this.newspaperForm.chn_data_str = ''
         let MethodName = "/PaperServer/Manager/VocListManager/FindSimplesByCond";
         let data = {
             study_phase: this.newspaperForm.study_phase
@@ -284,10 +465,96 @@ export default {
         })
         .catch(() => {
         });
+        let MethodNames = "/PaperServer/Manager/ChannelTplManager/PickChannelTplByCond";
+        getLogin(MethodNames, data)
+        .then((res) => {
+            if(res.status===1){
+               let tplList = res.data
+               tplList.forEach(item => {
+                item.chn_data_string = JSON.stringify(item.chn_data)
+               });
+               this.tplList = tplList
+            }
+        })
+        .catch(() => {
+        });
+    },
+    handleChangeChn(){
+        this.newspaperForm.chn_data_str = JSON.parse(this.newspaperForm.chn_data).join('\n')
+    },
+    handleAddIssue(){
+        let MethodName = "/PaperServer/Manager/IssueManager/AddIssue";
+        let form = this.newspaperForm
+        let data = {
+            iss_cover_id: form.cover_image_id,
+            iss_name: form.iss_name,
+            vendor_name: form.vendor_name,
+            release_date: form.release_date,
+            comb_flag: form.comb_flag,
+            iss_no:form.comb_flag===0?form.iss_no:null,
+            iss_no_start: form.comb_flag===1?form.iss_no_start:null,
+            iss_no_end: form.comb_flag===1?form.iss_no_end:null,
+            study_phase: form.study_phase,
+            vl_id: form.vl_id,
+            iss_price_org: form.iss_price_org,
+            iss_price_sell: form.iss_price_sell,
+            with_addon_price_org: form.with_addon_price_org,
+            with_addon_price_sell: form.with_addon_price_sell,
+            iss_note: form.iss_note,
+            info_tag_data: form.info_tag_data,
+            chn_data: JSON.parse(form.chn_data),
+            with_addon_flag: form.with_addon_flag
+        }
+        if(this.id){
+            MethodName = "/PaperServer/Manager/IssueManager/EditIssue"
+            data.id = this.id
+        }
+        getLogin(MethodName, data)
+        .then((res) => {
+            if(res.status===1){
+               this.issueId = res.data.id
+               this.stepIndex++
+            }
+        })
+        .catch(() => {
+            this.loading = false
+        });
+    },
+    getInfo(){
+        let MethodName = "/PaperServer/Manager/IssueManager/FindIssueById"
+        let data = {
+            id: this.id
+        }
+        getLogin(MethodName, data)
+        .then((res) => {
+            if(res.status===1){
+                this.newspaperForm = res.data
+                this.newspaperForm.cover_image_list = []
+                this.newspaperForm.chn_data = JSON.stringify(res.data.chn_data)
+                this.newspaperForm.chn_data_str = JSON.parse(res.data.chn_data).join('\n')
+                this.newspaperForm.cover_image_id = res.data.iss_cover_id
+                getLogin('/FileServer/GetFileInfo', {
+                    file_id: res.data.iss_cover_id
+                })
+                .then((res) => {
+                    if(res.status===1){
+                        this.newspaperForm.cover_image_url = res.file_url
+                        this.$forceUpdate()
+                    }
+                })
+                this.newspaperForm.cover_image_list.push[{
+                    id: res.data.iss_cover_id
+                }]
+            }
+        })
+        .catch(() => {
+        });
     }
   },
   //生命周期 - 创建完成（可以访问当前this实例）
-  created() {
+  async created() {
+    this.getVendorList()
+    await this.getVlList()
     let obj = {
         icon:'',
         url:'',
@@ -295,10 +562,9 @@ export default {
     }
     if(this.id){
         obj.text = '编辑报纸'
+        this.getInfo()
     }
     this.breadcrumbList.push(obj)
-    this.getVendorList()
-    this.getVlList()
   },
   //生命周期 - 挂载完成（可以访问DOM元素）
   mounted() {
@@ -371,13 +637,45 @@ export default {
             line-height: 32px;
         }
     }
-    
+    .tpl-maintain{
+        margin: 0 16px;
+        color: #4F75FF;
+        &:hover{
+            text-decoration: underline;
+        }
+    }
+    h6{
+        color: #000;
+        font-size: 16px;
+        font-weight: 400;
+        line-height: 24px;
+        margin: 0 0 16px 0;
+    }
+}
+.cover-box{
+    position: relative;
+    width: 200px;
+    height: 280px;
+    p{
+        position: absolute;
+        bottom: 0;
+        left: 0;
+        width: 100%;
+        height: 280px;
+        line-height: 280px;
+        font-size: 20px;
+        text-align: center;
+        cursor: pointer;
+        background: rgba(0, 0, 0, 0.3);
+        color: #F2F3F5;
+        margin: 0;
+    }
 }
 </style>
 <style lang="scss">
 .newspaper-create{
     .validity-box{
-        width: 114px;
+        // width: 114px;
         .el-input-group{
             width: 114px;
         }
@@ -391,17 +689,16 @@ export default {
         }
     } 
     .iss-no-box{
-        width: 264px;
         .el-form-item__content{
             display: flex;
             border-radius: 4px;
-            overflow: hidden;
             width: 164px;
         }
         .el-input-group{
             width: 82px;
             flex-shrink: 0;
-            border-radius: 0;
+            border-radius: 0 4px 4px 0;
+            overflow: hidden;
         }
         .el-input__inner{
             border-radius: 0;
@@ -417,13 +714,44 @@ export default {
             text-align: center;
         }
         .iss-start{
+            &.el-input-group{
+                border-radius: 4px 0 0 4px;
+            }
             .el-input-group__append{
-                width: 12px;
+                width: 32px;
             }
         }
     }
     input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {
         -webkit-appearance: none !important;
     }  
+    .el-divider{
+        width: 600px;
+    }
+    .price-box{
+        width: 300px;
+        display: inline-block;
+        .el-form-item__content{
+            position: relative;
+            .prepend,.append{
+                position: absolute;
+                left: 44px;
+                font-size: 14px;
+                line-height: 22px;
+                color: #1D2129;
+                line-height: 34px;
+            }
+            .append{
+                left: 142px;
+            }
+        }
+    }
+    .personal-ceil{
+        width: 200px;
+        .el-input__inner{
+            width: 200px;
+            padding: 0 60px;
+        }
+    }
 }
 </style>