added ESlint 语法检测

This commit is contained in:
何秀钢
2021-06-02 14:11:45 +08:00
parent 3932a8fbf3
commit 2f0465a1a1
94 changed files with 5031 additions and 4790 deletions
@@ -1,48 +1,44 @@
<template>
<div>
<div style="width: 100%">
<APlayer :audio="audio"></APlayer>
</div>
<div>
<div style="width: 100%">
<APlayer :audio="audio" />
</div>
</div>
</template>
<script>
import { APlayer } from '@moefe/vue-aplayer';
export default {
name: "musicPlayer",
components:{
APlayer
import { APlayer } from '@moefe/vue-aplayer'
export default {
name: 'MusicPlayer',
components: {
APlayer
},
data() {
return {
audio: [
{
name: '东西(Cover:林俊呈)',
artist: '纳豆',
url: 'http://music.163.com/song/media/outer/url?id=1321594530.mp3',
cover: 'https://p1.music.126.net/5zs7IvmLv7KahY3BFzUmrg==/109951163635241613.jpg?param=300y300', // prettier-ignore
lrc: 'https://cdn.moefe.org/music/lrc/thing.lrc'
},
data(){
return {
audio :[
{
name: '东西(Cover:林俊呈)',
artist: '纳豆',
url: 'http://music.163.com/song/media/outer/url?id=1321594530.mp3',
cover: 'https://p1.music.126.net/5zs7IvmLv7KahY3BFzUmrg==/109951163635241613.jpg?param=300y300', // prettier-ignore
lrc: 'https://cdn.moefe.org/music/lrc/thing.lrc',
},
{
name: '响喜乱舞(Cover:MARiA)',
artist: '泠鸢yousa',
url: 'http://music.163.com/song/media/outer/url?id=1318962459.mp3',
cover: 'https://p1.music.126.net/AUGVPQ_rVrngDH9ocQrn3Q==/109951163613037822.jpg?param=300y300', // prettier-ignore
lrc: 'https://cdn.moefe.org/music/lrc/kyoukiranbu.lrc',
},
{
name: '啵唧',
artist: 'Hanser',
url: 'http://music.163.com/song/media/outer/url?id=1321424246.mp3',
cover: 'https://p1.music.126.net/K0-IPcIQ9QFvA0jXTBqoWQ==/109951163636756693.jpg?param=300y300', // prettier-ignore
lrc: 'https://cdn.moefe.org/music/lrc/kiss.lrc',
},
]
}
{
name: '响喜乱舞(Cover:MARiA)',
artist: '泠鸢yousa',
url: 'http://music.163.com/song/media/outer/url?id=1318962459.mp3',
cover: 'https://p1.music.126.net/AUGVPQ_rVrngDH9ocQrn3Q==/109951163613037822.jpg?param=300y300', // prettier-ignore
lrc: 'https://cdn.moefe.org/music/lrc/kyoukiranbu.lrc'
},
{
name: '啵唧',
artist: 'Hanser',
url: 'http://music.163.com/song/media/outer/url?id=1321424246.mp3',
cover: 'https://p1.music.126.net/K0-IPcIQ9QFvA0jXTBqoWQ==/109951163636756693.jpg?param=300y300', // prettier-ignore
lrc: 'https://cdn.moefe.org/music/lrc/kiss.lrc'
}
]
}
}
}
</script>
<style scoped>
</style>
@@ -1,81 +1,81 @@
<template>
<li :class="{ completed: todo.done, editing: editing }" class="todo">
<div class="view">
<input
:checked="todo.done"
class="toggle"
type="checkbox"
@change="toggleTodo( todo)"
>
<label @dblclick="editing = true" v-text="todo.text" />
<button class="destroy" @click="deleteTodo( todo )" />
</div>
<input
v-show="editing"
v-focus="editing"
:value="todo.text"
class="edit"
@keyup.enter="doneEdit"
@keyup.esc="cancelEdit"
@blur="doneEdit"
>
</li>
<li :class="{ completed: todo.done, editing: editing }" class="todo">
<div class="view">
<input
:checked="todo.done"
class="toggle"
type="checkbox"
@change="toggleTodo( todo)"
>
<label @dblclick="editing = true" v-text="todo.text" />
<button class="destroy" @click="deleteTodo( todo )" />
</div>
<input
v-show="editing"
v-focus="editing"
:value="todo.text"
class="edit"
@keyup.enter="doneEdit"
@keyup.esc="cancelEdit"
@blur="doneEdit"
>
</li>
</template>
<script>
export default {
name: 'Todo',
directives: {
focus(el, { value }, { context }) {
if (value) {
context.$nextTick(() => {
el.focus()
})
}
}
},
props: {
todo: {
type: Object,
default: function() {
return {}
}
}
},
data() {
return {
editing: false
}
},
methods: {
deleteTodo(todo) {
this.$emit('deleteTodo', todo)
},
editTodo({ todo, value }) {
this.$emit('editTodo', { todo, value })
},
toggleTodo(todo) {
this.$emit('toggleTodo', todo)
},
doneEdit(e) {
const value = e.target.value.trim()
const { todo } = this
if (!value) {
this.deleteTodo({
todo
})
} else if (this.editing) {
this.editTodo({
todo,
value
})
this.editing = false
}
},
cancelEdit(e) {
e.target.value = this.todo.text
this.editing = false
}
}
export default {
name: 'Todo',
directives: {
focus(el, { value }, { context }) {
if (value) {
context.$nextTick(() => {
el.focus()
})
}
}
},
props: {
todo: {
type: Object,
default: function() {
return {}
}
}
},
data() {
return {
editing: false
}
},
methods: {
deleteTodo(todo) {
this.$emit('deleteTodo', todo)
},
editTodo({ todo, value }) {
this.$emit('editTodo', { todo, value })
},
toggleTodo(todo) {
this.$emit('toggleTodo', todo)
},
doneEdit(e) {
const value = e.target.value.trim()
const { todo } = this
if (!value) {
this.deleteTodo({
todo
})
} else if (this.editing) {
this.editTodo({
todo,
value
})
this.editing = false
}
},
cancelEdit(e) {
e.target.value = this.todo.text
this.editing = false
}
}
}
</script>
@@ -1,120 +1,120 @@
<template>
<section class="todoapp">
<!-- header -->
<header class="header">
<input class="new-todo" autocomplete="off" placeholder="Todo List" @keyup.enter="addTodo">
</header>
<!-- main section -->
<section v-show="todos.length" class="main">
<input id="toggle-all" :checked="allChecked" class="toggle-all" type="checkbox" @change="toggleAll({ done: !allChecked })">
<label for="toggle-all" />
<ul class="todo-list">
<todo
v-for="(todo, index) in filteredTodos"
:key="index"
:todo="todo"
@toggleTodo="toggleTodo"
@editTodo="editTodo"
@deleteTodo="deleteTodo"
/>
</ul>
</section>
<!-- footer -->
<footer v-show="todos.length" class="footer">
<section class="todoapp">
<!-- header -->
<header class="header">
<input class="new-todo" autocomplete="off" placeholder="Todo List" @keyup.enter="addTodo">
</header>
<!-- main section -->
<section v-show="todos.length" class="main">
<input id="toggle-all" :checked="allChecked" class="toggle-all" type="checkbox" @change="toggleAll({ done: !allChecked })">
<label for="toggle-all" />
<ul class="todo-list">
<todo
v-for="(todo, index) in filteredTodos"
:key="index"
:todo="todo"
@toggleTodo="toggleTodo"
@editTodo="editTodo"
@deleteTodo="deleteTodo"
/>
</ul>
</section>
<!-- footer -->
<footer v-show="todos.length" class="footer">
<span class="todo-count">
<strong>{{ remaining }}</strong>
{{ remaining | pluralize('item') }} left
</span>
<ul class="filters">
<li v-for="(val, key) in filters" :key="key">
<a :class="{ selected: visibility === key }" @click.prevent="visibility = key">{{ key | capitalize }}</a>
</li>
</ul>
<!-- <button class="clear-completed" v-show="todos.length > remaining" @click="clearCompleted">
Clear completed
</button> -->
</footer>
</section>
<ul class="filters">
<li v-for="(val, key) in filters" :key="key">
<a :class="{ selected: visibility === key }" @click.prevent="visibility = key">{{ key | capitalize }}</a>
</li>
</ul>
<!-- <button class="clear-completed" v-show="todos.length > remaining" @click="clearCompleted">
Clear completed
</button> -->
</footer>
</section>
</template>
<script>
import Todo from './Todo.vue'
import Todo from './Todo.vue'
const STORAGE_KEY = 'todos'
const filters = {
all: todos => todos,
active: todos => todos.filter(todo => !todo.done),
completed: todos => todos.filter(todo => todo.done)
const STORAGE_KEY = 'todos'
const filters = {
all: todos => todos,
active: todos => todos.filter(todo => !todo.done),
completed: todos => todos.filter(todo => todo.done)
}
const defaultList = [
{ text: '工作流功能绘制工具', done: false },
{ text: '工作流流转方法', done: false },
{ text: '自动化代码优化', done: false }
]
export default {
components: { Todo },
filters: {
pluralize: (n, w) => n === 1 ? w : w + 's',
capitalize: s => s.charAt(0).toUpperCase() + s.slice(1)
},
data() {
return {
visibility: 'all',
filters,
// todos: JSON.parse(window.localStorage.getItem(STORAGE_KEY)) || defaultList
todos: defaultList
}
const defalutList = [
{ text: '工作流功能绘制工具', done: false },
{ text: '工作流流转方法', done: false },
{ text: '自动化代码优化', done: false }
]
export default {
components: { Todo },
filters: {
pluralize: (n, w) => n === 1 ? w : w + 's',
capitalize: s => s.charAt(0).toUpperCase() + s.slice(1)
},
data() {
return {
visibility: 'all',
filters,
// todos: JSON.parse(window.localStorage.getItem(STORAGE_KEY)) || defalutList
todos: defalutList
}
},
computed: {
allChecked() {
return this.todos.every(todo => todo.done)
},
filteredTodos() {
return filters[this.visibility](this.todos)
},
remaining() {
return this.todos.filter(todo => !todo.done).length
}
},
methods: {
setLocalStorage() {
window.localStorage.setItem(STORAGE_KEY, JSON.stringify(this.todos))
},
addTodo(e) {
const text = e.target.value
if (text.trim()) {
this.todos.push({
text,
done: false
})
this.setLocalStorage()
}
e.target.value = ''
},
toggleTodo(val) {
val.done = !val.done
this.setLocalStorage()
},
deleteTodo(todo) {
this.todos.splice(this.todos.indexOf(todo), 1)
this.setLocalStorage()
},
editTodo({ todo, value }) {
todo.text = value
this.setLocalStorage()
},
clearCompleted() {
this.todos = this.todos.filter(todo => !todo.done)
this.setLocalStorage()
},
toggleAll({ done }) {
this.todos.forEach(todo => {
todo.done = done
this.setLocalStorage()
})
}
}
},
computed: {
allChecked() {
return this.todos.every(todo => todo.done)
},
filteredTodos() {
return filters[this.visibility](this.todos)
},
remaining() {
return this.todos.filter(todo => !todo.done).length
}
},
methods: {
setLocalStorage() {
window.localStorage.setItem(STORAGE_KEY, JSON.stringify(this.todos))
},
addTodo(e) {
const text = e.target.value
if (text.trim()) {
this.todos.push({
text,
done: false
})
this.setLocalStorage()
}
e.target.value = ''
},
toggleTodo(val) {
val.done = !val.done
this.setLocalStorage()
},
deleteTodo(todo) {
this.todos.splice(this.todos.indexOf(todo), 1)
this.setLocalStorage()
},
editTodo({ todo, value }) {
todo.text = value
this.setLocalStorage()
},
clearCompleted() {
this.todos = this.todos.filter(todo => !todo.done)
this.setLocalStorage()
},
toggleAll({ done }) {
this.todos.forEach(todo => {
todo.done = done
this.setLocalStorage()
})
}
}
}
</script>
<style lang="scss">
+86 -86
View File
@@ -2,20 +2,20 @@
<div class="big">
<el-row>
<div class="card">
<el-col :xs="24" :lg="16" :md="16" >
<el-col :xs="24" :lg="16" :md="16">
<div class="car-left">
<el-row>
<div>
<el-col :xs="4" :md="3" :lg="3">
<span class="card-img">
<img :src="userInfo.headerImg" alt="" />
<img :src="userInfo.headerImg" alt="">
</span>
</el-col>
<el-col :xs="20" :lg="12" :md="12">
<div class="text">
<h4>早安,管理员, 请开始您一天的工作吧!</h4>
<p class="tips-text">
<i class="el-icon-sunny el-icon"></i>
<i class="el-icon-sunny el-icon" />
<span>今日晴,0℃ - 10℃,天气寒冷,注意添加衣物。</span>
</p>
</div>
@@ -24,34 +24,34 @@
</el-row>
</div>
</el-col>
<el-col :xs="24" :lg='8' :md="8">
<el-col :xs="24" :lg="8" :md="8">
<div class="car-right">
<el-row>
<el-col :span="8"
><div class="car-item">
<span class="flow"><i class="el-icon-s-grid"></i></span>
<el-col :span="8">
<div class="car-item">
<span class="flow"><i class="el-icon-s-grid" /></span>
<span>今日流量 </span>
<b>13260</b>
</div></el-col
>
<el-col :span="8"
><div class="car-item">
</div>
</el-col>
<el-col :span="8">
<div class="car-item">
<span class="user-number">
<i class="el-icon-s-custom"></i>
<i class="el-icon-s-custom" />
</span>
<span>总用户 </span>
<b>48286</b>
</div></el-col
>
<el-col :span="8"
><div class="car-item">
</div>
</el-col>
<el-col :span="8">
<div class="car-item">
<span class="feedback">
<i class="el-icon-star-on"></i>
<i class="el-icon-star-on" />
</span>
<span>好评率 </span>
<b>98%</b>
</div></el-col
>
</div>
</el-col>
</el-row>
</div>
</el-col>
@@ -59,27 +59,27 @@
</el-row>
<el-row>
<el-card shadow="hover">
<h2>
使用教学:<a style="color:#409EFF" target="view_window" href="https://www.bilibili.com/video/BV1fV411y7dT/">https://www.bilibili.com/video/BV1fV411y7dT/</a>
</h2>
<br>
<h2>
工作流教学:<a style="color:#409EFF" target="view_window" href="https://www.bilibili.com/video/BV1Ka411F7Ji/">https://www.bilibili.com/video/BV1Ka411F7Ji/</a>
</h2>
<div></div>
<h2>
使用教学:<a style="color:#409EFF" target="view_window" href="https://www.bilibili.com/video/BV1fV411y7dT/">https://www.bilibili.com/video/BV1fV411y7dT/</a>
</h2>
<br>
<h2>
工作流教学:<a style="color:#409EFF" target="view_window" href="https://www.bilibili.com/video/BV1Ka411F7Ji/">https://www.bilibili.com/video/BV1Ka411F7Ji/</a>
</h2>
<div />
</el-card>
</el-row>
<div class="shadow">
<el-row :gutter="20">
<el-col
:span="4"
v-for="(card, key) in toolCards"
:key="key"
@click.native="toTarget(card.name)"
:span="4"
:xs="8"
@click.native="toTarget(card.name)"
>
<el-card shadow="hover" class="grid-content">
<i :class="card.icon" :style="{ color: card.color }"></i>
<i :class="card.icon" :style="{ color: card.color }" />
<p>{{ card.label }}</p>
</el-card>
</el-col>
@@ -89,7 +89,7 @@
<el-row :gutter="32">
<el-col :xs="24" :sm="24" :lg="12">
<div class="chart-player">
<musicPlayer />
<music-player />
</div>
</el-col>
<el-col :xs="24" :sm="24" :lg="12">
@@ -103,69 +103,69 @@
</template>
<script>
import musicPlayer from "./component/musicPlayer";
import TodoList from "./component/todoList";
import { mapGetters } from "vuex";
import musicPlayer from './component/musicPlayer'
import TodoList from './component/todoList'
import { mapGetters } from 'vuex'
export default {
name: "Dashboard",
data() {
return {
toolCards: [
{
label: "用户管理",
icon: "el-icon el-icon-monitor",
name: "user",
color: "#ff9c6e",
},
{
label: "角色管理",
icon: "el-icon el-icon-setting",
name: "authority",
color: "#69c0ff",
},
{
label: "菜单管理",
icon: "el-icon el-icon-menu",
name: "menu",
color: "#b37feb",
},
{
label: "代码生成器",
icon: "el-icon el-icon-cpu",
name: "autoCode",
color: "#ffd666",
},
{
label: "表单生成器",
icon: "el-icon el-icon-document-checked",
name: "formCreate",
color: "#ff85c0",
},
{
label: "关于我们",
icon: "el-icon el-icon-user",
name: "about",
color: "#5cdbd3",
},
],
};
},
computed: {
...mapGetters("user", ["userInfo"]),
},
name: 'Dashboard',
components: {
musicPlayer, //音乐播放器
TodoList, //TodoList
musicPlayer, // 音乐播放器
TodoList // TodoList
// RaddarChart, //雷达图
// stackMap, //堆叠图
// Sunburst, //旭日图
},
data() {
return {
toolCards: [
{
label: '用户管理',
icon: 'el-icon el-icon-monitor',
name: 'user',
color: '#ff9c6e'
},
{
label: '角色管理',
icon: 'el-icon el-icon-setting',
name: 'authority',
color: '#69c0ff'
},
{
label: '菜单管理',
icon: 'el-icon el-icon-menu',
name: 'menu',
color: '#b37feb'
},
{
label: '代码生成器',
icon: 'el-icon el-icon-cpu',
name: 'autoCode',
color: '#ffd666'
},
{
label: '表单生成器',
icon: 'el-icon el-icon-document-checked',
name: 'formCreate',
color: '#ff85c0'
},
{
label: '关于我们',
icon: 'el-icon el-icon-user',
name: 'about',
color: '#5cdbd3'
}
]
}
},
computed: {
...mapGetters('user', ['userInfo'])
},
methods: {
toTarget(name) {
this.$router.push({ name });
},
},
};
this.$router.push({ name })
}
}
}
</script>
<style lang="scss" scoped>