合并分支

src/api/product-material/material/index.js

@@ -0,0 +1,82 @@
+import request from '@/router/axios'
+
+// 产品树形
+export function materialTree(data = {}) {
+  return request({
+    url: '/api/basics/classify/tree',
+    method: 'post',
+    data: data,
+  })
+}
+// 添加分类
+export function materialClassifyAdd(data = {}) {
+  return request({
+    url: '/api/basics/classify/add',
+    method: 'post',
+    data: data,
+  })
+}
+// 修改分类
+export function materialClassifyEdit(data = {}) {
+  return request({
+    url: '/api/basics/classify/edit',
+    method: 'post',
+    data: data,
+  })
+}
+// 删除分类
+export function materialClassifyDel(data = {}) {
+  return request({
+    url: '/api/basics/classify/delete',
+    method: 'post',
+    data: data,
+  })
+}
+
+
+// 产品列表 
+export function materialList(data = {}) {
+  return request({
+    url: '/api/basics/material/list',
+    method: 'post',
+    data: data,
+  })
+}
+
+// 产品条数 
+export function materialCount(data = {}) {
+  return request({
+    url: '/api/basics/material/page',
+    method: 'post',
+    data: data,
+  })
+}
+
+
+// 添加产品 
+export function materialAdd(data = {}) {
+  return request({
+    url: '/api/basics/material/add',
+    method: 'post',
+    data: data,
+  })
+}
+
+// 编辑产品 
+export function materialEdit(data = {}) {
+  return request({
+    url: '/api/basics/material/edit',
+    method: 'post',
+    data: data,
+  })
+}
+
+// 删除产品 
+export function materialDel(data = {}) {
+  return request({
+    url: '/api/basics/material/delete',
+    method: 'post',
+    data: data,
+  })
+}
+

src/api/product-material/product/index.js

@@ -0,0 +1,82 @@
+import request from '@/router/axios'
+
+// 产品树形
+export function productTree(data = {}) {
+  return request({
+    url: '/api/basics/classify/tree',
+    method: 'post',
+    data: data,
+  })
+}
+// 添加分类
+export function productClassifyAdd(data = {}) {
+  return request({
+    url: '/api/basics/classify/add',
+    method: 'post',
+    data: data,
+  })
+}
+// 修改分类
+export function productClassifyEdit(data = {}) {
+  return request({
+    url: '/api/basics/classify/edit',
+    method: 'post',
+    data: data,
+  })
+}
+// 删除分类
+export function productClassifyDel(data = {}) {
+  return request({
+    url: '/api/basics/classify/delete',
+    method: 'post',
+    data: data,
+  })
+}
+
+
+// 产品列表 
+export function productList(data = {}) {
+  return request({
+    url: '/api/basics/product/list',
+    method: 'post',
+    data: data,
+  })
+}
+
+// 产品条数 
+export function productCount(data = {}) {
+  return request({
+    url: '/api/basics/product/page',
+    method: 'post',
+    data: data,
+  })
+}
+
+
+// 添加产品 
+export function productAdd(data = {}) {
+  return request({
+    url: '/api/basics/product/add',
+    method: 'post',
+    data: data,
+  })
+}
+
+// 编辑产品 
+export function productEdit(data = {}) {
+  return request({
+    url: '/api/basics/product/edit',
+    method: 'post',
+    data: data,
+  })
+}
+
+// 删除产品 
+export function productDel(data = {}) {
+  return request({
+    url: '/api/basics/product/delete',
+    method: 'post',
+    data: data,
+  })
+}
+

src/components/by-table/index.js

@@ -43,9 +43,9 @@ export default {
                 return {
                     pageNum: 1,
                     pageSize: 10,
-                    total:0,
+                    total: 0,
                 }
-                
+
             }
         }
 
