"use strict";(self["webpackChunklin_cms_vue"]=self["webpackChunklin_cms_vue"]||[]).push([[4214],{44214:function(n,t,e){e.r(t),e.d(t,{default:function(){return v}});var l=e(20641),i=e(90033);const o=n=>((0,l.Qi)("data-v-006d7503"),n=n(),(0,l.jt)(),n),s={class:"lin-container"},a=o((()=>(0,l.Lk)("div",{class:"lin-title"},"Notification 通知",-1))),p={class:"lin-wrap-ui"},u=o((()=>(0,l.Lk)("div",null,[(0,l.Lk)("span",null,"基础用法")],-1))),k={style:{"white-space":"pre-wrap"}},c=o((()=>(0,l.Lk)("div",null,[(0,l.Lk)("span",null,"带有倾向性")],-1))),d={style:{"white-space":"pre-wrap"}},r=o((()=>(0,l.Lk)("div",null,[(0,l.Lk)("span",null,"自定义弹出位置")],-1))),f={style:{"white-space":"pre-wrap"}},m=o((()=>(0,l.Lk)("div",null,[(0,l.Lk)("span",null,"带有偏移")],-1))),b={style:{"white-space":"pre-wrap"}},h=o((()=>(0,l.Lk)("div",null,[(0,l.Lk)("span",null,"使用 HTML 片段")],-1))),g={style:{"white-space":"pre-wrap"}};function y(n,t,e,o,y,_){const L=(0,l.g2)("el-button"),F=(0,l.g2)("el-row"),v=(0,l.g2)("el-collapse-item"),C=(0,l.g2)("el-collapse"),$=(0,l.g2)("el-card");return(0,l.uX)(),(0,l.CE)("div",s,[a,(0,l.Lk)("div",p,[(0,l.bF)($,{style:{"margin-bottom":"50px"}},{header:(0,l.k6)((()=>[u])),default:(0,l.k6)((()=>[(0,l.bF)(F,null,{default:(0,l.k6)((()=>[(0,l.Lk)("div",null,[(0,l.Lk)("template",null,[(0,l.bF)(L,{plain:"",onClick:_.open1},{default:(0,l.k6)((()=>[(0,l.eW)(" 可自动关闭 ")])),_:1},8,["onClick"]),(0,l.bF)(L,{plain:"",onClick:_.open2},{default:(0,l.k6)((()=>[(0,l.eW)(" 不会自动关闭 ")])),_:1},8,["onClick"])])])])),_:1}),(0,l.bF)(C,null,{default:(0,l.k6)((()=>[(0,l.bF)(v,{title:"查看代码",name:"2"},{default:(0,l.k6)((()=>[(0,l.Lk)("div",k,(0,i.v_)(y.base),1)])),_:1})])),_:1})])),_:1}),(0,l.bF)($,{style:{"margin-bottom":"50px"}},{header:(0,l.k6)((()=>[c])),default:(0,l.k6)((()=>[(0,l.bF)(F,null,{default:(0,l.k6)((()=>[(0,l.Lk)("div",null,[(0,l.Lk)("template",null,[(0,l.bF)(L,{plain:"",onClick:_.open3},{default:(0,l.k6)((()=>[(0,l.eW)(" 成功 ")])),_:1},8,["onClick"]),(0,l.bF)(L,{plain:"",onClick:_.open4},{default:(0,l.k6)((()=>[(0,l.eW)(" 警告 ")])),_:1},8,["onClick"]),(0,l.bF)(L,{plain:"",onClick:_.open5},{default:(0,l.k6)((()=>[(0,l.eW)(" 消息 ")])),_:1},8,["onClick"]),(0,l.bF)(L,{plain:"",onClick:_.open6},{default:(0,l.k6)((()=>[(0,l.eW)(" 错误 ")])),_:1},8,["onClick"])])])])),_:1}),(0,l.bF)(C,{class:"test",style:{color:"red"}},{default:(0,l.k6)((()=>[(0,l.bF)(v,{title:"查看代码",name:"2"},{default:(0,l.k6)((()=>[(0,l.Lk)("div",d,(0,i.v_)(y.type),1)])),_:1})])),_:1})])),_:1}),(0,l.bF)($,{style:{"margin-bottom":"50px"}},{header:(0,l.k6)((()=>[r])),default:(0,l.k6)((()=>[(0,l.bF)(F,null,{default:(0,l.k6)((()=>[(0,l.Lk)("div",null,[(0,l.Lk)("template",null,[(0,l.bF)(L,{plain:"",onClick:_.open7},{default:(0,l.k6)((()=>[(0,l.eW)(" 右上角 ")])),_:1},8,["onClick"]),(0,l.bF)(L,{plain:"",onClick:_.open8},{default:(0,l.k6)((()=>[(0,l.eW)(" 右下角 ")])),_:1},8,["onClick"]),(0,l.bF)(L,{plain:"",onClick:_.open9},{default:(0,l.k6)((()=>[(0,l.eW)(" 左下角 ")])),_:1},8,["onClick"]),(0,l.bF)(L,{plain:"",onClick:_.open10},{default:(0,l.k6)((()=>[(0,l.eW)(" 左上角 ")])),_:1},8,["onClick"])])])])),_:1}),(0,l.bF)(C,{class:"test",style:{color:"red"}},{default:(0,l.k6)((()=>[(0,l.bF)(v,{title:"查看代码",name:"2"},{default:(0,l.k6)((()=>[(0,l.Lk)("div",f,(0,i.v_)(y.position),1)])),_:1})])),_:1})])),_:1}),(0,l.bF)($,{style:{"margin-bottom":"50px"}},{header:(0,l.k6)((()=>[m])),default:(0,l.k6)((()=>[(0,l.bF)(F,null,{default:(0,l.k6)((()=>[(0,l.Lk)("div",null,[(0,l.Lk)("template",null,[(0,l.bF)(L,{plain:"",onClick:_.open},{default:(0,l.k6)((()=>[(0,l.eW)(" 偏移的消息 ")])),_:1},8,["onClick"])])])])),_:1}),(0,l.bF)(C,null,{default:(0,l.k6)((()=>[(0,l.bF)(v,{title:"查看代码",name:"2"},{default:(0,l.k6)((()=>[(0,l.Lk)("div",b,(0,i.v_)(y.offset),1)])),_:1})])),_:1})])),_:1}),(0,l.bF)($,{style:{"margin-bottom":"50px"}},{header:(0,l.k6)((()=>[h])),default:(0,l.k6)((()=>[(0,l.bF)(F,null,{default:(0,l.k6)((()=>[(0,l.Lk)("div",null,[(0,l.Lk)("template",null,[(0,l.bF)(L,{plain:"",onClick:_.open11},{default:(0,l.k6)((()=>[(0,l.eW)(" 使用 HTML 片段 ")])),_:1},8,["onClick"])])])])),_:1}),(0,l.bF)(C,null,{default:(0,l.k6)((()=>[(0,l.bF)(v,{title:"查看代码",name:"2"},{default:(0,l.k6)((()=>[(0,l.Lk)("div",g,(0,i.v_)(y.dangerouslyUseHTMLString),1)])),_:1})])),_:1})])),_:1})])])}var _={name:"LinCmsUiButton",components:{},data(){return{base:" \n <template>\n <el-button\n plain\n @click=\"open1\">\n 可自动关闭\n </el-button>\n <el-button\n plain\n @click=\"open2\">\n 不会自动关闭\n </el-button>\n </template>\n\n <script>\n export default {\n methods: {\n open1() {\n const h = this.$createElement;\n this.$notify({\n title: '标题名称',\n message: h('i', { style: 'color: teal'}, '这是提示文案这是提示文案这是提示文案这是提示文案这是提示文案这是提示文案这是提示文案这是提示文案')\n });\n },\n\n open2() {\n this.$notify({\n title: '提示',\n message: '这是一条不会自动关闭的消息',\n duration: 0\n });\n }\n }\n }\n <\/script>",type:"\n <template>\n <el-button\n plain\n @click=\"open1\">\n 成功\n </el-button>\n <el-button\n plain\n @click=\"open2\">\n 警告\n </el-button>\n <el-button\n plain\n @click=\"open3\">\n 消息\n </el-button>\n <el-button\n plain\n @click=\"open4\">\n 错误\n </el-button>\n </template>\n <script>\n export default {\n methods: {\n open1() {\n this.$notify({\n title: '成功',\n message: '这是一条成功的提示消息',\n type: 'success'\n });\n },\n\n open2() {\n this.$notify({\n title: '警告',\n message: '这是一条警告的提示消息',\n type: 'warning'\n });\n },\n\n open3() {\n this.$notify.info({\n title: '消息',\n message: '这是一条消息的提示消息'\n });\n },\n\n open4() {\n this.$notify.error({\n title: '错误',\n message: '这是一条错误的提示消息'\n });\n }\n }\n }\n <\/script>",position:"\n <template>\n <el-button\n plain\n @click=\"open1\">\n 右上角\n </el-button>\n <el-button\n plain\n @click=\"open2\">\n 右下角\n </el-button>\n <el-button\n plain\n @click=\"open3\">\n 左下角\n </el-button>\n <el-button\n plain\n @click=\"open4\">\n 左上角\n </el-button>\n </template>\n <script>\n export default {\n methods: {\n open1() {\n this.$notify({\n title: '自定义位置',\n message: '右上角弹出的消息'\n });\n },\n\n open2() {\n this.$notify({\n title: '自定义位置',\n message: '右下角弹出的消息',\n position: 'bottom-right'\n });\n },\n\n open3() {\n this.$notify({\n title: '自定义位置',\n message: '左下角弹出的消息',\n position: 'bottom-left'\n });\n },\n\n open4() {\n this.$notify({\n title: '自定义位置',\n message: '左上角弹出的消息',\n position: 'top-left'\n });\n }\n }\n }\n <\/script>",offset:"\n <template>\n <el-button\n plain\n @click=\"open\">\n 偏移的消息\n </el-button>\n </template>\n <script>\n export default {\n methods: {\n open() {\n this.$notify({\n title: '偏移',\n message: '这是一条带有偏移的提示消息',\n offset: 100\n });\n }\n }\n }\n <\/script>",dangerouslyUseHTMLString:"\n <template>\n <el-button\n plain\n @click=\"open\">\n 使用 HTML 片段\n </el-button>\n </template>\n <script>\n export default {\n methods: {\n open() {\n this.$notify({\n title: 'HTML 片段',\n dangerouslyUseHTMLString: true,\n message: '<strong>这是 <i>HTML</i> 片段</strong>'\n });\n }\n }\n }\n <\/script>"}},computed:{},watch:{},mounted(){this.init()},methods:{open(){this.$notify({title:"偏移",message:"这是一条带有偏移的提示消息",offset:100})},open1(){const n=this.$createElement;this.$notify({title:"标题名称",message:n("i",{style:"color: #3963BC"},"这是提示文案这是提示文案这是提示文案这是提示文案这是提示文案这是提示文案这是提示文案这是提示文案")})},open2(){this.$notify({title:"提示",message:"这是一条不会自动关闭的消息",duration:0})},open3(){this.$notify({title:"成功",message:"这是一条成功的提示消息",type:"success"})},open4(){this.$notify({title:"警告",message:"这是一条警告的提示消息",type:"warning"})},open5(){this.$notify.info({title:"消息",message:"这是一条消息的提示消息"})},open6(){this.$notify.error({title:"错误",message:"这是一条错误的提示消息"})},open7(){this.$notify({title:"自定义位置",message:"右上角弹出的消息"})},open8(){this.$notify({title:"自定义位置",message:"右下角弹出的消息",position:"bottom-right"})},open9(){this.$notify({title:"自定义位置",message:"左下角弹出的消息",position:"bottom-left"})},open10(){this.$notify({title:"自定义位置",message:"左上角弹出的消息",position:"top-left"})},open11(){this.$notify({title:"HTML 片段",dangerouslyUseHTMLString:!0,message:"<strong>这是 <i>HTML</i> 片段</strong>"})},init(){}}},L=e(66262);const F=(0,L.A)(_,[["render",y],["__scopeId","data-v-006d7503"]]);var v=F}}]);
|
