"use strict";(self["webpackChunklin_cms_vue"]=self["webpackChunklin_cms_vue"]||[]).push([[99],{30099:function(n,e,l){l.r(e),l.d(e,{default:function(){return J}});var t=l(20641),a=l(90033),u=function(n){return(0,t.Qi)("data-v-48a9887e"),n=n(),(0,t.jt)(),n},o={class:"lin-container"},r=u((function(){return(0,t.Lk)("div",{class:"lin-title"},"Slider 滑块",-1)})),s={class:"lin-wrap-ui"},d=u((function(){return(0,t.Lk)("div",{slot:"header"},[(0,t.Lk)("span",null,"基础用法")],-1)})),i={class:"block demo-block"},c=u((function(){return(0,t.Lk)("span",{class:"demonstration"},"默认",-1)})),p={class:"block demo-block"},v=u((function(){return(0,t.Lk)("span",{class:"demonstration"},"自定义初始值",-1)})),m={class:"block demo-block"},k=u((function(){return(0,t.Lk)("span",{class:"demonstration"},"隐藏 Tooltip",-1)})),f={class:"block demo-block"},b=u((function(){return(0,t.Lk)("span",{class:"demonstration"},"格式化 Tooltip",-1)})),L={class:"block demo-block"},h=u((function(){return(0,t.Lk)("span",{class:"demonstration"},"禁用",-1)})),F={style:{"white-space":"pre-wrap"}},_=u((function(){return(0,t.Lk)("div",{slot:"header"},[(0,t.Lk)("span",null,"离散值")],-1)})),V={class:"block demo-block"},w=u((function(){return(0,t.Lk)("span",{class:"demonstration"},"不显示间断点",-1)})),x={class:"block demo-block"},g=u((function(){return(0,t.Lk)("span",{class:"demonstration"},"显示间断点",-1)})),A={style:{"white-space":"pre-wrap"}},y=u((function(){return(0,t.Lk)("div",{slot:"header"},[(0,t.Lk)("span",null,"带有输入框")],-1)})),C={class:"block"},U={style:{"white-space":"pre-wrap"}},T=u((function(){return(0,t.Lk)("div",{slot:"header"},[(0,t.Lk)("span",null,"范围选择")],-1)})),S={class:"block"},E={style:{"white-space":"pre-wrap"}},I=u((function(){return(0,t.Lk)("div",{slot:"header"},[(0,t.Lk)("span",null,"竖向模式")],-1)})),$={class:"block"},j={style:{"white-space":"pre-wrap"}},Q=u((function(){return(0,t.Lk)("div",{slot:"header"},[(0,t.Lk)("span",null,"展示标记")],-1)})),X={class:"block"},q={style:{"white-space":"pre-wrap"}};function z(n,e,l,u,z,B){var D=(0,t.g2)("el-slider"),G=(0,t.g2)("el-row"),H=(0,t.g2)("el-collapse-item"),J=(0,t.g2)("el-collapse"),K=(0,t.g2)("el-card");return(0,t.uX)(),(0,t.CE)("div",o,[r,(0,t.Lk)("div",s,[(0,t.bF)(K,{class:"box-card base-box-card",style:{"margin-bottom":"50px"}},{default:(0,t.k6)((function(){return[d,(0,t.bF)(G,null,{default:(0,t.k6)((function(){return[(0,t.Lk)("template",null,[(0,t.Lk)("div",i,[c,(0,t.bF)(D,{modelValue:z.value1,"onUpdate:modelValue":e[0]||(e[0]=function(n){return z.value1=n})},null,8,["modelValue"])]),(0,t.Lk)("div",p,[v,(0,t.bF)(D,{modelValue:z.value2,"onUpdate:modelValue":e[1]||(e[1]=function(n){return z.value2=n})},null,8,["modelValue"])]),(0,t.Lk)("div",m,[k,(0,t.bF)(D,{modelValue:z.value3,"onUpdate:modelValue":e[2]||(e[2]=function(n){return z.value3=n}),"show-tooltip":!1},null,8,["modelValue"])]),(0,t.Lk)("div",f,[b,(0,t.bF)(D,{modelValue:z.value4,"onUpdate:modelValue":e[3]||(e[3]=function(n){return z.value4=n}),"format-tooltip":B.formatTooltip},null,8,["modelValue","format-tooltip"])]),(0,t.Lk)("div",L,[h,(0,t.bF)(D,{modelValue:z.value5,"onUpdate:modelValue":e[4]||(e[4]=function(n){return z.value5=n}),disabled:""},null,8,["modelValue"])])])]})),_:1}),(0,t.bF)(J,null,{default:(0,t.k6)((function(){return[(0,t.bF)(H,{title:"查看代码",name:"2"},{default:(0,t.k6)((function(){return[(0,t.Lk)("div",F,(0,a.v_)(z.base),1)]})),_:1})]})),_:1})]})),_:1}),(0,t.bF)(K,{class:"box-card",style:{"margin-bottom":"50px"}},{default:(0,t.k6)((function(){return[_,(0,t.bF)(G,null,{default:(0,t.k6)((function(){return[(0,t.Lk)("template",null,[(0,t.Lk)("div",V,[w,(0,t.bF)(D,{modelValue:z.value6,"onUpdate:modelValue":e[5]||(e[5]=function(n){return z.value6=n}),step:10},null,8,["modelValue"])]),(0,t.Lk)("div",x,[g,(0,t.bF)(D,{modelValue:z.value7,"onUpdate:modelValue":e[6]||(e[6]=function(n){return z.value7=n}),step:10,"show-stops":""},null,8,["modelValue"])])])]})),_:1}),(0,t.bF)(J,null,{default:(0,t.k6)((function(){return[(0,t.bF)(H,{title:"查看代码",name:"2"},{default:(0,t.k6)((function(){return[(0,t.Lk)("div",A,(0,a.v_)(z.showStops),1)]})),_:1})]})),_:1})]})),_:1}),(0,t.bF)(K,{class:"box-card",style:{"margin-bottom":"50px"}},{default:(0,t.k6)((function(){return[y,(0,t.bF)(G,null,{default:(0,t.k6)((function(){return[(0,t.Lk)("template",null,[(0,t.Lk)("div",C,[(0,t.bF)(D,{modelValue:z.value8,"onUpdate:modelValue":e[7]||(e[7]=function(n){return z.value8=n}),"show-input":""},null,8,["modelValue"])])])]})),_:1}),(0,t.bF)(J,null,{default:(0,t.k6)((function(){return[(0,t.bF)(H,{title:"查看代码",name:"2"},{default:(0,t.k6)((function(){return[(0,t.Lk)("div",U,(0,a.v_)(z.showInput),1)]})),_:1})]})),_:1})]})),_:1}),(0,t.bF)(K,{class:"box-card",style:{"margin-bottom":"50px"}},{default:(0,t.k6)((function(){return[T,(0,t.bF)(G,null,{default:(0,t.k6)((function(){return[(0,t.Lk)("template",null,[(0,t.Lk)("div",S,[(0,t.bF)(D,{modelValue:z.value9,"onUpdate:modelValue":e[8]||(e[8]=function(n){return z.value9=n}),range:"","show-stops":"",max:10},null,8,["modelValue"])])])]})),_:1}),(0,t.bF)(J,null,{default:(0,t.k6)((function(){return[(0,t.bF)(H,{title:"查看代码",name:"2"},{default:(0,t.k6)((function(){return[(0,t.Lk)("div",E,(0,a.v_)(z.range),1)]})),_:1})]})),_:1})]})),_:1}),(0,t.bF)(K,{class:"box-card",style:{"margin-bottom":"50px"}},{default:(0,t.k6)((function(){return[I,(0,t.bF)(G,null,{default:(0,t.k6)((function(){return[(0,t.Lk)("template",null,[(0,t.Lk)("div",$,[(0,t.bF)(D,{modelValue:z.value10,"onUpdate:modelValue":e[9]||(e[9]=function(n){return z.value10=n}),vertical:"",height:"200px"},null,8,["modelValue"])])])]})),_:1}),(0,t.bF)(J,null,{default:(0,t.k6)((function(){return[(0,t.bF)(H,{title:"查看代码",name:"2"},{default:(0,t.k6)((function(){return[(0,t.Lk)("div",j,(0,a.v_)(z.vertical),1)]})),_:1})]})),_:1})]})),_:1}),(0,t.bF)(K,{class:"box-card",style:{"margin-bottom":"50px"}},{default:(0,t.k6)((function(){return[Q,(0,t.bF)(G,null,{default:(0,t.k6)((function(){return[(0,t.Lk)("template",null,[(0,t.Lk)("div",X,[(0,t.bF)(D,{modelValue:z.value11,"onUpdate:modelValue":e[10]||(e[10]=function(n){return z.value11=n}),range:"",marks:z.marks},null,8,["modelValue","marks"])])])]})),_:1}),(0,t.bF)(J,null,{default:(0,t.k6)((function(){return[(0,t.bF)(H,{title:"查看代码",name:"2"},{default:(0,t.k6)((function(){return[(0,t.Lk)("div",q,(0,a.v_)(z.marksCode),1)]})),_:1})]})),_:1})]})),_:1})])])}var B=l(23772),D={name:"",components:{},data:function(){var n;return n={marksCode:"\n<template>\n <div class=\"block\">\n <el-slider\n v-model=\"value\"\n range\n :marks=\"marks\">\n </el-slider>\n </div>\n</template>\n\n<script>\n export default {\n data() {\n return {\n value: [30, 60],\n marks: {\n 0: '0°C',\n 8: '8°C',\n 37: '37°C',\n 50: {\n style: {\n color: '#1989FA'\n },\n label: this.$createElement('strong', '50%')\n }\n }\n }\n }\n }\n<\/script>",vertical:'\n<template>\n <div class="block">\n <el-slider\n v-model="value"\n vertical\n height="200px">\n </el-slider>\n </div>\n</template>\n\n<script>\n export default {\n data() {\n return {\n value: 0\n }\n }\n }\n<\/script>',range:'\n<template>\n <div class="block">\n <el-slider\n v-model="value"\n range\n show-stops\n :max="10">\n </el-slider>\n </div>\n</template>\n\n<script>\n export default {\n data() {\n return {\n value: [4, 8]\n }\n }\n }\n<\/script>',showInput:'\n<template>\n <div class="block">\n <el-slider\n v-model="value"\n show-input>\n </el-slider>\n </div>\n</template>\n\n<script>\n export default {\n data() {\n return {\n value: 0\n }\n }\n }\n<\/script>',showStops:"",base:'\n<template>\n <div class="block">\n <span class="demonstration">默认</span>\n <el-slider v-model="value1"></el-slider>\n </div>\n <div class="block">\n <span class="demonstration">自定义初始值</span>\n <el-slider v-model="value2"></el-slider>\n </div>\n <div class="block">\n <span class="demonstration">隐藏 Tooltip</span>\n <el-slider v-model="value3" :show-tooltip="false"></el-slider>\n </div>\n <div class="block">\n <span class="demonstration">格式化 Tooltip</span>\n <el-slider v-model="value4" :format-tooltip="formatTooltip"></el-slider>\n </div>\n <div class="block">\n <span class="demonstration">禁用</span>\n <el-slider v-model="value5" disabled></el-slider>\n </div>\n</template>\n\n<script>\n export default {\n data() {\n return {\n value1: 0,\n value2: 50,\n value3: 36,\n value4: 48,\n value5: 42\n }\n },\n methods: {\n formatTooltip(val) {\n return val / 100;\n }\n }\n }\n<\/script>'},(0,B.A)((0,B.A)((0,B.A)((0,B.A)((0,B.A)((0,B.A)((0,B.A)((0,B.A)((0,B.A)((0,B.A)(n,"showStops",'\n<template>\n <div class="block">\n <span class="demonstration">不显示间断点</span>\n <el-slider\n v-model="value1"\n :step="10">\n </el-slider>\n </div>\n <div class="block">\n <span class="demonstration">显示间断点</span>\n <el-slider\n v-model="value2"\n :step="10"\n show-stops>\n </el-slider>\n </div>\n</template>\n\n<script>\n export default {\n data() {\n return {\n value1: 0,\n value2: 0\n }\n }\n }\n<\/script>'),"value1",0),"value2",50),"value3",36),"value4",48),"value5",42),"value6",0),"value7",0),"value8",0),"value9",[4,8]),(0,B.A)((0,B.A)((0,B.A)(n,"value10",0),"value11",[30,60]),"marks",{0:"0°C",8:"8°C",37:"37°C",50:{style:{color:"#1989FA"},label:this.$createElement("strong","50%")}})},computed:{},watch:{},mounted:function(){this.init()},methods:{init:function(){},formatTooltip:function(n){return n/100}}},G=l(66262);const H=(0,G.A)(D,[["render",z],["__scopeId","data-v-48a9887e"]]);var J=H}}]);
|