@@ -56,7 +56,7 @@ export default {
             return <el-table-column
                 label={actions.label || '操作'}
                 width={actions.width || 200}
-                align="right"
+                align={actions.align || 'right'}
                 {...{
                     scopedSlots: {
                         default: row => {
@@ -94,7 +94,7 @@ export default {
                                     {...{
                                         scopedSlots: {
                                             default: ({ row }) => {
-                                                return item.render(h,row)
+                                                return item.render(h, row)
                                             }
                                         },
 
@@ -110,8 +110,8 @@ export default {
                                     {...{
                                         scopedSlots: {
                                             default: ({ row }) => {
-                                                return <div class={item.textType == 'blue' ||  item.textType == 'blueOrLine' ? 'cl-blue' : ''}>
-                                                    <span 
+                                                return <div class={item.textType == 'blue' || item.textType == 'blueOrLine' ? 'cl-blue' : ''}>
+                                                    <span
                                                         style={item.textType == 'blueOrLine' ? 'border-bottom:1px solid #0084FF;cursor: pointer;' : ''}
                                                         onClick={
                                                             () => item.fn ? item.fn(row) : console.log('请配置fn方法')
@@ -134,9 +134,9 @@ export default {
         },
         //render分页
         renderPage(h) {
-            return <pagination v-show={this.total > 0} total={this.total} page={this.pageNum} limit={this.pageSize}  />
+            return <pagination v-show={this.total > 0} total={this.total} page={this.pageNum} limit={this.pageSize} />
         },
-        renderDropDown(h,item) {
+        renderDropDown(h, item) {
             const v = this
             return <div class='by-dropdown'>
                 <div class='by-dropdown-title'>{item.label} <i class="el-icon-caret-bottom el-icon--right"></i></div>
@@ -148,13 +148,14 @@ export default {
                     }}>全部</li>
                     {
                         item.data.map(i => {
-                            return <li key={i.value} 
-                            onClick={
-                                () => {
-                                    v.req[item.prop] = i.value
-                                    item.label = i.label
-                                }
-                            }>{i.label}</li>
+                            return <li key={i.value}
+                                onClick={
+                                    () => {
+                                        v.req[item.prop] = i.value
+                                        item.label = i.label
+
+                                    }
+                                }>{i.label}</li>
                         })
                     }
                 </ul>
@@ -162,20 +163,20 @@ export default {
         },
         //render搜索
         renderSearch(h) {
-            if(!this.selectConfig) return <div></div>
-            
+            if (!this.selectConfig) return <div></div>
+
             return <div class='by-search'>
                 <div style='display: flex;'>
                     {
-                        this.selectConfig.map( item => {
-                            return this.renderDropDown(h,item)
+                        this.selectConfig.map(item => {
+                            return this.renderDropDown(h, item)
                         })
                     }
                     <div class='more-text'>更多 <i class="el-icon-arrow-right el-icon--right"></i></div>
                 </div>
-                <div  style='display: flex;'>
+                <div style='display: flex;'>
                     <el-input
-                        placeholder="请选择日期"
+                        placeholder="请输入关键字"
                         suffix-icon="el-icon-search"
                         size="mini"
                         value={this.req.keyword} onInput={$event => this.req.keyword = $event}>
@@ -184,19 +185,19 @@ export default {
                 </div>
             </div>
         },
-        renderSearchInit(){
+        renderSearchInit() {
             this.selectConfig.map(item => {
                 item.labelCopy = JSON.parse(JSON.stringify(item))
                 console.log(item.labelCopy)
             })
         },
     },
-    created(){
+    created() {
         this.renderSearchInit()
     },
     name: 'by-table',
     render(h) {
-        
+
         const search = this.renderSearch(h)
         const table = this.renderTable(h)
         const page = this.renderPage(h)

src/components/by-table/index.vue

@@ -1,72 +1,69 @@
 <template>
-	<el-table :data="data" v-bind="attrs">
-		<el-table-column
-			v-for="(item, index) in columnOptions"
-			:key="index"
-			:label="item.label"
-			:prop="item.prop"
-		>
-			<template slot-scope="scope">
-				<slot
-					:name="item.slotName ? item.slotName : ''"
-					:row="scope.row"
-				>
-					{{ scope.row[item.prop] }}
-				</slot>
-			</template>
-		</el-table-column>
-		<el-table-column label="操作">
-			<template slot-scope="scope">
-				<slot name="operation" :row="scope.row">
-					<el-button
-						icon="el-icon-search"
-						@click="search(scope.row)"
-					></el-button>
-					<el-button
-						type="primary"
-						icon="el-icon-edit"
-						@click="edit(scope.row)"
-					></el-button>
-					<el-button
-						type="danger"
-						icon="el-icon-delete"
-						@click="deleteButton(scope.row)"
-					></el-button>
-				</slot>
-			</template>
-		</el-table-column>
-	</el-table>
+  <el-table :data="data" v-bind="attrs">
+    <el-table-column
+      v-for="(item, index) in columnOptions"
+      :key="index"
+      :label="item.label"
+      :prop="item.prop"
+    >
+      <template slot-scope="scope">
+        <slot :name="item.slotName ? item.slotName : ''" :row="scope.row">
+          {{ scope.row[item.prop] }}
+        </slot>
+      </template>
+    </el-table-column>
+    <el-table-column label="操作">
+      <template slot-scope="scope">
+        <slot name="operation" :row="scope.row">
+          <el-button
+            icon="el-icon-search"
+            @click="search(scope.row)"
+          ></el-button>
+          <el-button
+            type="primary"
+            icon="el-icon-edit"
+            @click="edit(scope.row)"
+          ></el-button>
+          <el-button
+            type="danger"
+            icon="el-icon-delete"
+            @click="deleteButton(scope.row)"
+          ></el-button>
+        </slot>
+      </template>
+    </el-table-column>
+  </el-table>
 </template>
    
   <script>
 export default {
-	props: {
-		// 数据
-		data: {
-			type: Array,
-			require: true,
-		},
-		// 列的属性数组
-		columnOptions: {
-			type: Array,
-			require: true,
-		},
-		// element table 的属性
-		attrs: Object,
-	},
-	methods: {
-		// 删除按钮
-		deleteButton(row) {
-			this.$emit('deleteBtn', row)
-		},
-		search(row) {
-			this.$emit('searchBtn', row)
-		},
-		edit(row) {
-			this.$emit('editBtn', row)
-		},
-	},
-}
+  props: {
+    // 数据
+    data: {
+      type: Array,
+      require: true,
+    },
+    // 列的属性数组
+    columnOptions: {
+      type: Array,
+      require: true,
+    },
+    // element table 的属性
+    attrs: Object,
+  },
+  methods: {
+    // 删除按钮
+    deleteButton(row) {
+      this.$emit("deleteBtn", row);
+    },
+    search(row) {
+      this.$emit("searchBtn", row);
+    },
+    edit(row) {
+      this.$emit("editBtn", row);
+    },
+  },
+};
 </script>
    
   <style>

src/components/form-test/index.vue

@@ -11,7 +11,11 @@
     label-width="auto"
   >
     <el-row>
-      <el-col v-for="(value, key, index) in insideConfig" :key="index" :span="24 / value.span">
+      <el-col
+        v-for="(value, key, index) in insideConfig"
+        :key="index"
+        :span="24 / value.span"
+      >
         <el-form-item v-if="value.if" :label="value.label" :prop="key">
           <!-- 解决单选多选框高度太矮导致格式错乱问题 -->
           <div style="min-height: 40px">
@@ -60,7 +64,12 @@
               size="small"
               @change="fn($event, value.change)"
             >
-              <el-option v-for="item in value.data" :key="item[value.keyName]" :label="item[value.labelName]" :value="item[value.keyName]" />
+              <el-option
+                v-for="item in value.data"
+                :key="item[value.keyName]"
+                :label="item[value.labelName]"
+                :value="item[value.keyName]"
+              />
             </el-select>
 
             <!--
@@ -73,8 +82,17 @@
                setData()     获取数据方法
                binding:      执行setData()返回参数的绑定路径
             -->
-            <el-radio-group v-else-if="value.type === 'radio'" size="small" v-model="insideData[key]" :disabled="value.disabled">
-              <el-radio v-for="item in value.data" :key="item[value.keyName]" :label="item[value.keyName]">
+            <el-radio-group
+              v-else-if="value.type === 'radio'"
+              size="small"
+              v-model="insideData[key]"
+              :disabled="value.disabled"
+            >
+              <el-radio
+                v-for="item in value.data"
+                :key="item[value.keyName]"
+                :label="item[value.keyName]"
+              >
                 {{ item[value.labelName] }}
               </el-radio>
             </el-radio-group>
@@ -88,8 +106,17 @@
              setData()    获取数据方法
              binding:     执行setData()返回参数的绑定路径
            -->
-            <el-checkbox-group v-else-if="value.type === 'checkbox'" size="small" v-model="insideData[key]" :disabled="value.disabled">
-              <el-checkbox v-for="item in value.data" :key="item[value.keyName]" :label="item[value.keyName]">
+            <el-checkbox-group
+              v-else-if="value.type === 'checkbox'"
+              size="small"
+              v-model="insideData[key]"
+              :disabled="value.disabled"
+            >
+              <el-checkbox
+                v-for="item in value.data"
+                :key="item[value.keyName]"
+                :label="item[value.keyName]"
+              >
                 {{ item[value.labelName] }}
               </el-checkbox>
             </el-checkbox-group>
@@ -139,27 +166,35 @@
               class="upload-demo"
               action="/api/service-file/uploadFile"
               :on-preview="handlePreview"
-              :on-remove="(file, fileList)=>handleRemove(file, fileList,key)"
+              :on-remove="(file, fileList) => handleRemove(file, fileList, key)"
               :before-remove="beforeRemove"
               :limit="6"
               :on-exceed="handleExceed"
               :headers="uploadHeader"
-              :on-success="(response, file, fileList)=>uploadSuccess(response, file, fileList,key)"
-              :before-upload="(file)=>beforeAvatarUpload(file,value.accept)"
+              :on-success="
+                (response, file, fileList) =>
+                  uploadSuccess(response, file, fileList, key)
+              "
+              :before-upload="(file) => beforeAvatarUpload(file, value.accept)"
               v-model="insideData[key]"
               :accept="value.accept"
-              :file-list="insideData[key]">
+              :file-list="insideData[key]"
+            >
               <el-button size="small" type="primary">点击上传</el-button>
-              <div slot="tip" v-if="value.tip" class="el-upload__tip">{{value.tip}}</div>
+              <div slot="tip" v-if="value.tip" class="el-upload__tip">
+                {{ value.tip }}
+              </div>
             </el-upload>
-            
+
             <el-cascader
               v-model="insideData[key]"
               v-else-if="value.type === 'cascader'"
               :options="value.data"
               :emitPath="false"
               :props="value.props || {}"
-              ></el-cascader>
+              :style="{ width: value.width || '100%' }"
+              size="small"
+            ></el-cascader>
             <!--
              插槽:
                 slot:       插槽命名
@@ -175,7 +210,6 @@
               v-else-if="value.type === 'editor'"
             />
             <slot v-else :name="key" />
-            
           </div>
         </el-form-item>
       </el-col>
@@ -184,16 +218,27 @@
         搜索与重置操作按钮:
          query: 搜索方法
        -->
-      <el-col v-if="this.formConfig['operation'] !== undefined" :span="6">
+      <el-col
+        v-if="this.formConfig['operation'] !== undefined"
+        :span="
+          24 / this.formConfig['operation'].span
+            ? 24 / this.formConfig['operation'].span
+            : 6
+        "
+      >
         <div style="margin-left: 15px; line-height: 38px">
-          <el-button type="primary" size="small" @click="formConfig['operation'].query()">
+          <el-button
+            type="primary"
+            size="small"
+            @click="formConfig['operation'].query()"
+          >
             搜索
           </el-button>
           <el-button
             size="small"
             @click="
-              dateRangeData = []
-              formConfig['operation'].reset()
+              dateRangeData = [];
+              formConfig['operation'].reset();
             "
           >
             重置
@@ -202,8 +247,18 @@
       </el-col>
     </el-row>
 
-    <el-row style="margin-bottom: 10px" v-if="formConfig.otherButton && formConfig.otherButton.list && formConfig.otherButton.list.length > 0">
-      <el-col :span="24" :style="'text-align: ' + formConfig.otherButton.align || 'left'">
+    <el-row
+      style="margin-bottom: 10px"
+      v-if="
+        formConfig.otherButton &&
+        formConfig.otherButton.list &&
+        formConfig.otherButton.list.length > 0
+      "
+    >
+      <el-col
+        :span="24"
+        :style="'text-align: ' + formConfig.otherButton.align || 'left'"
+      >
         <el-button
           v-for="(item, index) in formConfig.otherButton.list"
           :key="index"
@@ -219,15 +274,15 @@
 
 <script>
 import { getToken } from "@/util/auth";
-import 'quill/dist/quill.core.css'
-import 'quill/dist/quill.snow.css'
-import 'quill/dist/quill.bubble.css'
-import { quillEditor } from 'vue-quill-editor'
+import "quill/dist/quill.core.css";
+import "quill/dist/quill.snow.css";
+import "quill/dist/quill.bubble.css";
+import { quillEditor } from "vue-quill-editor";
 export default {
-  components:{
-    quillEditor
+  components: {
+    quillEditor,
   },
-  name: 'test',
+  name: "test",
   props: {
     // 表单值
     value: {
@@ -242,7 +297,7 @@ export default {
     insideRules: {
       type: Object,
       default: () => {
-        return {}
+        return {};
       },
     },
     // 全局label宽度
@@ -269,7 +324,7 @@ export default {
     change: {
       type: Function,
       default: () => {
-        return {}
+        return {};
       },
     },
   },
@@ -279,61 +334,61 @@ export default {
       insideData: {}, // 内部数据
       dateRangeData: [], // 时间段
       fileData: [], // 文件路径数组
-      fileList:[],
-      uploadHeader:{
-        Authorization: 'Basic c2FiZXI6c2FiZXJfc2VjcmV0',
-        'Blade-Auth':'bearer ' + getToken()
-      }
-    }
+      fileList: [],
+      uploadHeader: {
+        Authorization: "Basic c2FiZXI6c2FiZXJfc2VjcmV0",
+        "Blade-Auth": "bearer " + getToken(),
+      },
+    };
   },
   watch: {
     value: {
       handler() {
-        this.insideData = this.value
+        this.insideData = this.value;
       },
       deep: true,
       immediate: true,
     },
     formConfig: {
       handler() {
-        this.init()
+        this.init();
       },
       deep: true,
       immediate: true,
     },
   },
   methods: {
-    beforeAvatarUpload(file,accept) {
-      console.log(file,accept)
-      const videoType = file.type.substring(file.type.length - 3)
-      if(accept.indexOf(videoType) == -1){
-        this.$message.error('上传头像图片只能是 '+ accept +' 格式!');
-        return false
+    beforeAvatarUpload(file, accept) {
+      console.log(file, accept);
+      const videoType = file.type.substring(file.type.length - 3);
+      if (accept.indexOf(videoType) == -1) {
+        this.$message.error("上传头像图片只能是 " + accept + " 格式!");
+        return false;
       }
     },
-    uploadSuccess(response, file, fileList,key){
-      this.insideData[key] = []
+    uploadSuccess(response, file, fileList, key) {
+      this.insideData[key] = [];
       for (let i = 0; i < fileList.length; i++) {
         const element = fileList[i];
-        
-        console.log(element)
-        if(element.response){
-          element.response.data.name = element.response.data.fileName
-          this.insideData[key].push(element.response.data)
-        }else{
-          this.insideData[key].push(element)
+
+        console.log(element);
+        if (element.response) {
+          element.response.data.name = element.response.data.fileName;
+          this.insideData[key].push(element.response.data);
+        } else {
+          this.insideData[key].push(element);
         }
       }
     },
-    handleRemove(file, fileList,key) {
-      this.insideData[key] = []
+    handleRemove(file, fileList, key) {
+      this.insideData[key] = [];
       for (let i = 0; i < fileList.length; i++) {
         const element = fileList[i];
-        if(element.response){
-          element.response.data.name = element.response.data.fileName
-          this.insideData[key].push(element.response.data)
-        }else{
-          this.insideData[key].push(element)
+        if (element.response) {
+          element.response.data.name = element.response.data.fileName;
+          this.insideData[key].push(element.response.data);
+        } else {
+          this.insideData[key].push(element);
         }
       }
     },
@@ -341,186 +396,215 @@ export default {
       console.log(file);
     },
     handleExceed(files, fileList) {
-      this.$message.warning(`当前限制选择 6 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
+      this.$message.warning(
+        `当前限制选择 6 个文件，本次选择了 ${files.length} 个文件，共选择了 ${
+          files.length + fileList.length
+        } 个文件`
+      );
     },
     beforeRemove(file, fileList) {
-      return this.$confirm(`确定移除 ${ file.name }？`);
+      return this.$confirm(`确定移除 ${file.name}？`);
     },
     fn(val, _fn) {
-      _fn(val)
+      _fn(val);
     },
     // 初始化
     init() {
-      this.insideConfig = {}
+      this.insideConfig = {};
       for (const key in this.formConfig) {
         // 跳过特殊方法( operation: 搜索、重置, otherButton: 新增等自定义按钮)
-        if (key === 'operation' || key === 'otherButton' || key === 'loadingStatus') {
-          continue
+        if (
+          key === "operation" ||
+          key === "otherButton" ||
+          key === "loadingStatus"
+        ) {
+          continue;
         }
-        const value = this.formConfig[key]
+        const value = this.formConfig[key];
         this.insideConfig[key] = {
           label: value.label,
-          type: value.type ? value.type : 'input',
+          type: value.type ? value.type : "input",
           if: value.if === undefined ? true : value.if,
           span: value.span || this.span,
-          clearable: value.clearable === undefined ? this.clearable : value.clearable,
-          disabled: value.disabled === undefined ? this.disabled : value.disabled,
+          clearable:
+            value.clearable === undefined ? this.clearable : value.clearable,
+          disabled:
+            value.disabled === undefined ? this.disabled : value.disabled,
           change: value.change === undefined ? this.change : value.change,
-        }
+        };
         switch (this.insideConfig[key].type) {
-          case 'input':
-            this.inputHandle(key, value)
-            break
-          case 'select':
-            this.selectHandle(key, value)
-            break
-          case 'radio':
-            this.radioHandel(key, value)
-            break
-          case 'checkbox':
-            this.checkboxHandel(key, value)
-            break
-          case 'datePicker':
-            this.datePickerHandel(key, value)
-            break
-          case 'upload':
-            this.uploadHandel(key, value)
-            break
-          case 'uploads':
-            this.uploadsHandel(key, value)
-            break
-            case 'cascader':
-            this.cascaderHandel(key, value)
-            break
+          case "input":
+            this.inputHandle(key, value);
+            break;
+          case "select":
+            this.selectHandle(key, value);
+            break;
+          case "radio":
+            this.radioHandel(key, value);
+            break;
+          case "checkbox":
+            this.checkboxHandel(key, value);
+            break;
+          case "datePicker":
+            this.datePickerHandel(key, value);
+            break;
+          case "upload":
+            this.uploadHandel(key, value);
+            break;
+          case "uploads":
+            this.uploadsHandel(key, value);
+            break;
+          case "cascader":
+            this.cascaderHandel(key, value);
+            break;
         }
       }
     },
     //初始化
     reset() {
-      this.$refs.form.resetFields()
+      this.$refs.form.resetFields();
     },
     // el-input标签处理
     inputHandle(key, value) {
-      this.insideConfig[key].placeholder = value.placeholder || '请输入' + value.label
-      this.insideConfig[key].itemType = value.itemType || 'text'
+      this.insideConfig[key].placeholder =
+        value.placeholder || "请输入" + value.label;
+      this.insideConfig[key].itemType = value.itemType || "text";
     },
 
     // el-select标签处理
     selectHandle(key, value) {
-      this.insideConfig[key].placeholder = value.placeholder || '请选择' + value.label
-      this.insideConfig[key].multiple = value.multiple === undefined ? false : value.multiple
-      this.insideConfig[key].filterable = value.filterable === undefined ? true : value.filterable
-      this.insideConfig[key].keyName = value.keyName || 'key'
-      this.insideConfig[key].labelName = value.labelName || 'label'
-      this.setData(key, value)
+      this.insideConfig[key].placeholder =
+        value.placeholder || "请选择" + value.label;
+      this.insideConfig[key].multiple =
+        value.multiple === undefined ? false : value.multiple;
+      this.insideConfig[key].filterable =
+        value.filterable === undefined ? true : value.filterable;
+      this.insideConfig[key].keyName = value.keyName || "key";
+      this.insideConfig[key].labelName = value.labelName || "label";
+      this.setData(key, value);
     },
 
     // el-radio标签处理
     radioHandel(key, value) {
-      this.insideConfig[key].keyName = value.keyName || 'key'
-      this.insideConfig[key].labelName = value.labelName || 'label'
-      this.setData(key, value)
+      this.insideConfig[key].keyName = value.keyName || "key";
+      this.insideConfig[key].labelName = value.labelName || "label";
+      this.setData(key, value);
     },
 
     // el-checkbox标签处理
     checkboxHandel(key, value) {
       // 默认值
       if (!this.insideData[key]) {
-        this.$set(this.insideData, key, [])
+        this.$set(this.insideData, key, []);
       }
-      this.insideConfig[key].keyName = value.keyName || 'key'
-      this.insideConfig[key].labelName = value.labelName || 'label'
-      this.setData(key, value)
+      this.insideConfig[key].keyName = value.keyName || "key";
+      this.insideConfig[key].labelName = value.labelName || "label";
+      this.setData(key, value);
     },
 
     // el-checkbox标签处理
     cascaderHandel(key, value) {
       // 默认值
       if (!this.insideData[key]) {
-        this.$set(this.insideData, key, [])
+        this.$set(this.insideData, key, []);
       }
-      
-      this.insideConfig[key].props = value.props || {}    
-      if(this.insideConfig[key].props && !this.insideConfig[key].props.emitPath)
-      this.insideConfig[key].props.emitPath = false
-      this.setData(key, value)
-    },
 
-    
+      this.insideConfig[key].props = value.props || {};
+      if (
+        this.insideConfig[key].props &&
+        !this.insideConfig[key].props.emitPath
+      )
+        this.insideConfig[key].props.emitPath = false;
+      this.setData(key, value);
+    },
 
     // el-datePicker标签处理
     datePickerHandel(key, value) {
-      this.insideConfig[key].placeholder = value.placeholder || '请选择日期'
-      this.insideConfig[key].itemType = value.itemType || 'date'
-      this.insideConfig[key].format = value.format || 'yyyy-MM-dd'
+      this.insideConfig[key].placeholder = value.placeholder || "请选择日期";
+      this.insideConfig[key].itemType = value.itemType || "date";
+      this.insideConfig[key].format = value.format || "yyyy-MM-dd";
     },
 
     // 单文件上传处理
     uploadHandel(key) {
       if (this.insideData[key]) {
-        this.$set(this.fileData, key, [this.insideData[key]])
+        this.$set(this.fileData, key, [this.insideData[key]]);
       } else if (!this.fileData[key]) {
-        this.$set(this.fileData, key, [])
+        this.$set(this.fileData, key, []);
       }
     },
 
     // 多文件上传处理
     uploadsHandel(key, value) {
-      this.insideConfig[key].maxSelectNum = value.maxSelectNum || 6
-      this.insideConfig[key].accept = value.accept || null
-      
+      this.insideConfig[key].maxSelectNum = value.maxSelectNum || 6;
+      this.insideConfig[key].accept = value.accept || null;
+
       if (!this.insideData[key]) {
-        this.$set(this.insideData, key, [])
+        this.$set(this.insideData, key, []);
       }
     },
 
     // 获取数据方法
     async setData(key, value) {
       if (value.data) {
-        this.insideConfig[key].data = value.data
+        this.insideConfig[key].data = value.data;
       } else if (value.dict) {
-        this.insideConfig[key].keyName = 'dictValue'
-        this.insideConfig[key].labelName = 'dictLabel'
-        this.insideConfig[key].data = await this.getDicts(value.dict)
-        this.$forceUpdate()
+        this.insideConfig[key].keyName = "dictValue";
+        this.insideConfig[key].labelName = "dictLabel";
+        this.insideConfig[key].data = await this.getDicts(value.dict);
+        this.$forceUpdate();
       } else {
-        const itemData = await value.setData()
+        const itemData = await value.setData();
         if (value.binding) {
-          this.insideConfig[key].data = value.binding.split('.').reduce((total, cur) => total[cur], itemData)
+          this.insideConfig[key].data = value.binding
+            .split(".")
+            .reduce((total, cur) => total[cur], itemData);
         } else {
-          this.insideConfig[key].data = itemData
+          this.insideConfig[key].data = itemData;
         }
-        this.$forceUpdate()
+        this.$forceUpdate();
       }
     },
 
     // 赋值开始时间结束时间
     dateRangeChange(value, key) {
       if (this.dateRangeData[key] !== null) {
-        this.$set(this.insideData, value['beginName'] || 'beginTime', this.dateRangeData[key][0])
-        this.$set(this.insideData, value['endName'] || 'endTime', this.dateRangeData[key][1])
+        this.$set(
+          this.insideData,
+          value["beginName"] || "beginTime",
+          this.dateRangeData[key][0]
+        );
+        this.$set(
+          this.insideData,
+          value["endName"] || "endTime",
+          this.dateRangeData[key][1]
+        );
       } else {
-        this.$set(this.insideData, value['beginName'] || 'beginTime', undefined)
-        this.$set(this.insideData, value['endName'] || 'endTime', undefined)
+        this.$set(
+          this.insideData,
+          value["beginName"] || "beginTime",
+          undefined
+        );
+        this.$set(this.insideData, value["endName"] || "endTime", undefined);
       }
     },
 
     // 选择图片
     selectFile(key) {
       if (this.fileData[key].length > 0) {
-        this.$set(this.insideData, key, this.fileData[key][0])
+        this.$set(this.insideData, key, this.fileData[key][0]);
       } else {
-        this.$set(this.insideData, key, undefined)
+        this.$set(this.insideData, key, undefined);
       }
     },
 
     // 删除图片
     removeFile(key) {
-      this.$set(this.fileData, key, [])
-      this.$set(this.insideData, key, undefined)
+      this.$set(this.fileData, key, []);
+      this.$set(this.insideData, key, undefined);
     },
   },
-}
+};
 </script>
 
 <style lang="scss" scoped>

src/components/label-title/index.vue

@@ -0,0 +1,35 @@
+<template>
+  <div class="title-info">
+    <div class="vertical-bar"></div>
+    <div class="content">{{ content }}</div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    content: String,
+    default: "",
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.title-info {
+  width: 100%;
+  display: flex;
+  align-items: center;
+  .vertical-bar {
+    width: 3px;
+    height: 24px;
+    background-color: #0084ff;
+    margin-right: 10px;
+    margin-top: 1px;
+  }
+  .content {
+    font-size: 16px;
+    font-weight: 600;
+    color: #333333;
+  }
+}
+</style>

src/components/query/index.vue

@@ -0,0 +1,189 @@
+<template>
+  <div class="content">
+    <div style="display: flex">
+      <div
+        class="by-dropdown"
+        v-for="(item, index) in selectConfig"
+        :key="index"
+      >
+        <div class="by-dropdown-title">
+          {{ item.label }} <i class="el-icon-caret-bottom el-icon--right"></i>
+        </div>
+        <ul class="by-dropdown-lists">
+          <li @click="allClick(item)">{{ $t("all") }}</li>
+          <li v-for="(li, i) in item.data" @click="handleClick(item, li)">
+            {{ li.label }}
+          </li>
+        </ul>
+      </div>
+    </div>
+    <div class="by-search">
+      <div style="display: flex">
+        <el-input
+          v-model="req.keyword"
+          :placeholder="$t('pleaseInput') + $t('keyword')"
+          suffix-icon="el-icon-search"
+          size="small"
+          @keyup.enter.native="handleInter()"
+        ></el-input>
+        <div class="more-icon" @click="handleMore" v-if="isShowMore">
+          <i class="el-icon-arrow-right el-icon--right"></i>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    selectConfig: {
+      type: Array,
+      default: () => [],
+    },
+    req: {
+      type: Object,
+      default: () => {
+        return {
+          pageNum: 1,
+          pageSize: 10,
+          keyword: "",
+        };
+      },
+    },
+    isShowMore: {
+      type: Boolean,
+      default: true,
+    },
+  },
+  created() {
+    this.renderSearchInit();
+  },
+  methods: {
+    renderSearchInit() {
+      this.selectConfig.map((item) => {
+        item.labelCopy = JSON.parse(JSON.stringify(item));
+      });
+    },
+    allClick(item) {
+      this.req[item.prop] = null;
+      item.label = item.labelCopy.label;
+      this.$emit("handleQuery");
+    },
+    handleClick(item, li) {
+      item.label = li.label;
+      this.req[item.prop] = item.value;
+      this.$emit("handleQuery");
+    },
+    handleInter() {
+      this.$emit("handleQuery");
+    },
+    handleMore() {
+      this.$emit("handleMore", true);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.content {
+  display: flex;
+  justify-content: space-between;
+}
+.by-dropdown {
+  width: 120px;
+  position: relative;
+  text-align: center;
+  height: 32px;
+  z-index: 100;
+  transition: all 0.5s ease;
+  cursor: pointer;
+
+  .by-dropdown-title {
+    font-size: 14px;
+    background-color: #fff;
+  }
+  ul {
+    position: absolute;
+    left: 0;
+    right: 0;
+    top: 32px;
+    padding: 0;
+    margin: 0;
+    z-index: 100;
+    display: none;
+    li {
+      list-style: none;
+      font-size: 12px;
+      height: 32px;
+      line-height: 32px;
+    }
+    li:hover {
+      background-color: #eff6ff;
+      color: #0084ff;
+    }
+  }
+}
+
+.by-dropdown::before {
+  display: block;
+  width: 120px;
+  content: " ";
+  position: absolute;
+  height: 8px;
+  top: 24px;
+  background-color: #fff;
+  left: 0;
+  z-index: 101;
+}
+
+.by-dropdown:hover {
+  background: #ffffff;
+  box-shadow: 0px 2px 16px 1px rgba(0, 0, 0, 0.1);
+  border-radius: 2px 2px 2px 2px;
+  opacity: 1;
+  ul {
+    background: #ffffff;
+    box-shadow: 0px 2px 16px 1px rgba(0, 0, 0, 0.1);
+    border-radius: 2px 2px 2px 2px;
+    opacity: 1;
+    display: block;
+  }
+}
+.by-search {
+  display: flex;
+  justify-content: space-between;
+  line-height: 32px;
+  padding-bottom: 24px;
+  .more-text {
+    font-size: 14px;
+    color: #666;
+    padding-left: 20px;
+    position: relative;
+    cursor: pointer;
+  }
+  .more-text:hover {
+    color: #0084ff;
+    i {
+      color: #0084ff;
+    }
+  }
+  .more-text::before {
+    content: " ";
+    position: absolute;
+    left: 0;
+    height: 14px;
+    background-color: #ddd;
+    width: 1px;
+    top: 10px;
+  }
+  .more-icon {
+    cursor: pointer;
+  }
+  .more-icon:hover {
+    i {
+      color: #0084ff;
+    }
+  }
+}
+</style>

src/lang/zh.js

@@ -12,13 +12,20 @@ export default {
   loadingText: '删除',
   addSuccess: '添加成功',
   deleteSuccess: '删除成功',
-  editSuccess:'修改成功',
+  editSuccess: '修改成功',
   askDeleteData: '请问是否删除该条数据',
-  add:"添加",
-  edit:'编辑',
-  create_time:"创建时间",
-  update_time:"更新时间",
-  keyword:"关键词",
+  add: "添加",
+  edit: '编辑',
+  cancel: '取消',
+  submit: "确定",
+  create_time: "创建时间",
+  update_time: "更新时间",
+  keyword: "关键字",
+  excelImport: 'Excel导入',
+  pleaseSelect: '请选择',
+  pleaseInput: '请输入',
+  all: "全部",
+  seniorQuery: "高级检索",
   wel: {
     info: '早安，Smallwei，Avuex一款超乎你想象的框架！',
     dept: '我是avue团队下的一个部门-哈皮部门-哈皮职位',
@@ -171,40 +178,157 @@ export default {
       secretRules: '请输入密钥',
     },
   },
-  management:{
-    video_setting:{
-      keyword:"关键词",
-      videoUrl:"缩略图",
-      title:'标题',
-      status:'状态',
-      duration:'时长',
-      size:"大小",
-      treeModalAdd:'添加分类',
-      treeModalEdit:'编辑分类',
-      addModal:"添加视频说明书",
-      edit:'编辑视频说明书',
-      type:"类型",
-      name:"分类名称",
-      treeAddType1:'产品分类',
-      treeAddType2:'物料分类',
-      treeName:'标题',
-      typeRules:"请选择类型",
-      nameRules:"请输入标题"
+  management: {
+    video_setting: {
+      keyword: "关键词",
+      videoUrl: "缩略图",
+      title: '标题',
+      status: '状态',
+      duration: '时长',
+      size: "大小",
+      treeModalAdd: '添加分类',
+      treeModalEdit: '编辑分类',
+      addModal: "添加视频说明书",
+      edit: '编辑视频说明书',
+      type: "类型",
+      name: "分类名称",
+      treeAddType1: '产品分类',
+      treeAddType2: '物料分类',
+      treeName: '标题',
+      typeRules: "请选择类型",
+      nameRules: "请输入标题"
     },
   },
-  process:{
-    processList:"流程列表",
-    generalProcess:{
-      serviceName:"业务服务",
-      moduleName:"功能名称",
-      codeName:"流程名称",
-      add:"添加流程",
-      flowName:"流程名称",
-      code:"流程标识",
-      serviceNameRules:"业务服务不能为空",
-      codeRules:'流程标识不能为空',
-      moduleNameRules:'功能名称不能为空',
-      flowNameRules:'流程名称不能为空',
+  process: {
+    processList: "流程列表",
+    generalProcess: {
+      serviceName: "业务服务",
+      moduleName: "功能名称",
+      codeName: "流程名称",
+      add: "添加流程",
+      flowName: "流程名称",
+      code: "流程标识",
+      serviceNameRules: "业务服务不能为空",
+      codeRules: '流程标识不能为空',
+      moduleNameRules: '功能名称不能为空',
+      flowNameRules: '流程名称不能为空',
     },
   },
+  product_material: {
+    product: {
+      treeModalAdd: '添加分类',
+      treeModalEdit: '编辑分类',
+      treeName: "产品名称",
+      nameRules: "请输入产品名称",
+      productAdd: '添加产品',
+      productEdit: '编辑产品',
+      productClassify: "产品分类",
+      productType: '产品类型',
+      productCode: "产品编码",
+      productName: '产品名称',
+      productUnit: "单位",
+      productDescription: "产品说明",
+      description: "说明",
+      productClassifyRules: "请选择产品分类",
+      productTypeRules: '请选择产品类型',
+      productCodeRules: "请输入产品编码",
+      productNameRules: '请输入产品名称',
+      productUnitRules: "请选择单位",
+      finishedProduct: "成品",
+      partiallyPreparedProducts: "半成品"
+    },
+    material: {
+      treeModalAdd: '添加分类',
+      treeModalEdit: '编辑分类',
+      treeName: "物料名称",
+      nameRules: "请输入物料名称",
+      materialAdd: '添加物料',
+      materialEdit: '编辑物料',
+      materialClassify: "物料分类",
+      materialType: '物料类型',
+      materialCode: "物料编码",
+      materialName: '物料名称',
+      materialUnit: "单位",
+      materialDescription: "物料说明",
+      description: "说明",
+      materialClassifyRules: "请选择物料分类",
+      materialTypeRules: '请选择物料类型',
+      materialCodeRules: "请输入物料编码",
+      materialNameRules: '请输入物料名称',
+      materialUnitRules: "请选择单位",
+      rawMaterial: "原料",
+      subsidiaryMaterial: '辅料',
+      parts: '配件',
+      packagingMaterials: '包材',
+      other: '其他',
+
+    },
+    spu: {
+      spuCode: "spu编码",
+      spuName: 'spu名称',
+      spuDescription: "spu说明",
+      spuAdd: 'spu添加',
+      spuEdit: 'spu编辑',
+      spuNameRules: '请输入spu名称'
+
+    },
+    warehouse: {
+      warehouseAdd: '添加仓库',
+      warehouseEdit: '仓库编辑',
+      warehouseType: "仓库类型",
+      warehouseName: '仓库名称',
+      warehouseDescription: "仓库说明",
+      storekeeper: '仓管员'
+    },
+    supply: {
+      supplyAdd: '添加供应商',
+      supplyEdit: "编辑供应商",
+      priceMaintenance: "价格维护",
+      supplyType: '供应商类型',
+      supplyCode: "供应商编码",
+      supplyName: '供应商名称',
+      city: '所在城市',
+      accountingPeriod: '账期',
+      contacts: '联系人',
+      contactNumber: '联系电话',
+      returnAndReplacementPeriod: '退换货期限',
+      enclosure: '附件',
+      address: "详细地址",
+      backInfo: "银行信息",
+      accountName: '户名',
+      bankAccount: '银行账户',
+      bankOfDeposit: '开户银行',
+      bankNo: '银行号',
+      supplyTypeRules: '请选择供应商类型',
+      supplyNameRules: '请输入供应商名称',
+      contactsRules: '请输入联系人',
+      contactNumberRules: '请输入联系电话',
+      accountingPeriodRules: '请输入账期',
+      returnAndReplacementPeriodRules: '请输入退换货期限',
+      supplyPriceMaintain: "供应商价格维护",
+      priceMaintenance: {
+        supplyPriceAdd: "添加供应商价格",
+        supplyPriceEdit: "编辑供应商价格",
+
+        back: "返回",
+        goodCode: '物品编码',
+        goodName: '物品名称',
+        goodType: '物品类型',
+        supplyPrice: '供应单价',
+
+      },
+
+
+
+    },
+  },
+  equipment: {
+    deviceInterface: '设备界面',
+    realTimeDataList: "实时数据列表",
+    name: '名称',
+    realTimeData: "实时数据",
+    keyword: "关键字",
+    infoCategory: '信息分类',
+    interfaceData: 'API接口数据'
+  },
 }

src/router/page/index.js

@@ -162,6 +162,99 @@ export default [
     ],
   },
   {
+    path: '/product-material/product',
+    component: Layout,
+    redirect: '/product-material/product/index',
+    children: [
+      {
+        path: 'index',
+        name: '产品维护',
+        component: () => import(/* webpackChunkName: "page" */ '@/views/product-material/product/index'),
+        props: true,
+      },
+    ],
+  },
+  {
+    path: '/product-material/material',
+    component: Layout,
+    redirect: '/product-material/material/index',
+    children: [
+      {
+        path: 'index',
+        name: '物料维护',
+        component: () => import(/* webpackChunkName: "page" */ '@/views/product-material/material/index'),
+        props: true,
+      },
+    ],
+  },
+  {
+    path: '/product-material/spu',
+    component: Layout,
+    redirect: '/product-material/spu/index',
+    children: [
+      {
+        path: 'index',
+        name: 'spu管理',
+        component: () => import(/* webpackChunkName: "page" */ '@/views/product-material/spu/index'),
+        props: true,
+      },
+    ],
+  },
+  {
+    path: '/product-material/warehouse',
+    component: Layout,
+    redirect: '/product-material/warehouse/index',
+    children: [
+      {
+        path: 'index',
+        name: '仓库维护',
+        component: () => import(/* webpackChunkName: "page" */ '@/views/product-material/warehouse/index'),
+        props: true,
+      },
+    ],
+  },
+
+  {
+    path: '/product-material/supply',
+    component: Layout,
+    redirect: '/product-material/supply/index',
+    children: [
+      {
+        path: 'index',
+        name: '供应商维护',
+        component: () => import(/* webpackChunkName: "page" */ '@/views/product-material/supply/index'),
+        props: true,
+      },
+    ],
+  },
+  {
+    path: '/product-material/supply',
+    component: Layout,
+    redirect: '/product-material/supply/priceMaintenance',
+    children: [
+      {
+        path: 'priceMaintenance',
+        name: '供应商价格维护',
+        component: () => import(/* webpackChunkName: "page" */ '@/views/product-material/supply/priceMaintenance'),
+        props: true,
+      },
+    ],
+  },
+
+  {
+    path: '/equipment',
+    component: Layout,
+    redirect: '/equipment/index',
+    children: [
+      {
+        path: 'index',
+        name: '设备',
+        component: () => import(/* webpackChunkName: "page" */ '@/views/equipment/index'),
+        props: true,
+      },
+    ],
+  },
+  {
     path: '*',
     redirect: '/404',
   },

src/views/Internet-of-things/equipment-management/index.vue

@@ -3,87 +3,137 @@
     <test v-model="queryParams" :form-config="queryForm"></test>
 
     <el-table :data="tableList" v-loading="loading">
-      <el-table-column :label="$t('Internet_of_things.equipment.applicationName')" align="center" prop="applicationName" />
-      <el-table-column :label="$t('Internet_of_things.equipment.productName')" align="center" prop="productName" />
-      <el-table-column :label="$t('Internet_of_things.equipment.deviceName')" align="center" prop="deviceName" />
-      <el-table-column :label="$t('Internet_of_things.equipment.nodeId')" align="center" prop="nodeId" width="120" />
-      <el-table-column :label="$t('Internet_of_things.equipment.deviceStatus')" align="center" prop="" width="120" />
-      <el-table-column :label="$t('Internet_of_things.equipment.deviceId')" align="center" prop="deviceId" />
-      <el-table-column :label="$t('Internet_of_things.equipment.secret')" align="center" prop="secret" width="120" />
+      <el-table-column
+        :label="$t('Internet_of_things.equipment.applicationName')"
+        align="center"
+        prop="applicationName"
+      />
+      <el-table-column
+        :label="$t('Internet_of_things.equipment.productName')"
+        align="center"
+        prop="productName"
+      />
+      <el-table-column
+        :label="$t('Internet_of_things.equipment.deviceName')"
+        align="center"
+        prop="deviceName"
+      />
+      <el-table-column
+        :label="$t('Internet_of_things.equipment.nodeId')"
+        align="center"
+        prop="nodeId"
+        width="120"
+      />
+      <el-table-column
+        :label="$t('Internet_of_things.equipment.deviceStatus')"
+        align="center"
+        prop=""
+        width="120"
+      />
+      <el-table-column
+        :label="$t('Internet_of_things.equipment.deviceId')"
+        align="center"
+        prop="deviceId"
+      />
+      <el-table-column
+        :label="$t('Internet_of_things.equipment.secret')"
+        align="center"
+        prop="secret"
+        width="120"
+      />
       <el-table-column :label="$t('operation')" align="center" width="80">
         <template slot-scope="scope">
-          <el-button type="text" @click="handleDelete(scope.row)">{{ $t('delete') }} </el-button>
+          <el-button type="text" @click="handleDelete(scope.row)"
+            >{{ $t("delete") }}
+          </el-button>
         </template>
       </el-table-column>
     </el-table>
 
-    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
 
     <el-dialog title="添加设备" v-if="open" :visible.sync="open" width="30%">
-      <test ref="test" v-model="dialogParams" :form-config="dialogForm" :insideRules="dialogRules"></test>
+      <test
+        ref="test"
+        v-model="dialogParams"
+        :form-config="dialogForm"
+        :insideRules="dialogRules"
+      ></test>
     </el-dialog>
   </el-card>
 </template>
 
 <script>
-import * as API from '@/api/Internet-of-things/equipment-management.js'
-import * as APISelect from '@/api/Internet-of-things/select.js'
-import test from '@/components/form-test/index.vue'
+import * as API from "@/api/Internet-of-things/equipment-management.js";
+import * as APISelect from "@/api/Internet-of-things/select.js";
+import test from "@/components/form-test/index.vue";
 
 export default {
-  name: 'equipment-management',
+  name: "equipment-management",
   components: { test },
   data() {
     return {
       queryParams: {
         pageNum: 1,
         pageSize: 10,
-        keyword: '',
-        tdaApplicationId: '',
-        tdaProductId: '',
+        keyword: "",
+        tdaApplicationId: "",
+        tdaProductId: "",
       },
       queryForm: {
         keyword: {
-          label: this.$t('Internet_of_things.equipment.keyword'),
+          label: this.$t("Internet_of_things.equipment.keyword"),
           span: 6,
         },
         tdaApplicationId: {
-          label: this.$t('Internet_of_things.equipment.tdaApplicationId'),
+          label: this.$t("Internet_of_things.equipment.tdaApplicationId"),
           span: 6,
-          type: 'select',
+          type: "select",
           data: [],
-          keyName: 'id',
-          labelName: 'appName',
+          keyName: "id",
+          labelName: "appName",
         },
         tdaProductId: {
-          label: this.$t('Internet_of_things.equipment.tdaProductId'),
+          label: this.$t("Internet_of_things.equipment.tdaProductId"),
           span: 6,
-          type: 'select',
+          type: "select",
           data: [],
-          keyName: 'id',
-          labelName: 'name',
+          keyName: "id",
+          labelName: "name",
         },
         operation: {
           // 搜索按钮操作
           query: () => {
-            this.queryParams.pageNum = 1
-            this.getList()
+            this.queryParams.pageNum = 1;
+            this.getList();
           },
           // 重置按钮操作
           reset: () => {
-            this.queryParams = { pageNum: 1, pageSize: 10, keyword: '', tdaApplicationId: '', name: '' }
-            this.queryParams.pageNum = 1
-            this.getList()
+            this.queryParams = {
+              pageNum: 1,
+              pageSize: 10,
+              keyword: "",
+              tdaApplicationId: "",
+              name: "",
+            };
+            this.queryParams.pageNum = 1;
+            this.getList();
           },
         },
         otherButton: {
           list: [
             {
-              name: this.$t('Internet_of_things.equipment.addEquipment'),
-              methodsText: 'add',
-              type: 'primary',
+              name: this.$t("Internet_of_things.equipment.addEquipment"),
+              methodsText: "add",
+              type: "primary",
               add: () => {
-                this.handleAdd()
+                this.handleAdd();
               },
             },
           ],
@@ -93,89 +143,121 @@ export default {
       total: 0,
       loading: false,
       open: false,
-      title: '',
+      title: "",
       dialogParams: {
-        tdaApplicationId: '',
-        tdaProductId: '',
-        nodeId: '',
-        deviceName: '',
-        secret: 'Fjhx@2012#',
+        tdaApplicationId: "",
+        tdaProductId: "",
+        nodeId: "",
+        deviceName: "",
+        secret: "Fjhx@2012#",
       },
       dialogForm: {
         loadingStatus: false,
         tdaApplicationId: {
-          label: this.$t('Internet_of_things.equipment.applicationName'),
-          type: 'select',
+          label: this.$t("Internet_of_things.equipment.applicationName"),
+          type: "select",
           data: [],
-          keyName: 'id',
-          labelName: 'appName',
+          keyName: "id",
+          labelName: "appName",
         },
         tdaProductId: {
-          label: this.$t('Internet_of_things.equipment.productName'),
-          type: 'select',
+          label: this.$t("Internet_of_things.equipment.productName"),
+          type: "select",
           data: [],
-          keyName: 'id',
-          labelName: 'name',
+          keyName: "id",
+          labelName: "name",
         },
         deviceName: {
-          label: this.$t('Internet_of_things.equipment.deviceName'),
+          label: this.$t("Internet_of_things.equipment.deviceName"),
         },
         nodeId: {
-          label: this.$t('Internet_of_things.equipment.nodeId'),
+          label: this.$t("Internet_of_things.equipment.nodeId"),
           span: 2,
         },
         secret: {
-          label: this.$t('Internet_of_things.equipment.secret'),
+          label: this.$t("Internet_of_things.equipment.secret"),
           disabled: true,
           span: 2,
         },
         otherButton: {
-          align: 'center',
+          align: "center",
           list: [
             {
-              name: this.$t('cancelText'),
-              methodsText: 'cancel',
+              name: this.$t("cancelText"),
+              methodsText: "cancel",
               cancel: () => {
-                this.open = false
+                this.open = false;
               },
             },
             {
-              name: this.$t('submitText'),
-              methodsText: 'submit',
-              type: 'primary',
+              name: this.$t("submitText"),
+              methodsText: "submit",
+              type: "primary",
               submit: () => {
-                this.handleSubmit()
+                this.handleSubmit();
               },
             },
           ],
         },
       },
       dialogRules: {
-        tdaApplicationId: [{ required: true, message: this.$t('Internet_of_things.equipment.tdaApplicationIdRules'), trigger: 'change' }],
-        tdaProductId: [{ required: true, message: this.$t('Internet_of_things.equipment.tdaProductIdRules'), trigger: 'change' }],
-        deviceName: [{ required: true, message: this.$t('Internet_of_things.equipment.deviceNameRules'), trigger: 'blur' }],
-        nodeId: [{ required: true, message: this.$t('Internet_of_things.equipment.nodeIdRules'), trigger: 'blur' }],
-        secret: [{ required: true, message: this.$t('Internet_of_things.equipment.secretRules'), trigger: 'blur' }],
+        tdaApplicationId: [
+          {
+            required: true,
+            message: this.$t(
+              "Internet_of_things.equipment.tdaApplicationIdRules"
+            ),
+            trigger: "change",
+          },
+        ],
+        tdaProductId: [
+          {
+            required: true,
+            message: this.$t("Internet_of_things.equipment.tdaProductIdRules"),
+            trigger: "change",
+          },
+        ],
+        deviceName: [
+          {
+            required: true,
+            message: this.$t("Internet_of_things.equipment.deviceNameRules"),
+            trigger: "blur",
+          },
+        ],
+        nodeId: [
+          {
+            required: true,
+            message: this.$t("Internet_of_things.equipment.nodeIdRules"),
+            trigger: "blur",
+          },
+        ],
+        secret: [
+          {
+            required: true,
+            message: this.$t("Internet_of_things.equipment.secretRules"),
+            trigger: "blur",
+          },
+        ],
       },
-    }
+    };
   },
   created() {
-    this.getSelectList()
+    this.getSelectList();
   },
   mounted() {
-    this.getList()
+    this.getList();
   },
   watch: {
-    'dialogParams.tdaApplicationId': {
+    "dialogParams.tdaApplicationId": {
       handler(val) {
         if (val) {
           APISelect.tdaProductList({ tdaApplicationId: val }).then((res) => {
-            this.dialogForm.tdaProductId.data = res.data.data
-          })
+            this.dialogForm.tdaProductId.data = res.data.data;
+          });
         } else {
-          this.dialogForm.tdaProductId.data = []
+          this.dialogForm.tdaProductId.data = [];
         }
-        this.dialogParams.tdaProductId = ''
+        this.dialogParams.tdaProductId = "";
       },
       immediate: true,
     },
@@ -183,75 +265,75 @@ export default {
   methods: {
     getSelectList() {
       APISelect.tdaApplicationList().then((res) => {
-        this.queryForm.tdaApplicationId.data = res.data.data
-        this.dialogForm.tdaApplicationId.data = res.data.data
-      })
+        this.queryForm.tdaApplicationId.data = res.data.data;
+        this.dialogForm.tdaApplicationId.data = res.data.data;
+      });
       APISelect.tdaProductList().then((res) => {
-        this.queryForm.tdaProductId.data = res.data.data
-      })
+        this.queryForm.tdaProductId.data = res.data.data;
+      });
     },
     getList() {
-      this.loading = true
+      this.loading = true;
       API.tdaDevicePage(this.queryParams).then(
         (res) => {
-          this.total = res.data.data.total
-          this.tableList = res.data.data.records
-          this.loading = false
+          this.total = res.data.data.total;
+          this.tableList = res.data.data.records;
+          this.loading = false;
         },
         (err) => {
-          console.log('tdaDevicePage: ' + err)
-          this.loading = false
-        },
-      )
+          console.log("tdaDevicePage: " + err);
+          this.loading = false;
+        }
+      );
     },
     handleAdd() {
       this.dialogParams = {
-        tdaApplicationId: '',
-        tdaProductId: '',
-        nodeId: '',
-        deviceName: '',
-        secret: 'Fjhx@2012#',
-      }
-      this.open = true
+        tdaApplicationId: "",
+        tdaProductId: "",
+        nodeId: "",
+        deviceName: "",
+        secret: "Fjhx@2012#",
+      };
+      this.open = true;
     },
     handleSubmit() {
-      this.$refs.test.$refs['form'].validate((valid) => {
+      this.$refs.test.$refs["form"].validate((valid) => {
         if (valid) {
-          this.dialogForm.loadingStatus = true
+          this.dialogForm.loadingStatus = true;
           API.tdaDeviceAdd(this.dialogParams).then(
             () => {
-              this.msgSuccess(this.$t('addSuccess'))
-              this.open = false
-              this.dialogForm.loadingStatus = false
-              this.getList()
+              this.msgSuccess(this.$t("addSuccess"));
+              this.open = false;
+              this.dialogForm.loadingStatus = false;
+              this.getList();
             },
             (err) => {
-              console.log('tdaDeviceAdd: ' + err)
-              this.dialogForm.loadingStatus = false
-            },
-          )
+              console.log("tdaDeviceAdd: " + err);
+              this.dialogForm.loadingStatus = false;
+            }
+          );
           // } else {
           //   setTimeout(() => {
           //     const errorDiv = document.getElementsByClassName('is-error')
           //     errorDiv[0].scrollIntoView()
           //   }, 0)
         }
-      })
+      });
     },
     handleDelete(row) {
-      this.$confirm(this.$t('askDeleteData'), {
-        confirmButtonText: this.$t('submitText'),
-        cancelButtonText: this.$t('cancelText'),
-        type: 'warning',
+      this.$confirm(this.$t("askDeleteData"), {
+        confirmButtonText: this.$t("submitText"),
+        cancelButtonText: this.$t("cancelText"),
+        type: "warning",
       }).then(() => {
         API.tdaDeviceDelete({ id: row.id }).then(() => {
-          this.msgSuccess(this.$t('deleteSuccess'))
-          this.getList()
-        })
-      })
+          this.msgSuccess(this.$t("deleteSuccess"));
+          this.getList();
+        });
+      });
     },
   },
-}
+};
 </script>
 
 <style lang="scss" scoped>