no message

Former-commit-id: 8ff8a8111a9bd3f05c94c68d22954772767f2e92
Former-commit-id: b2b7fa01dd87535a3374180f365d3c4a96323434
Former-commit-id: 8b184918d2177a0b6262790a114cca89edc7f5b9
This commit is contained in:
李杨
2018-01-17 11:16:31 +08:00
parent e319fc9bb4
commit 72efd344db
8 changed files with 121 additions and 24 deletions

View File

@@ -1 +1 @@
d22b6dcdd003a008903fbb724373ac10b4e3a0f8 822e9d488a148a997d7098a0608f482ab9f9fb7a

View File

@@ -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'
})
}) })
} }
} }

View 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>

View File

@@ -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
}))
} }
} }
} }

View File

@@ -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}`)
} }
} }
} }

View File

@@ -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

View File

@@ -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'