poolAndCodeEdit.html 3.49 KB
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8"/>
        <title>Yoho!Buy运营平台</title>
        
        <script src="/ufoPlatform/js/include.js"></script>


    <style>
    .app {
        padding: 50px;
    }
    </style>
</head>
<body class="easyui-layout">

<div id="tradeBillsList" region="center">
    <div id="app" style="padding: 50px 20px" class="app-box">
        <i-form :label-width="120">

            <Form-item label="活动名称">
                <i-input v-model="info.activityName" placeholder="请输入"></i-input>
            </Form-item>
            <Form-item label="商品范围">
                <Radio-group v-model="productOptionValue" @on-change="changeProductOption">
                    <Radio label="0">全部商品</Radio>
                    <Radio label="1">商品池ID</Radio>
                </Radio-group>

                <i-input v-if="productOptionValue == '1'" v-model="info.poolId" style="width: 60px;"></i-input>

            </Form-item>

            <Form-item label="资源位位置码">
                <i-input v-model="info.code" placeholder="请输入"></i-input>
            </Form-item>
            <Form-item label="展示时间段">
                <Row>
                    <i-col span="12">
                        <Date-picker type="datetime" :value="startTimeStr" placeholder="开始时间" style="width: 180px"  @on-change="changeStartTime"></Date-picker>
                    </i-col>

                    <i-col span="12">
                        <Date-picker type="datetime" :value="endTimeStr" placeholder="结束时间" style="width: 180px" @on-change="changeEndTime"></Date-picker>
                    </i-col>
                </Row>
            </Form-item>
        </i-form>

    </div>
</div>

<script>
    console.log(formData);
    var app = new Vue({
        el: '#app',
        data: {
            info: {},
            startTimeOption: {},
            endTimeOption: {},
            productOptionValue: 0,
            startTimeStr: '',
            endTimeStr: '',
        },
        created: function () {
            this.info = info || {};
            this.productOptionValue = this.info.poolId > 0 ? "1" : "0";
            this.startTimeStr = this.info.startTime ? moment(this.info.startTime*1000).format('YYYYMMDD H:mm:ss') : "";
            this.endTimeStr = this.info.endTime ? moment(this.info.endTime*1000).format('YYYYMMDD H:mm:ss') : "";
        },

        methods: {
            onStartTimeChange: function(startTime, type) {
                console.log('onStartTimeChange', startTime, type);
            },

            onEndTimeChange: function (endTime, type) {
                console.log('onEndTimeChange', endTime, type);
            },

            changeProductOption: function (val) {
                this.info.poolId = 0;
            },

            changeStartTime: function (data) {
                this.info.startTime = moment(data).valueOf() / 1000;
                console.log(this.info);
            },

            changeEndTime: function (data) {
                this.info.endTime = moment(data).valueOf() / 1000;
                console.log(this.info);
            }
        },
        computed: {
            showPool: function () {
                return this.productOptionValue == 0 ? false : true
            }
        },
        watch: {
            info: {
                handler: function () {
                    formData = this.info;
                },
                deep: true
            }
        }
    });

</script>
</body>
</html>