9 changed files with 692 additions and 537 deletions
-
3.eslintignore
-
30src/assets/styles/index.scss
-
74src/router/routers.js
-
171src/views/device/config.vue
-
149src/views/system/dept/index.vue
-
258src/views/system/menu/index.vue
-
108src/views/system/role/index.vue
-
124src/views/system/role/role.json
-
312src/views/system/user/index.vue
@ -1,5 +1,4 @@ |
|||
build/*.js |
|||
src/assets |
|||
public |
|||
dist |
|||
*vue |
|||
dist |
|||
@ -0,0 +1,171 @@ |
|||
<template> |
|||
<div class="app-container"> |
|||
<!-- 搜索栏 --> |
|||
<div class="head-container"> |
|||
<el-row type="flex"> |
|||
<el-col :span="20" class="col_flex"> |
|||
<div class="form_item"> |
|||
<span>设备ID</span> |
|||
<el-input v-model="query.blurry" clearable size="small" placeholder="请输入设备ID" style="width: 200px" class="filter-item" @keyup.enter.native="crud.toQuery" /> |
|||
</div> |
|||
<div class="form_item"> |
|||
<span>设备名称</span> |
|||
<el-input v-model="query.blurry" clearable size="small" placeholder="请输入设备名称" style="width: 200px" class="filter-item" @keyup.enter.native="crud.toQuery" /> |
|||
</div> |
|||
<rrOperation /> |
|||
</el-col> |
|||
<el-col class="page_add" :span="4"> |
|||
<el-button class="setting_btn" type="primary" icon="el-icon-setting">配置</el-button> |
|||
<el-button class="table_add" type="primary" icon="el-icon-delete" disabled>清空</el-button> |
|||
</el-col> |
|||
</el-row> |
|||
</div> |
|||
<el-row :gutter="15"> |
|||
<el-col> |
|||
<el-card class="box-card" shadow="never"> |
|||
<el-table style="width: 100%;" :data="tableData"> |
|||
<el-table-column :selectable="checkboxT" type="selection" width="55" /> |
|||
<el-table-column prop="id" label="设备ID" align="center" /> |
|||
<el-table-column prop="account" label="设备账号" align="center" /> |
|||
<el-table-column prop="name" label="设备名称" align="center" /> |
|||
<el-table-column prop="orientation" label="设备方向" align="center" /> |
|||
<el-table-column prop="period" label="配置周期" align="center" width="300" /> |
|||
<el-table-column prop="cover" label="启动画面" align="center"> |
|||
<template slot-scope="scope"> |
|||
<el-image class="cover_img" :src="scope.row.cover" /> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="date" label="创建时间" align="center" width="200" /> |
|||
<el-table-column fixed="right" label="操作" align="center"> |
|||
<template slot-scope="scope"> |
|||
<el-button type="primary" icon="el-icon-edit" @click="edit(scope.$index, scope.row)" /> |
|||
<el-button type="info" icon="el-icon-info" /> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<!--分页组件--> |
|||
<pagination /> |
|||
</el-card> |
|||
</el-col> |
|||
</el-row> |
|||
<!-- 编辑设备 --> |
|||
<div class="layer"> |
|||
<el-dialog title="配置" :close-on-click-modal="false" :visible.sync="addFromVisible" width="600px"> |
|||
<el-form ref="form" inline="true" :model="form" :rules="rules" label-width="100px"> |
|||
<el-form-item label="开机时间" prop="uptime"> |
|||
<span>设置时间：</span> |
|||
<el-radio-group v-model="form.time"> |
|||
<el-radio label="每天" /> |
|||
<el-radio label="每周" /> |
|||
</el-radio-group> |
|||
<!-- <el-form-item label="活动性质" prop="type"> |
|||
<el-checkbox-group v-model="ruleForm.type"> |
|||
<el-checkbox label="美食/餐厅线上活动" name="type" /> |
|||
<el-checkbox label="地推活动" name="type" /> |
|||
<el-checkbox label="线下主题活动" name="type" /> |
|||
<el-checkbox label="单纯品牌曝光" name="type" /> |
|||
</el-checkbox-group> |
|||
</el-form-item> --> |
|||
<el-checkbox-group v-model="form.week"> |
|||
<el-checkbox label="周一" name="week" /> |
|||
<el-checkbox label="周二" name="week" /> |
|||
<el-checkbox label="周三" name="week" /> |
|||
<el-checkbox label="周四" name="week" /> |
|||
<el-checkbox label="周五" name="week" /> |
|||
<el-checkbox label="周六" name="week" /> |
|||
<el-checkbox label="周日" name="week" /> |
|||
</el-checkbox-group> |
|||
</el-form-item> |
|||
<!-- el-form-item label="设备名称" prop="name"><el-input v-model="form.name" style="width: 200px" /></el-form-item> |
|||
<el-form-item label="设备方向" prop="orientation"> |
|||
<el-select v-model="form.orientation" size="small" class="filter-item" style="width: 200px"> |
|||
<el-option v-for="item in deviceData" :key="item.key" :label="item.name" :value="item.key" /> |
|||
</el-select> |
|||
</el-form-item> --> |
|||
</el-form> |
|||
<div slot="footer" class="dialog-footer"> |
|||
<el-button @click="addFromVisible = false">取 消</el-button> |
|||
<el-button type="primary" @click="submitForm('form')">确 定</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import crudUser from '@/api/system/user' |
|||
import CRUD, { presenter, header, form, crud } from '@crud/crud' |
|||
import rrOperation from '@crud/RR.operation' |
|||
import pagination from '@crud/Pagination' |
|||
const defaultForm = { |
|||
time: null, |
|||
week: [], |
|||
orientation: null |
|||
} |
|||
export default { |
|||
name: 'DeviceConfig', |
|||
components: { rrOperation, pagination }, |
|||
cruds() { |
|||
return CRUD({ |
|||
title: '用户', |
|||
url: 'api/users', |
|||
crudMethod: { ...crudUser } |
|||
}) |
|||
}, |
|||
mixins: [presenter(), header(), form(defaultForm), crud()], |
|||
data() { |
|||
return { |
|||
addFromVisible: false, |
|||
tableData: [ |
|||
{ |
|||
id: 'XXXXXXXXX', |
|||
account: '13476289682', |
|||
name: 'GCXR2', |
|||
orientation: '竖屏', |
|||
period: '每周（一/二/三/四/五）- 开机 - 8:00-18:00', |
|||
cover: 'https://qiniu.aiyxlib.com/1636076789085.png', |
|||
date: '2021-09-14 16:35' |
|||
} |
|||
], |
|||
stateData: [{ key: '0', name: '全部' }, { key: '1', name: '在线' }, { key: '2', name: '离线' }], |
|||
deviceData: [{ key: '0', name: '竖屏' }, { key: '1', name: '横屏' }], |
|||
rules: { |
|||
name: [{ required: true, message: '请输入设备名称', trigger: 'blur' }, { min: 2, max: 20, message: '长度在 2 到 20 个字符', trigger: 'blur' }], |
|||
orientation: [{ required: true, message: '请选择设备方向', trigger: 'change' }] |
|||
} |
|||
} |
|||
}, |
|||
computed: {}, |
|||
watch: {}, |
|||
methods: { |
|||
// 编辑 |
|||
edit(index, row) { |
|||
this.addFromVisible = true |
|||
this.form.account = row.account |
|||
this.form.name = row.name |
|||
}, |
|||
submitForm(formName) { |
|||
this.$refs[formName].validate(valid => { |
|||
if (valid) { |
|||
alert('submit!') |
|||
} else { |
|||
console.log('error submit!!') |
|||
return false |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style lang="scss" scoped> |
|||
.col_flex { |
|||
display: flex; |
|||
} |
|||
.setting_btn{ |
|||
margin-right: 10px; |
|||
} |
|||
.cover_img{ |
|||
width: 65px; |
|||
} |
|||
|
|||
</style> |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue