banner管理上下线时间

2019-07-31  本文已影响0人  曹锦花

上下线时间

                <Row>
                    <Col span='12'>
                        <!-- 上线时间 -->
                        <FormItem :label='$t("highTime")' >
                            <Date-picker type="datetime" :placeholder="placeholderStartTimer" v-model="userBaseInfo.startTime" 
                            :options="startTimeOption"
                            @on-open-change="onOpenchange(userBaseInfo.startTime,userBaseInfo.endTime,'start')"
                            style="width: 100%;"></Date-picker>
                            <!-- @on-change="onStartTimeChange"  -->
                        </FormItem>
                    </Col>
                    <Col span='12'>
                        <!-- 下线时间 -->
                        <FormItem :label='$t("insertTime")'>
                            <Date-picker type="datetime" :placeholder="placeholderStartTimer" v-model="userBaseInfo.endTime" 
                            @on-open-change="onOpenchange(userBaseInfo.startTime,userBaseInfo.endTime,'end')"
                            :options="endTimeOption"
                            style="width: 100%;"></Date-picker>
                            <!-- @on-change="onEndTimeChange"  -->
                        </FormItem>
                    </Col>
                </Row>
______________________________
        data () {
            return {
           userBaseInfo: {  
                    'startTime': '', // 开始时间
                    'endTime': '', // 结束时间
                },
            }
        }
        //弹出日历和关闭日历时触发
        onOpenchange(startTime,endTime,str){
            if(startTime != ''){
            this.endTimeOption = {
                disabledDate(endTime) {
                    return (
                        // new Date(Date.parse(new Date(endTime)) - 60 * 60 * 1000 * 24)
                        endTime < new Date(Date.parse(new Date(startTime)) - 1000)
                    );
                }
            };

            }
            if(endTime != ''){
                this.startTimeOption = {
                    disabledDate(startTime) {
                        return (
                            startTime > new Date(endTime)
                        );
                    }
                };
            }
            this.send(str);
          },
        send(data){
            let params = {
                type: data
            }
            if(data == 'start') {
                params.timeVal = this.userBaseInfo.startTime
                this.$emit("child", params)
            } else if(data == 'end') {
                params.timeVal = this.userBaseInfo.endTime
                this.$emit("child", params)
            }
            
        },

图片上传


                <Row>
                    <Col span='6'>
                        <!-- 图片 -->
                        <FormItem :label='$t("picture")'>
                            <Upload :action="basicUrl + 'upload'"
                                :on-success = 'uploadSuccessed'
                                :on-error = "uploadFailed"
                                :on-progress = "uploading"
                                :show-upload-list = "false"
                                :headers='uploadHeaders'>
                                <Button icon="ios-cloud-upload-outline"></Button>
                            </Upload>
                        </FormItem>
                    </Col>
                    <Col span='18'>
                        <img :src="userBaseInfo.url" @click='clickPicture(userBaseInfo.url)' style='width:367px;height:115px;'>
                    </Col>
                </Row>
_____________________________________
data() {
  return {
                BASICURL : BASEURL + urlPathAdmin
                uploadHeaders: {'x-auth-token': Cookies.get('token')},
              userBaseInfo: {
                    'url': '', // 图片URL
                },
  }
}
        methods: {
            /* 图片上传时的钩子函数 */
            uploading (event, file, fileList) {
                this.ifShowPercentCircle = true;
                this.percentage = file.percentage;
            },
    
            /* 图片上传成功时的钩子函数 */
            uploadSuccessed (response, file, fileList) {
                this.userBaseInfo.url = response.data;
                this.ifShowPercentCircle = false;
                this.$Message.success('上传成功');
            },
    
            /* 图片上传失败时的钩子函数 */
            uploadFailed (error, file, fileList) {
                this.ifShowPercentCircle = false;
                this.$Message.error('上传失败');
            },
        }
上一篇 下一篇

猜你喜欢

热点阅读