smartschool-platform/frontend/pc-web/app/view/Interaction/timetable/Detail.js

Ext.define('school.view.interaction.timetable.Detail', {
    extend: 'school.view.core.form.FormPanel',
    xtype: 'interaction-timetable-detail',

    controller: 'interaction-timetable-detail',

    _title: '课程表',
    _idField: 'id',
    _codeField: null,
    // _readUrl: 'http://10.1.80.47:9520/api/school/curriculum/read',
    _readUrl: '/api/school/curriculum/read',
    // _saveUrl: 'http://10.1.80.47:9520/api/school/curriculum/save',
    _saveUrl: '/api/school/curriculum/save',
    _deleteUrl: '/api/school/curriculum/delete',
    initId: 0,
    cls: 'timetable',

    START_TIME: Ext.Date.parse('08:00', 'H:i'), // 开始上课时间
    END_TIME: Ext.Date.parse('22:00', 'H:i'), // 结束上课时间
    MIN_WHILE: 10, // 一节课最小时间(分钟)


    initComponent: function () {
        let me = this;
        Ext.apply(this, {
            defaultItems: [{
                xtype: 'hidden',
                name: 'id',
                fieldLabel: 'id'
            }, {
                xtype: 'textfield',
                name: 'name',
                fieldLabel: '课表名称'
            }, {
                xtype: 'numberfield',
                name: 'gradeId',
                fieldLabel: '年级ID',
                hidden: true
            }, {
                xtype: 'gradecombo',
                name: 'gradeName',
                fieldLabel: '年级',
                allowBlank: false,
                listeners: {
                    select: function (combo, record, eOpts) {
                        combo.up('form').getForm().findField('gradeId').setValue(record.get('value'));
                        combo.up('form').getForm().findField('clazzId').setValue(null);
                        combo.up('form').getForm().findField('clazzName').setValue(null);
                    }
                }
            }, {
                xtype: 'numberfield',
                name: 'clazzId',
                fieldLabel: '班级ID',
                hidden: true
            }, {
                xtype: 'classcombo',
                name: 'clazzName',
                fieldLabel: '班级',
                allowBlank: false,
                listeners: {
                    expand: function (combo, eOpts) {
                        combo.store.clearFilter();

                        var gradeCombo = combo.up('form').getForm().findField('gradeName');
                        var gradeName = gradeCombo.getValue();

                        var filter = new Ext.util.Filter({
                            property: 'clazz_grade',
                            value: gradeName
                        });

                        if (!!gradeName) {
                            combo.store.setFilters([filter]);
                        }
                    },
                    select: function (combo, record, eOpts) {
                        combo.up('form').getForm().findField('clazzId').setValue(record.get('clazz_id'));
                        combo.up('form').getForm().findField('gradeName').setValue(record.get('clazz_grade'));
                    }
                }
            }, {
                xtype: 'textfield',
                name: 'termPart',
                fieldLabel: '学年',
                allowBlank: false
            }, {
                xtype: "textfield",
                name: "termName",
                fieldLabel: "学期",
                allowBlank: false
            }, {
                xtype: "textfield",
                name: "creatorName",
                fieldLabel: "录入人",
                defaultValue: school.util.BaseUtil.getCurrentUser().username,
                readOnly: true
            }, {
                xtype: 'datefield',
                name: 'createTime',
                fieldLabel: '录入时间',
                format: 'Y-m-d H:i:s',
                defaultValue: new Date(),
                readOnly: true
            }, {
                xtype: 'combobox',
                name: 'status',
                fieldLabel: '状态',
                displayField: 'name',
                valueField: 'value',
                editable: false,
                readOnly: true,
                minChars: 0,
                queryMode: 'local',
                store: Ext.create('Ext.data.ArrayStore', {
                    fields: ['name', 'value'],
                    data: [['已生效', '1'], ['未生效', '0']]
                }),
                defaultValue: 0
            }, {
                name: "timetable",
                xtype: "detailGridField",
                idColumn: 'id',
                detnoColumn: 'lessons',
                storeModel: 'school.model.Timetable',
                deleteDetailUrl: '/api/school/curriculum/deleteDetail',
                allowEmpty: true,
                showCount: false,
                emptyRows: 10,
                rowViewModel: {},
                columns: [{
                    text: 'id',
                    dataIndex: 'id',
                    hidden: true
                }, {
                    text: '时间段',
                    xtype: 'widgetcolumn',
                    width: 200,
                    padding: 0,
                    tdCls: 'x-period-column',
                    getBindField: function(c) {
                        return ['startTime', 'endTime']
                    },
                    widget: {
                        xtype: 'container',
                        style: {
                            textAlign: 'center'
                        },
                        items: [{
                            xtype: 'button',
                            text: '0:00',
                            bind: {
                                text: '{record._timeText1}',
                            },
                            style: {
                                margin: '5px',
                                height: '22px',
                                width: '74px',
                                padding: 0
                            },
                            handler: function(btn) {
                                me.currentRecord = btn.ownerCt.$widgetRecord;
                            },
                            menu: {
                                xtype: 'menu',
                                plain: true,
                                items: [{
                                    xtype: 'timepicker',
                                    maxHeight: 300,
                                    increment: 5,
                                    format: 'H:i',
                                    minValue: Ext.Date.parse('08:00', 'H:i'),
                                    maxValue: Ext.Date.parse('22:00', 'H:i'),
                                    listeners: {
                                        select: function(model, record, index, eOpts) {
                                            me.onSelectPeriod0(this, this.up(), record);
                                        },
                                    }
                                }]
                            },
                        }, {
                            xtype: 'button',
                            text: '0:00',
                            bind: {
                                text: '{record._timeText2}',
                            },
                            style: {
                                margin: '5px',
                                height: '22px',
                                width: '74px',
                                padding: 0
                            },
                            menu: {
                                xtype: 'menu',
                                plain: true,
                                items: [{
                                    xtype: 'timepicker',
                                    maxHeight: 300,
                                    increment: 10,
                                    format: 'H:i',
                                    minValue: Ext.Date.parse('08:00', 'H:i'),
                                    maxValue: Ext.Date.parse('22:00', 'H:i'),
                                    listeners: {
                                        select: function(model, record, index, eOpts) {
                                            me.onSelectPeriod1(this, this.up(), record);
                                        },
                                    }
                                }],
                                listeners: {
                                    beforeshow: function(th, eOpts) {
                                        me.currentRecord = th.ownerCmp.ownerCt.$widgetRecord;
                                        let picker = th.down('timepicker');
                                        let startDate = me.currentRecord.get('_time1') || Ext.Date.parse('08:00', 'H:i');
                                        let minValue = Ext.Date.add(startDate, Ext.Date.MINUTE, me.MIN_WHILE);
                                        picker.setMinValue(minValue)
                                    },
                                }
                            },
                        }]
                    }
                }, {
                    text: '星期一',
                    dataIndex: 'mon',
                    xtype: 'subjectcolumn'
                }, {
                    text: '星期二',
                    dataIndex: 'tues',
                    xtype: 'subjectcolumn'
                }, {
                    text: '星期三',
                    dataIndex: 'wed',
                    xtype: 'subjectcolumn'
                }, {
                    text: '星期四',
                    dataIndex: 'thur',
                    xtype: 'subjectcolumn'
                }, {
                    text: '星期五',
                    dataIndex: 'fri',
                    xtype: 'subjectcolumn'
                }, {
                    text: '星期六',
                    dataIndex: 'sat',
                    xtype: 'subjectcolumn'
                }, {
                    text: '星期日',
                    dataIndex: 'sunday',
                    xtype: 'subjectcolumn'
                }]
            }],
        });
        this.callParent();
    },

    onSelectPeriod0: function(picker, menu, record) {
        let me = this;
        me.currentRecord.set('startTime', Ext.Date.format(record.get('date'), 'H:i:s'));
        menu.setVisible(false);
    },

    onSelectPeriod1: function(picker, menu, record) {
        let me = this;
        me.currentRecord.set('endTime', Ext.Date.format(record.get('date'), 'H:i:s'));
        menu.setVisible(false);
        let classTime = Math.abs(Ext.Date.diff(me.currentRecord.get('_time1'), record.get('date'), Ext.Date.MINUTE));
        me.CLASS_TIME = classTime;
    },

    refresh: function() {
        Ext.StoreMgr.get('store_grade').load();
        Ext.StoreMgr.get('store_class').load();
        Ext.StoreMgr.get('store_subject').load();
    }
});