no message
Former-commit-id: 8ff8a8111a9bd3f05c94c68d22954772767f2e92 Former-commit-id: b2b7fa01dd87535a3374180f365d3c4a96323434 Former-commit-id: 8b184918d2177a0b6262790a114cca89edc7f5b9
This commit is contained in:
@@ -1 +1 @@
|
|||||||
d22b6dcdd003a008903fbb724373ac10b4e3a0f8
|
822e9d488a148a997d7098a0608f482ab9f9fb7a
|
||||||
@@ -55,19 +55,31 @@ export default {
|
|||||||
readText () {
|
readText () {
|
||||||
clipboard.readText().then((res) => {
|
clipboard.readText().then((res) => {
|
||||||
console.log(res)
|
console.log(res)
|
||||||
this.$Message.success('读取成功 返回结果请查看控制台')
|
this.$message({
|
||||||
|
message: '读取成功 返回结果请查看控制台',
|
||||||
|
type: 'success'
|
||||||
|
})
|
||||||
}, (err) => {
|
}, (err) => {
|
||||||
console.log(err)
|
console.log(err)
|
||||||
this.$Message.error('错误信息已经打印到控制台')
|
this.$message({
|
||||||
|
message: '错误信息已经打印到控制台',
|
||||||
|
type: 'error'
|
||||||
|
})
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
read () {
|
read () {
|
||||||
clipboard.read().then((res) => {
|
clipboard.read().then((res) => {
|
||||||
console.log(res)
|
console.log(res)
|
||||||
this.$Message.success('读取成功 返回结果请查看控制台')
|
this.$message({
|
||||||
|
message: '读取成功 返回结果请查看控制台',
|
||||||
|
type: 'success'
|
||||||
|
})
|
||||||
}, (err) => {
|
}, (err) => {
|
||||||
console.log(err)
|
console.log(err)
|
||||||
this.$Message.error('错误信息已经打印到控制台')
|
this.$message({
|
||||||
|
message: '错误信息已经打印到控制台',
|
||||||
|
type: 'error'
|
||||||
|
})
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
67
src/pages/demo/plugins/font-awesome/components/IconCell.vue
Normal file
67
src/pages/demo/plugins/font-awesome/components/IconCell.vue
Normal file
@@ -0,0 +1,67 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<el-popover
|
||||||
|
ref="pop"
|
||||||
|
placement="right"
|
||||||
|
:title="icon"
|
||||||
|
width="300"
|
||||||
|
trigger="hover">
|
||||||
|
<div class="icon-group">
|
||||||
|
<span :class="'fa fa-' + icon"></span>
|
||||||
|
</div>
|
||||||
|
<el-row :gutter="10">
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-tooltip effect="dark" :content="iconClass" placement="top">
|
||||||
|
<el-button @click="copy(iconClass)" style="width: 100%;">复制Class</el-button>
|
||||||
|
</el-tooltip>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-tooltip effect="dark" :content="iconHtml" placement="top">
|
||||||
|
<el-button @click="copy(iconHtml)" style="width: 100%;">复制HTML</el-button>
|
||||||
|
</el-tooltip>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</el-popover>
|
||||||
|
<el-tag type="info" v-popover:pop>
|
||||||
|
<span :class="'fa fa-' + icon"></span>
|
||||||
|
</el-tag>
|
||||||
|
<span style="font-size: 10px;">{{icon}}</span>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import clipboard from 'clipboard-polyfill'
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
icon: {
|
||||||
|
type: String,
|
||||||
|
required: false,
|
||||||
|
default: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
iconClass () {
|
||||||
|
return `fa fa-${this.icon}`
|
||||||
|
},
|
||||||
|
iconHtml () {
|
||||||
|
return `<i class="fa fa-${this.icon}"></i>`
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
copy (text) {
|
||||||
|
clipboard.writeText(text)
|
||||||
|
this.$message({
|
||||||
|
message: `${text} 复制到剪贴板`,
|
||||||
|
type: 'success'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.icon-group {
|
||||||
|
text-align: center;
|
||||||
|
font-size: 100px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -1,17 +1,19 @@
|
|||||||
<template>
|
<template>
|
||||||
<Container type="ghost">
|
<Container type="ghost">
|
||||||
<el-card v-for="(item, index) in icon" :key="index" :class="index === icon.length - 1 ? '' : 'dd-mb'">
|
<el-card>
|
||||||
<template slot="header">{{item.title}}</template>
|
<template slot="header">
|
||||||
|
<el-radio-group v-model="showIndex" size="mini">
|
||||||
|
<el-radio-button
|
||||||
|
v-for="(item, index) in radioOptions"
|
||||||
|
:key="index"
|
||||||
|
:label="item.value">
|
||||||
|
{{item.label}}
|
||||||
|
</el-radio-button>
|
||||||
|
</el-radio-group>
|
||||||
|
</template>
|
||||||
<el-row style="margin: -10px;">
|
<el-row style="margin: -10px;">
|
||||||
<el-col
|
<el-col v-for="(iconItem, iconIndex) in iconShow.icon" :key="iconIndex" :span="6" class="dd-p-10">
|
||||||
v-for="(iconItem, iconIndex) in item.icon"
|
<IconCell :icon="iconItem"></IconCell>
|
||||||
:key="iconIndex"
|
|
||||||
:span="6"
|
|
||||||
class="dd-p-10">
|
|
||||||
<el-tag type="info">
|
|
||||||
<span :class="'fa fa-' + iconItem"></span>
|
|
||||||
</el-tag>
|
|
||||||
<span style="font-size: 10px;">{{iconItem}}</span>
|
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
</el-card>
|
</el-card>
|
||||||
@@ -20,10 +22,26 @@
|
|||||||
|
|
||||||
<script>
|
<script>
|
||||||
import icon from '@/assets/library/font-awesome-4.7.0-icon/icon.js'
|
import icon from '@/assets/library/font-awesome-4.7.0-icon/icon.js'
|
||||||
|
import IconCell from './components/IconCell'
|
||||||
export default {
|
export default {
|
||||||
|
components: {
|
||||||
|
IconCell
|
||||||
|
},
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
icon
|
icon,
|
||||||
|
showIndex: 0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
iconShow () {
|
||||||
|
return this.icon[this.showIndex]
|
||||||
|
},
|
||||||
|
radioOptions () {
|
||||||
|
return this.icon.map((e, index) => ({
|
||||||
|
label: e.title,
|
||||||
|
value: index
|
||||||
|
}))
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -26,26 +26,26 @@ export default {
|
|||||||
methods: {
|
methods: {
|
||||||
set (name = 'default-name', value = 'default-value') {
|
set (name = 'default-name', value = 'default-value') {
|
||||||
Cookies.set(name, value)
|
Cookies.set(name, value)
|
||||||
this.$Message.info(`设置数据 ${name} = ${value}`)
|
this.$message.info(`设置数据 ${name} = ${value}`)
|
||||||
},
|
},
|
||||||
setExpires (name = 'default-name', value = 'default-value', expires = 1) {
|
setExpires (name = 'default-name', value = 'default-value', expires = 1) {
|
||||||
Cookies.set(name, value, {
|
Cookies.set(name, value, {
|
||||||
expires
|
expires
|
||||||
})
|
})
|
||||||
this.$Message.info(`设置数据 ${name} = ${value} 有效期 ${expires} 天`)
|
this.$message.info(`设置数据 ${name} = ${value} 有效期 ${expires} 天`)
|
||||||
},
|
},
|
||||||
get (name = 'default-name') {
|
get (name = 'default-name') {
|
||||||
const value = Cookies.get(name)
|
const value = Cookies.get(name)
|
||||||
this.$Message.info(`获取数据 ${name} = ${value}`)
|
this.$message.info(`获取数据 ${name} = ${value}`)
|
||||||
},
|
},
|
||||||
getAll () {
|
getAll () {
|
||||||
const value = Cookies.get()
|
const value = Cookies.get()
|
||||||
console.log(value)
|
console.log(value)
|
||||||
this.$Message.info('结果已经打印到控制台')
|
this.$message.info('结果已经打印到控制台')
|
||||||
},
|
},
|
||||||
remove (name = 'default-name') {
|
remove (name = 'default-name') {
|
||||||
Cookies.remove(name)
|
Cookies.remove(name)
|
||||||
this.$Message.info(`删除数据 ${name}`)
|
this.$message.info(`删除数据 ${name}`)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -24,7 +24,7 @@ import Vue from 'vue'
|
|||||||
import clone from '@/assets/library/tool/clone.js'
|
import clone from '@/assets/library/tool/clone.js'
|
||||||
import Mock from 'mockjs'
|
import Mock from 'mockjs'
|
||||||
import settingDPD from './data/settingDPD'
|
import settingDPD from './data/settingDPD'
|
||||||
import MockDemoCard from './componnets/MockDemoCard'
|
import MockDemoCard from './components/MockDemoCard'
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
MockDemoCard
|
MockDemoCard
|
||||||
|
|||||||
@@ -36,7 +36,7 @@ import Vue from 'vue'
|
|||||||
import clone from '@/assets/library/tool/clone.js'
|
import clone from '@/assets/library/tool/clone.js'
|
||||||
import Mock from 'mockjs'
|
import Mock from 'mockjs'
|
||||||
import settingDTD from './data/settingDTD'
|
import settingDTD from './data/settingDTD'
|
||||||
import MockDemoCard from './componnets/MockDemoCard'
|
import MockDemoCard from './components/MockDemoCard'
|
||||||
// mixin
|
// mixin
|
||||||
import regexp from './mixins/regexp'
|
import regexp from './mixins/regexp'
|
||||||
import fn from './mixins/function'
|
import fn from './mixins/function'
|
||||||
|
|||||||
Reference in New Issue
Block a user