|
|
@@ -1,201 +0,0 @@
|
|
|
-<template>
|
|
|
- <div class='app-container'>
|
|
|
- <el-form :model="form" ref="form" :rules="rules" label-width="auto">
|
|
|
- <el-form-item label="大类名称：">
|
|
|
- <el-input placeholder="请输入大类名称" />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="设备分类：">
|
|
|
- <el-select placeholder="请选择设备分类">
|
|
|
- <el-option v-for="item in classOptions" :key="item.id" :value="item.id" :label="item.name" />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="设备类型：">
|
|
|
- <el-select placeholder="请选择设备类型">
|
|
|
- <el-option v-for="item in typeOptions" :key="item.value" :value="item.value" :label="item.label" />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="是否热门：">
|
|
|
- <el-select placeholder="请选择是否热门">
|
|
|
- <el-option v-for="item in hotOptions" :key="item.value" :value="item.value" :label="item.label" />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="关联设备：">
|
|
|
- <el-select placeholder="请选择要关联的设备">
|
|
|
- <el-option />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="可见用户：">
|
|
|
- <el-select placeholder="请选择可见用户">
|
|
|
- <el-option v-for="item in pushOptions" :key="item.value" :value="item.value" :label="item.label" />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="指定用户：">
|
|
|
- <el-input placeholder="请输入指定用户" />
|
|
|
- </el-form-item>
|
|
|
- <el-row :gutter="10">
|
|
|
- <el-col :span="12">
|
|
|
- <el-form-item label="在线图片：">
|
|
|
- <Upload listType="picture-card" />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="12">
|
|
|
- <el-form-item label="离线图片：">
|
|
|
- <Upload listType="picture-card" />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- <el-button type="primary" icon="el-icon-plus" @click="getAdd">新增</el-button>
|
|
|
- <div class="children">
|
|
|
- <el-form-item label="设备模式：">
|
|
|
- <el-select placeholder="请选择设备模式">
|
|
|
- <el-option v-for="item in modeOptions" :key="item.value" :value="item.value" :label="item.label" />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="功能权限：">
|
|
|
- <el-select placeholder="请选择功能权限">
|
|
|
- <el-option v-for="item in functionOptions" :key="item.id" :value="item.id" :label="item.name" />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="连接方式：">
|
|
|
- <el-select placeholder="请选择连接方式">
|
|
|
- <el-option v-for="item in connectOptions" :key="item.value" :value="item.value" :label="item.label" />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-row :gutter="30">
|
|
|
- <el-col :span="12">
|
|
|
- <el-form-item label="连接引导图：">
|
|
|
- <Upload listType="picture-card" />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="12">
|
|
|
- <el-form-item label="配对引导图：">
|
|
|
- <Upload listType="picture-card" />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- <el-form-item label="引导页：">
|
|
|
- <Editor :min-height="250" />
|
|
|
- </el-form-item>
|
|
|
- </div>
|
|
|
- </el-form>
|
|
|
- <div>
|
|
|
- <el-button>取消</el-button>
|
|
|
- <el-button type="primary">确定</el-button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-import { list as classList } from "@/api/device/class";
|
|
|
-import { list as functionList } from "@/api/device/function";
|
|
|
-import { devModeMixin } from '@/mixin/index'
|
|
|
-export default {
|
|
|
- mixins: [devModeMixin],
|
|
|
- data() {
|
|
|
- return {
|
|
|
- form: {
|
|
|
- id: this.$route.query.id
|
|
|
- },
|
|
|
- // 校验
|
|
|
- rules: {},
|
|
|
- // 设备分类
|
|
|
- classOptions: [],
|
|
|
- // 设备类型
|
|
|
- typeOptions: [{
|
|
|
- value: 0,
|
|
|
- label: '音响'
|
|
|
- }, {
|
|
|
- value: 1,
|
|
|
- label: '耳机'
|
|
|
- }, {
|
|
|
- value: 2,
|
|
|
- label: '穿戴'
|
|
|
- }],
|
|
|
- // 是否热门
|
|
|
- hotOptions: [{
|
|
|
- value: 0,
|
|
|
- label: '否'
|
|
|
- }, {
|
|
|
- value: 1,
|
|
|
- label: '是'
|
|
|
- }],
|
|
|
- // 可见用户
|
|
|
- pushOptions: [{
|
|
|
- value: 1,
|
|
|
- label: '全部'
|
|
|
- }, {
|
|
|
- value: 3,
|
|
|
- label: '指定'
|
|
|
- }],
|
|
|
- // 功能权限
|
|
|
- functionOptions: [],
|
|
|
- // 设备连接
|
|
|
- connectOptions: [{
|
|
|
- value: 2,
|
|
|
- label: 'UPnP'
|
|
|
- }, {
|
|
|
- value: 3,
|
|
|
- label: 'MQTT'
|
|
|
- }],
|
|
|
- }
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- this.getClassList()
|
|
|
- this.getFunctionList()
|
|
|
- if (this.form.id) {
|
|
|
- this.getDetail()
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- // 详情
|
|
|
- getDetail() {
|
|
|
- detail(this.form.id).then(res => {
|
|
|
- if (res.code === 0) {
|
|
|
- // this.form.typeList.map((i) => {
|
|
|
- // this.modeOptions[i.type - 1].disabled = true;
|
|
|
- // });
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
- // 设备分类
|
|
|
- getClassList() {
|
|
|
- classList({
|
|
|
- status: 1,
|
|
|
- }).then((res) => {
|
|
|
- if (res.code === 0) {
|
|
|
- this.classOptions = res.data
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
-
|
|
|
- // 功能权限
|
|
|
- getFunctionList() {
|
|
|
- functionList({
|
|
|
- isDelete: 0
|
|
|
- }).then((res) => {
|
|
|
- if (res.code === 0) {
|
|
|
- this.functionOptions = res.data
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
-
|
|
|
- // 新增子表单
|
|
|
- getAdd() {
|
|
|
-
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="scss" scoped>
|
|
|
-.el-form {
|
|
|
- width: 550px;
|
|
|
-}
|
|
|
-
|
|
|
-.children {
|
|
|
- position: relative;
|
|
|
- border: 1px solid #e8e8e8;
|
|
|
- padding: 25px 25px 0 0;
|
|
|
- margin-bottom: 20px;
|
|
|
-}
|
|
|
-</style>
|
