<template>
    <div class="ht-page-operate-detail-demo">
        <ht-page-operate-detail
                :title-data="titleData"
                :tabs-data="tabsData">
            <span>方案一：集群新增</span>
            <br />
            <span>方案二：集群新增</span>
        </ht-page-operate-detail>
    </div>
</template>

<script>
  export default {
        name: 'HtPageOperateDetailDemo',
        data(){
            return {
                titleData:{
                    border:'solid',
                    align:'left',
                    title:'新增主账户信息'
                },
                tabsData:[
                    {
                        tab:{
                            name:'bq1',
                            label:'标签一'
                        },
                        dataInfo: {
                            inquiryCode: '1111111',
                            inquiryNumber:0,
                            professionalOrgId: '',
                            purchaseCategory: '',
                            quoteEndDateStart: '',
                            quoteEndDateEnd: '',
                            publishTimeStart: '',
                            publishTimeEnd: ''
                        },//搜索数据
                        labelWidth: '120',//标签的宽度
                        columns: [
                            {
                                componentType: 'Label',
                                labelName: '采购单编号：',
                                placeholder: '请输入采购单编号',
                                prop: 'inquiryCode',
                            },
                            {
                                componentType: 'HtBaseRadio',
                                labelName: '采购单编号：',
                                placeholder: '请输入采购单编号',
                                prop: 'inquiryCode',
                                children:{
                                    items:[
                                        {value:'qq', label: 'a'},
                                        {value:'ww', label: 'b'},
                                        {value:'ee', label: 'c'}
                                    ]
                                }
                            },
                            {
                                componentType: 'HtBaseInputNumber',
                                labelName: '采购数量：',
                                placeholder: '请输入采购单编号',
                                max:100,
                                min:0,
                                prop: 'inquiryNumber',
                            },
                            {
                                componentType: 'HtBaseSelect',
                                labelName: '采购机构：',
                                placeholder: '请输入采购机构：',
                                prop: 'professionalOrgId',
                                children:{
                                    sytnax:'Option',
                                    items:[
                                        {label: '物资类', value: '1'},
                                        {label: '施工类', value: '2'},
                                        {label: '服务类', value: '3'}
                                    ]
                                },
                                rules:[
                                    {
                                        required:true,
                                        message:'不能为空',
                                        trigger: 'change'
                                    }
                                ]
                            },
                            {
                                componentType: 'HtBaseSelect',
                                labelName: '采购类别：',
                                placeholder: '请选择采购类别',
                                prop: 'purchaseCategory',
                                children:{
                                    sytnax:'Option',
                                    items:[
                                        {label: '物资类', value: '1'},
                                        {label: '施工类', value: '2'},
                                        {label: '服务类', value: '3'}
                                    ]
                                }
                            },
                            {
                                componentType: 'HtBaseDatePicker',
                                labelName: '报价开始日期：',
                                placeholder: '请输入开始时间',
                                prop: 'quoteEndDateStart',
                                format: 'yyyy-MM-dd HH:mm:ss',
                                on:{
                                    'on-change':param=>{
                                        this.tabsData[0].dataInfo['quoteEndDateStart'] = param;
                                    }
                                },
                                rules:[
                                    {
                                        required:true,
                                        message:'不能为空',
                                        trigger: 'change'
                                    }
                                ]
                            },
                            {
                                componentType: 'HtBaseDatePicker',
                                labelName: '报价结束日期：',
                                placeholder: '请输入结束时间',
                                prop: 'quoteEndDateEnd',
                                format: 'yyyy-MM-dd HH:mm:ss',
                                on:{
                                    'on-change':param=>{
                                        this.tabsData[0].dataInfo['quoteEndDateEnd'] = param;
                                    }
                                }
                            },
                            {
                                componentType: 'HtBaseDatePicker',
                                labelName: '发布开始日期：',
                                placeholder: '请输入开始时间',
                                prop: 'publishTimeStart',
                                format: 'yyyy-MM-dd HH:mm:ss',
                                on:{
                                    'on-change':param=>{
                                        this.tabsData[0].dataInfo['publishTimeStart'] = param;
                                    }
                                }
                            },
                            {
                                componentType: 'HtBaseDatePicker',
                                labelName: '发布结束日期：',
                                placeholder: '请输入结束时间',
                                prop: 'publishTimeEnd',
                                format: 'yyyy-MM-dd HH:mm:ss',
                                on:{
                                    'on-change':param=>{
                                        this.tabsData[0].dataInfo['publishTimeEnd'] = param;
                                    }
                                }
                            }
                        ],//全部的栏位信息
                        buttonAlign:'center',
                        buttonsInfo:{//按钮信息
                            buttons:[
                                {label:'新增',type:'primary',action:'submit',click:this.add,iconType:'LiRa_plus'},
                                {label:'重置',type:'info',action:'reset',click:this.reset,iconType:'LiRa_refresh'},
                                {label:'其他',type:'warning',click:this.other}
                            ]
                        }
                    },
                    {
                        tab:{
                            name:'bq2',
                            label:'标签二'
                        },
                        dataInfo: {
                            inquiryCode: '1111111',
                            inquiryNumber:0,
                            professionalOrgId: '',
                            purchaseCategory: '',
                            quoteEndDateStart: '',
                            quoteEndDateEnd: '',
                            publishTimeStart: '',
                            publishTimeEnd: ''
                        },//搜索数据
                        labelWidth: '120',//标签的宽度
                        columns: [
                            {
                                componentType: 'Label',
                                labelName: '采购单编号：',
                                placeholder: '请输入采购单编号',
                                prop: 'inquiryCode',
                            },
                            {
                                componentType: 'HtBaseRadio',
                                labelName: '采购单编号：',
                                placeholder: '请输入采购单编号',
                                prop: 'inquiryCode',
                                children:{
                                    items:[
                                        {value:'q', label:'qq'},
                                        {value:'w', label:'ww'},
                                        {value:'e', label:'ee'}
                                    ]
                                }
                            },
                            {
                                componentType: 'HtBaseInputNumber',
                                labelName: '采购数量：',
                                placeholder: '请输入采购单编号',
                                max:100,
                                min:0,
                                prop: 'inquiryNumber',
                            },
                            {
                                componentType: 'HtBaseSelect',
                                labelName: '采购机构：',
                                placeholder: '请输入采购机构：',
                                prop: 'professionalOrgId',
                                children:{
                                    sytnax:'Option',
                                    items:[
                                        {label: '物资类', value: '1'},
                                        {label: '施工类', value: '2'},
                                        {label: '服务类', value: '3'}
                                    ]
                                },
                                rules:[
                                    {
                                        required:true,
                                        message:'不能为空',
                                        trigger: 'change'
                                    }
                                ]
                            },
                            {
                                componentType: 'HtBaseSelect',
                                labelName: '采购类别：',
                                placeholder: '请选择采购类别',
                                prop: 'purchaseCategory',
                                children:{
                                    sytnax:'Option',
                                    items:[
                                        {label: '物资类', value: '1'},
                                        {label: '施工类', value: '2'},
                                        {label: '服务类', value: '3'}
                                    ]
                                }
                            }
                        ],//全部的栏位信息
                        buttonAlign:'center',
                        buttonsInfo:{//按钮信息
                            buttons:[
                                {label:'新增',type:'primary',action:'submit',click:this.add,iconType:'LiRa_plus'},
                                {label:'重置',type:'info',action:'reset',click:this.reset,iconType:'LiRa_refresh'},
                                {label:'其他',type:'warning',click:this.other}
                            ]
                        }
                    },
                ]
            }
        },
        methods:{
            add(data){

            },
            reset(){

            },
            other(){

            }
        }
  }
</script>
<style>
    .ht-page-operate-detail-demo {

    }
</style>

