"use strict";(self["webpackChunklin_cms_vue"]=self["webpackChunklin_cms_vue"]||[]).push([[7449],{67449:function(e,n,t){t.r(n),t.d(n,{default:function(){return _}});var l=t(20641),a=t(90033),r=function(e){return(0,l.Qi)("data-v-854f958a"),e=e(),(0,l.jt)(),e},u={class:"lin-container"},o=r((function(){return(0,l.Lk)("div",{class:"lin-title"},"TimePicker 时间选择器",-1)})),i={class:"lin-wrap-ui"},c=r((function(){return(0,l.Lk)("div",{slot:"header"},[(0,l.Lk)("span",null,"固定时间点")],-1)})),d={style:{"white-space":"pre-wrap"}},s=r((function(){return(0,l.Lk)("div",{slot:"header"},[(0,l.Lk)("span",null,"任意时间点")],-1)})),p={style:{"white-space":"pre-wrap"}},m=r((function(){return(0,l.Lk)("div",{slot:"header"},[(0,l.Lk)("span",null,"固定时间范围")],-1)})),k={style:{"white-space":"pre-wrap"}},f=r((function(){return(0,l.Lk)("div",{slot:"header"},[(0,l.Lk)("span",null,"任意时间范围")],-1)})),v={style:{"white-space":"pre-wrap"}};function b(e,n,t,r,b,h){var w=(0,l.g2)("el-time-select"),g=(0,l.g2)("el-row"),_=(0,l.g2)("el-collapse-item"),F=(0,l.g2)("el-collapse"),L=(0,l.g2)("el-card"),V=(0,l.g2)("el-time-picker");return(0,l.uX)(),(0,l.CE)("div",u,[o,(0,l.Lk)("div",i,[(0,l.bF)(L,{style:{"margin-bottom":"50px"}},{default:(0,l.k6)((function(){return[c,(0,l.bF)(g,null,{default:(0,l.k6)((function(){return[(0,l.Lk)("div",null,[(0,l.bF)(w,{modelValue:b.value1,"onUpdate:modelValue":n[0]||(n[0]=function(e){return b.value1=e}),"picker-options":{start:"08:30",step:"00:15",end:"18:30"},placeholder:"选择时间"},null,8,["modelValue"])])]})),_:1}),(0,l.bF)(F,null,{default:(0,l.k6)((function(){return[(0,l.bF)(_,{title:"查看代码",name:"2"},{default:(0,l.k6)((function(){return[(0,l.Lk)("div",d,(0,a.v_)(b.base),1)]})),_:1})]})),_:1})]})),_:1}),(0,l.bF)(L,{style:{"margin-bottom":"50px"}},{default:(0,l.k6)((function(){return[s,(0,l.bF)(g,null,{default:(0,l.k6)((function(){return[(0,l.Lk)("div",null,[(0,l.Lk)("template",null,[(0,l.bF)(V,{modelValue:b.value2,"onUpdate:modelValue":n[1]||(n[1]=function(e){return b.value2=e}),"picker-options":{selectableRange:"18:30:00 - 20:30:00"},placeholder:"任意时间点"},null,8,["modelValue"]),(0,l.bF)(V,{"arrow-control":"",modelValue:b.value3,"onUpdate:modelValue":n[2]||(n[2]=function(e){return b.value3=e}),"picker-options":{selectableRange:"18:30:00 - 20:30:00"},placeholder:"任意时间点"},null,8,["modelValue"])])])]})),_:1}),(0,l.bF)(F,{class:"test",style:{color:"red"}},{default:(0,l.k6)((function(){return[(0,l.bF)(_,{title:"查看代码",name:"2"},{default:(0,l.k6)((function(){return[(0,l.Lk)("div",p,(0,a.v_)(b.selectableRange),1)]})),_:1})]})),_:1})]})),_:1}),(0,l.bF)(L,{style:{"margin-bottom":"50px"}},{default:(0,l.k6)((function(){return[m,(0,l.bF)(g,null,{default:(0,l.k6)((function(){return[(0,l.Lk)("div",null,[(0,l.Lk)("template",null,[(0,l.bF)(w,{placeholder:"起始时间",modelValue:b.startTime,"onUpdate:modelValue":n[3]||(n[3]=function(e){return b.startTime=e}),"picker-options":{start:"08:30",step:"00:15",end:"18:30"}},null,8,["modelValue"]),(0,l.bF)(w,{placeholder:"结束时间",modelValue:b.endTime,"onUpdate:modelValue":n[4]||(n[4]=function(e){return b.endTime=e}),"picker-options":{start:"08:30",step:"00:15",end:"18:30",minTime:b.startTime}},null,8,["modelValue","picker-options"])])])]})),_:1}),(0,l.bF)(F,{class:"test",style:{color:"red"}},{default:(0,l.k6)((function(){return[(0,l.bF)(_,{title:"查看代码",name:"2"},{default:(0,l.k6)((function(){return[(0,l.Lk)("div",k,(0,a.v_)(b.selectStarTime),1)]})),_:1})]})),_:1})]})),_:1}),(0,l.bF)(L,{style:{"margin-bottom":"50px"}},{default:(0,l.k6)((function(){return[f,(0,l.bF)(g,null,{default:(0,l.k6)((function(){return[(0,l.Lk)("div",null,[(0,l.Lk)("template",null,[(0,l.bF)(V,{"is-range":"",modelValue:b.value4,"onUpdate:modelValue":n[5]||(n[5]=function(e){return b.value4=e}),"range-separator":"至","start-placeholder":"开始时间","end-placeholder":"结束时间",placeholder:"选择时间范围"},null,8,["modelValue"]),(0,l.bF)(V,{"is-range":"","arrow-control":"",modelValue:b.value5,"onUpdate:modelValue":n[6]||(n[6]=function(e){return b.value5=e}),"range-separator":"至","start-placeholder":"开始时间","end-placeholder":"结束时间",placeholder:"选择时间范围"},null,8,["modelValue"])])])]})),_:1}),(0,l.bF)(F,{class:"test",style:{color:"red"}},{default:(0,l.k6)((function(){return[(0,l.bF)(_,{title:"查看代码",name:"2"},{default:(0,l.k6)((function(){return[(0,l.Lk)("div",v,(0,a.v_)(b.isRange),1)]})),_:1})]})),_:1})]})),_:1})])])}var h={name:"",components:{},data:function(){return{startTime:"",endTime:"",value1:"",value2:new Date(2016,9,10,18,40),value3:new Date(2016,9,10,18,40),value4:[new Date(2016,9,10,8,40),new Date(2016,9,10,9,40)],value5:[new Date(2016,9,10,8,40),new Date(2016,9,10,9,40)],base:"\n <el-time-select\n v-model=\"value1\"\n :picker-options=\"{\n start: '08:30',\n step: '00:15',\n end: '18:30'\n }\"\n placeholder=\"选择时间\">\n </el-time-select>\n\n <script>\n export default {\n data() {\n return {\n value1: ''\n };\n }\n }\n /script>",selectableRange:'\n <template>\n <el-time-picker\n v-model="value2"\n :picker-options="{\n selectableRange: \'18:30:00 - 20:30:00\'\n }"\n placeholder="任意时间点">\n </el-time-picker>\n <el-time-picker\n arrow-control\n v-model="value3"\n :picker-options="{\n selectableRange: \'18:30:00 - 20:30:00\'\n }"\n placeholder="任意时间点">\n </el-time-picker>\n </template>\n\n <script>\n export default {\n data() {\n return {\n value2: new Date(2016, 9, 10, 18, 40),\n value3: new Date(2016, 9, 10, 18, 40)\n };\n }\n }\n <\/script>',selectStarTime:"\n <template>\n <el-time-select\n placeholder=\"起始时间\"\n v-model=\"startTime\"\n :picker-options=\"{\n start: '08:30',\n step: '00:15',\n end: '18:30'\n }\">\n </el-time-select>\n <el-time-select\n placeholder=\"结束时间\"\n v-model=\"endTime\"\n :picker-options=\"{\n start: '08:30',\n step: '00:15',\n end: '18:30',\n minTime: startTime\n }\">\n </el-time-select>\n </template>\n\n <script>\n export default {\n data() {\n return {\n startTime: '',\n endTime: ''\n };\n }\n }\n <\/script>",isRange:'\n <template>\n <el-time-picker\n is-range\n v-model="value4"\n range-separator="至"\n start-placeholder="开始时间"\n end-placeholder="结束时间"\n placeholder="选择时间范围">\n </el-time-picker>\n <el-time-picker\n is-range\n arrow-control\n v-model="value5"\n range-separator="至"\n start-placeholder="开始时间"\n end-placeholder="结束时间"\n placeholder="选择时间范围">\n </el-time-picker>\n </template>\n\n <script>\n export default {\n data() {\n return {\n value4: [new Date(2016, 9, 10, 8, 40), new Date(2016, 9, 10, 9, 40)],\n value5: [new Date(2016, 9, 10, 8, 40), new Date(2016, 9, 10, 9, 40)]\n };\n }\n }\n <\/script>'}},computed:{},watch:{},mounted:function(){this.init()},methods:{init:function(){}}},w=t(66262);const g=(0,w.A)(h,[["render",b],["__scopeId","data-v-854f958a"]]);var _=g}}]);
|
