diff --git a/src/views/dashboard/admin/components/PanelGroup.vue b/src/views/dashboard/admin/components/PanelGroup.vue index 589236ed..42473dd9 100644 --- a/src/views/dashboard/admin/components/PanelGroup.vue +++ b/src/views/dashboard/admin/components/PanelGroup.vue @@ -1,54 +1,15 @@ <template> <el-row :gutter="40" class="panel-group"> - <el-col :xs="12" :sm="12" :lg="6" class="card-panel-col"> - <div class="card-panel" @click="handleSetLineChartData('newVisitis')"> - <div class="card-panel-icon-wrapper icon-people"> - <svg-icon icon-class="peoples" class-name="card-panel-icon" /> + <el-col v-for="(panelData,index) in panelGroupData" :key="index" :xs="12" :sm="12" :lg="6" class="card-panel-col"> + <div class="card-panel" @click="handleSetLineChartData(panelData.name)"> + <div :class="panelData.divClass" class="card-panel-icon-wrapper"> + <svg-icon :icon-class="panelData.iconClass" class-name="card-panel-icon" /> </div> <div class="card-panel-description"> <div class="card-panel-text"> - New Visits + {{ panelData.text }} </div> - <count-to :start-val="0" :end-val="102400" :duration="2600" class="card-panel-num" /> - </div> - </div> - </el-col> - <el-col :xs="12" :sm="12" :lg="6" class="card-panel-col"> - <div class="card-panel" @click="handleSetLineChartData('messages')"> - <div class="card-panel-icon-wrapper icon-message"> - <svg-icon icon-class="message" class-name="card-panel-icon" /> - </div> - <div class="card-panel-description"> - <div class="card-panel-text"> - Messages - </div> - <count-to :start-val="0" :end-val="81212" :duration="3000" class="card-panel-num" /> - </div> - </div> - </el-col> - <el-col :xs="12" :sm="12" :lg="6" class="card-panel-col"> - <div class="card-panel" @click="handleSetLineChartData('purchases')"> - <div class="card-panel-icon-wrapper icon-money"> - <svg-icon icon-class="money" class-name="card-panel-icon" /> - </div> - <div class="card-panel-description"> - <div class="card-panel-text"> - Purchases - </div> - <count-to :start-val="0" :end-val="9280" :duration="3200" class="card-panel-num" /> - </div> - </div> - </el-col> - <el-col :xs="12" :sm="12" :lg="6" class="card-panel-col"> - <div class="card-panel" @click="handleSetLineChartData('shoppings')"> - <div class="card-panel-icon-wrapper icon-shopping"> - <svg-icon icon-class="shopping" class-name="card-panel-icon" /> - </div> - <div class="card-panel-description"> - <div class="card-panel-text"> - Shoppings - </div> - <count-to :start-val="0" :end-val="13600" :duration="3600" class="card-panel-num" /> + <count-to :start-val="panelData.countTo.startVal" :end-val="panelData.countTo.endVal" :duration="panelData.countTo.duration" class="card-panel-num" /> </div> </div> </el-col> @@ -62,6 +23,56 @@ export default { components: { CountTo }, + data() { + return { + panelGroupData: [ + { + name: 'newVisitors', + divClass: 'icon-people', + iconClass: 'peoples', + text: 'New Visitors', + countTo: { + startVal: 0, + endVal: 102400, + duration: 2600 + } + }, + { + name: 'messages', + divClass: 'icon-message', + iconClass: 'message', + text: 'Messages', + countTo: { + startVal: 0, + endVal: 81212, + duration: 3000 + } + }, + { + name: 'purchases', + divClass: 'icon-money', + iconClass: 'money', + text: 'Purchases', + countTo: { + startVal: 0, + endVal: 9280, + duration: 3200 + } + }, + { + name: 'shoppings', + divClass: 'icon-shopping', + iconClass: 'shopping', + text: 'Shoppings', + countTo: { + startVal: 0, + endVal: 13600, + duration: 3600 + } + } + ] + } + }, methods: { handleSetLineChartData(type) { this.$emit('handleSetLineChartData', type) diff --git a/src/views/dashboard/admin/components/TodoList/Todo.vue b/src/views/dashboard/admin/components/TodoList/Todo.vue index c4b3cae2..181ae5c5 100644 --- a/src/views/dashboard/admin/components/TodoList/Todo.vue +++ b/src/views/dashboard/admin/components/TodoList/Todo.vue @@ -58,12 +58,14 @@ export default { this.$emit('toggleTodo', todo) }, doneEdit(e) { + if (!this.editing) { + return + } const value = e.target.value.trim() const { todo } = this if (!value) { - this.deleteTodo({ - todo - }) + this.deleteTodo(todo) + this.editing = false } else if (this.editing) { this.editTodo({ todo, diff --git a/src/views/dashboard/admin/index.vue b/src/views/dashboard/admin/index.vue index 8cb557be..9b7a45af 100644 --- a/src/views/dashboard/admin/index.vue +++ b/src/views/dashboard/admin/index.vue @@ -52,7 +52,7 @@ import TodoList from './components/TodoList' import BoxCard from './components/BoxCard' const lineChartData = { - newVisitis: { + newVisitors: { expectedData: [100, 120, 161, 134, 105, 160, 165], actualData: [120, 82, 91, 154, 162, 140, 145] }, @@ -85,7 +85,7 @@ export default { }, data() { return { - lineChartData: lineChartData.newVisitis + lineChartData: lineChartData.newVisitors } }, methods: {