Browse Source

'全局搜索调试'

zhangyu 4 years ago
parent
commit
acfc88162f

+ 1 - 1
package.json

@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "axios": "^0.18.0",
-    "element-ui": "^2.13.1",
+    "element-ui": "^2.11.1",
     "font-awesome": "^4.7.0",
     "vue": "^2.5.2",
     "vue-axios": "^2.1.4",

+ 10 - 3
src/api/brand/index.js

@@ -2,7 +2,7 @@
  * @Author: zhangyu
  * @Date: 2020-05-13 11:18:18
  * @Info: 
- * @LastEditTime: 2020-05-18 11:27:42
+ * @LastEditTime: 2020-05-19 10:26:50
  */
 import {baseUrl} from '@/api/scan/config'
 import http from '@/api/scan/httpUtil'
@@ -44,14 +44,21 @@ export function brandUpdate(param, success) {
   http.postJson(url, param, success)
 }
 
-//查询品牌信息
+//查询品牌信息(返回结果有分组)
 export function brandQuery(param, success) {
   let url = `${baseUrl}/prod/brand/query`;
   http.postJson(url, param, success)
 }
 
+//根据关键词查询品牌信息(返回结果无分组)
+export function brandQueryByKeyword(param, success) {
+  let url = `${baseUrl}/prod/brand/queryByKeyword`;
+  http.postJson(url, param, success)
+}
+
 //根据条件查询统计数量
 export function brandCount(param, success) {
   let url = `${baseUrl}/prod/brand/count`;
   http.getJson(url, param, success)
-}
+}
+

+ 12 - 0
src/api/product/index.js

@@ -24,3 +24,15 @@ export function prodTypeUpdate(param, success) {
   let url = `${baseUrl}/prod/prodType/update`
   http.postJson(url, param, success)
 }
+
+//根据产品类型查询信息点
+export function defFuncidQuery(param, success) {
+  let url = `${baseUrl}/prod/defFuncid/query`
+  http.postJson(url, param, success)
+}
+
+//查询最近添加过的产品类型
+export function prodRecordQuery(param, success) {
+  let url = `${baseUrl}/prod/record/query`
+  http.postJson(url, param, success)
+}

BIN
src/assets/images/rectangle.png


File diff suppressed because it is too large
+ 10 - 6
src/assets/style/iconfont/iconfont.css


BIN
src/assets/style/iconfont/iconfont.eot


File diff suppressed because it is too large
+ 3 - 0
src/assets/style/iconfont/iconfont.svg


BIN
src/assets/style/iconfont/iconfont.ttf


BIN
src/assets/style/iconfont/iconfont.woff


+ 4 - 4
src/components/business/addBrand.vue

@@ -2,10 +2,10 @@
   <el-dialog :title="brand.BrandID?'品牌修改':'添加品牌'" :visible.sync="outerVisible" class="add-brand" width="600px">
     <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-position="top" class="reset-form">
       <el-form-item label="中文名称:" prop="BrandCname">
-        <el-input v-model="ruleForm.BrandCname" placeholder="请输入" />
+        <el-input v-model.trim="ruleForm.BrandCname" placeholder="请输入" />
       </el-form-item>
       <el-form-item label="英文名称:">
-        <el-input v-model="ruleForm.BrandName" placeholder="请输入" />
+        <el-input v-model.trim="ruleForm.BrandName" placeholder="请输入" />
       </el-form-item>
       <el-form-item label="品牌LOGO:">
         <div class="logo">
@@ -118,8 +118,8 @@ export default {
         if (valid) {
           let params = {
             Content: [{
-              BrandCname: this.ruleForm.BrandCname.replace(/(^\s*)|(\s*$)/g, ""),
-              BrandName: this.ruleForm.BrandName.replace(/(^\s*)|(\s*$)/g, ""),
+              BrandCname: this.ruleForm.BrandCname,
+              BrandName: this.ruleForm.BrandName,
               BrandLogo: this.ruleForm.BrandLogo,
             }]
           }

+ 16 - 15
src/components/product/productTool.vue

@@ -59,6 +59,7 @@ export default {
     },
     handProduct() {
       //跳转添加产品的路由
+      this.$router.push({path: 'supplement'})
     },
     // 取值
     getValue(item, node) {
@@ -94,22 +95,22 @@ export default {
 }
 </script>
 <style lang="scss" scoped>
-  .saga-toolbar-box {
-    position: absolute;
-    top: 48px;
-    left: 0;
-    width: 100%;
-    height: 70px;
-    background: #fff;
-    box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.5);
-    z-index: 11;
+.saga-toolbar-box {
+  position: absolute;
+  top: 48px;
+  left: 0;
+  width: 100%;
+  height: 70px;
+  background: #fff;
+  box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.5);
+  z-index: 11;
 
-    .saga-toolbar-main {
-      width: 1200px;
-      height: 100%;
-      margin: auto;
-      padding-top: 20px;
+  .saga-toolbar-main {
+    width: 1200px;
+    height: 100%;
+    margin: auto;
+    padding-top: 20px;
 
-    }
   }
+}
 </style>

+ 1 - 1
src/components/product/sagaProduct.vue

@@ -19,7 +19,7 @@
           </div>
           <div v-for="system in major.DefMajor" :key="system.Code" v-show="major.DefMajor && major.DefMajor.length">
             <div style="margin-bottom: 10px">
-              <img src="../../assets/images/rectangle.png" height="12">
+              <i class="iconfont iconjuxing" style="color:#3A8DDE;"></i>
               <span>{{system.Name}}</span>
             </div>
             <div class="sys" v-show="system.DefClass && system.DefClass.length">

+ 71 - 93
src/components/public/remoteSearch.vue

@@ -1,107 +1,85 @@
 <template>
-  <el-autocomplete
-    v-model.trim="state"
-    :fetch-suggestions="querySearchAsync"
-    placeholder="请输入关键词/拼音/首字母"
-    @select="handleSelect"
-    style="width: 360px"
-    class="reset-input"
-  >
+  <el-autocomplete v-model.trim="keyWord" :fetch-suggestions="querySearchAsync"
+    placeholder="请输入关键词/拼音/首字母" @select="handleSelect" style="width: 360px" class="reset-input">
     <i slot="prefix" class="el-input__icon el-icon-search"></i>
+    <!-- <template slot-scope="{ item }">
+      <div v-if="item.objectType == 'brand'" class="name">
+        {{ item.BrandCname }}{{ item.BrandName?`(${item.BrandName})`:'' }}
+      </div>
+      <div v-else class="name">
+        {{ item.AliasName }}{{ `(${item.AliasCode})` }}
+      </div>
+    </template> -->
   </el-autocomplete>
 </template>
 
 <script>
-  export default {
-    data() {
-      return {
-        restaurants: [],
-        state: '',
-        timeout: null
-      };
+import { dictionBrandQuery } from "@/api/dictionary"
+import { mapGetters } from "vuex"
+export default {
+  data() {
+    return {
+      keyWord: '',
+    };
+  },
+  computed: {
+    ...mapGetters('layout', ['dictionary']),
+  },
+  mounted() {
+    
+  },
+  methods: {
+    querySearchAsync(queryString, cb) {
+      if (queryString) {
+        let params = {
+          Keyword: queryString,
+          Type: this.dictionary.dictionaryType,
+          GroupId: this.dictionary.groupId,
+          ProjectId: this.dictionary.projectId,
+          PageSize: 5,
+        }
+        dictionBrandQuery(params, res => {
+          this.$nextTick(() => {
+            let brandList = res.Content[0].Brand.map(item => {
+              return Object.assign(item, {
+                value: `${item.BrandCname}${item.BrandName?`(${item.BrandName})`:''}`,
+                objectType: 'brand'
+              })
+            })
+            let prodTypeList = res.Content[0].ProdType.map(item => {
+              return Object.assign(item, {
+                value: `${item.DefMajor[0].DefClass[0].Name}(${item.DefMajor[0].DefClass[0].Code})`,
+                objectType: 'prodType'
+              })
+            })
+            let results = [...brandList, ...prodTypeList]
+            cb(results)
+          })
+        })
+      } else {
+        cb([])
+      }
     },
-    methods: {
-      loadAll() {
-        return [
-          {"value": "三全鲜食(北新泾店)", "address": "长宁区新渔路144号"},
-          {"value": "Hot honey 首尔炸鸡(仙霞路)", "address": "上海市长宁区淞虹路661号"},
-          {"value": "新旺角茶餐厅", "address": "上海市普陀区真北路988号创邑金沙谷6号楼113"},
-          {"value": "泷千家(天山西路店)", "address": "天山西路438号"},
-          {"value": "胖仙女纸杯蛋糕(上海凌空店)", "address": "上海市长宁区金钟路968号1幢18号楼一层商铺18-101"},
-          {"value": "贡茶", "address": "上海市长宁区金钟路633号"},
-          {"value": "豪大大香鸡排超级奶爸", "address": "上海市嘉定区曹安公路曹安路1685号"},
-          {"value": "茶芝兰(奶茶,手抓饼)", "address": "上海市普陀区同普路1435号"},
-          {"value": "十二泷町", "address": "上海市北翟路1444弄81号B幢-107"},
-          {"value": "星移浓缩咖啡", "address": "上海市嘉定区新郁路817号"},
-          {"value": "阿姨奶茶/豪大大", "address": "嘉定区曹安路1611号"},
-          {"value": "新麦甜四季甜品炸鸡", "address": "嘉定区曹安公路2383弄55号"},
-          {"value": "Monica摩托主题咖啡店", "address": "嘉定区江桥镇曹安公路2409号1F,2383弄62号1F"},
-          {"value": "浮生若茶(凌空soho店)", "address": "上海长宁区金钟路968号9号楼地下一层"},
-          {"value": "NONO JUICE  鲜榨果汁", "address": "上海市长宁区天山西路119号"},
-          {"value": "CoCo都可(北新泾店)", "address": "上海市长宁区仙霞西路"},
-          {"value": "快乐柠檬(神州智慧店)", "address": "上海市长宁区天山西路567号1层R117号店铺"},
-          {"value": "Merci Paul cafe", "address": "上海市普陀区光复西路丹巴路28弄6号楼819"},
-          {"value": "猫山王(西郊百联店)", "address": "上海市长宁区仙霞西路88号第一层G05-F01-1-306"},
-          {"value": "枪会山", "address": "上海市普陀区棕榈路"},
-          {"value": "纵食", "address": "元丰天山花园(东门) 双流路267号"},
-          {"value": "钱记", "address": "上海市长宁区天山西路"},
-          {"value": "壹杯加", "address": "上海市长宁区通协路"},
-          {"value": "唦哇嘀咖", "address": "上海市长宁区新泾镇金钟路999号2幢(B幢)第01层第1-02A单元"},
-          {"value": "爱茜茜里(西郊百联)", "address": "长宁区仙霞西路88号1305室"},
-          {"value": "爱茜茜里(近铁广场)", "address": "上海市普陀区真北路818号近铁城市广场北区地下二楼N-B2-O2-C商铺"},
-          {"value": "鲜果榨汁(金沙江路和美广店)", "address": "普陀区金沙江路2239号金沙和美广场B1-10-6"},
-          {"value": "开心丽果(缤谷店)", "address": "上海市长宁区威宁路天山路341号"},
-          {"value": "超级鸡车(丰庄路店)", "address": "上海市嘉定区丰庄路240号"},
-          {"value": "妙生活果园(北新泾店)", "address": "长宁区新渔路144号"},
-          {"value": "香宜度麻辣香锅", "address": "长宁区淞虹路148号"},
-          {"value": "凡仔汉堡(老真北路店)", "address": "上海市普陀区老真北路160号"},
-          {"value": "港式小铺", "address": "上海市长宁区金钟路968号15楼15-105室"},
-          {"value": "蜀香源麻辣香锅(剑河路店)", "address": "剑河路443-1"},
-          {"value": "北京饺子馆", "address": "长宁区北新泾街道天山西路490-1号"},
-          {"value": "饭典*新简餐(凌空SOHO店)", "address": "上海市长宁区金钟路968号9号楼地下一层9-83室"},
-          {"value": "焦耳·川式快餐(金钟路店)", "address": "上海市金钟路633号地下一层甲部"},
-          {"value": "动力鸡车", "address": "长宁区仙霞西路299弄3号101B"},
-          {"value": "浏阳蒸菜", "address": "天山西路430号"},
-          {"value": "四海游龙(天山西路店)", "address": "上海市长宁区天山西路"},
-          {"value": "樱花食堂(凌空店)", "address": "上海市长宁区金钟路968号15楼15-105室"},
-          {"value": "壹分米客家传统调制米粉(天山店)", "address": "天山西路428号"},
-          {"value": "福荣祥烧腊(平溪路店)", "address": "上海市长宁区协和路福泉路255弄57-73号"},
-          {"value": "速记黄焖鸡米饭", "address": "上海市长宁区北新泾街道金钟路180号1层01号摊位"},
-          {"value": "红辣椒麻辣烫", "address": "上海市长宁区天山西路492号"},
-          {"value": "(小杨生煎)西郊百联餐厅", "address": "长宁区仙霞西路88号百联2楼"},
-          {"value": "阳阳麻辣烫", "address": "天山西路389号"},
-          {"value": "南拳妈妈龙虾盖浇饭", "address": "普陀区金沙江路1699号鑫乐惠美食广场A13"}
-        ];
-      },
-      querySearchAsync(queryString, cb) {
-        var restaurants = this.restaurants;
-        var results = queryString ? restaurants.filter(this.createStateFilter(queryString)) : restaurants;
+    handleSelect(item) {
+      if (item.objectType == 'brand') {
+
+      } else {
 
-        clearTimeout(this.timeout);
-        this.timeout = setTimeout(() => {
-          cb(results);
-        }, 3000 * Math.random());
-      },
-      createStateFilter(queryString) {
-        return (state) => {
-          return (state.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
-        };
-      },
-      handleSelect(item) {
-        console.log(item);
       }
-    },
-    mounted() {
-      this.restaurants = this.loadAll();
     }
-  };
+  }
+};
 </script>
 
-<style scoped lang="less">
-  .reset-input {
-    /deep/ .el-input__inner {
-      background: #F6F6F6;
-
-    }
+<style scoped lang="scss">
+.reset-input {
+  /deep/ .el-input__inner {
+    background: #f6f6f6;
   }
+}
+</style>
+<style>
+.el-autocomplete-suggestion li {
+  border-bottom: 1px solid #ebebeb;
+}
 </style>

+ 334 - 365
src/components/supplement/sagaSupplement.vue

@@ -1,413 +1,382 @@
 <template>
   <div class="saga-supplement-box">
-      <div class="saga-brand-box">
-        <el-tabs :tab-position="tabPosition" class="reset-steps" @tab-click="jump" v-model="stepActive">
-          <el-tab-pane
-            :label="item.name || '信息'"
-            v-for="(item,index) in labelKey"
-            :key="item.name"/>
-        </el-tabs>
-        <el-form
-          label-position="top"
-          :model="ruleForm"
-          :rules="rules"
-          ref="ruleForm"
-        >
-          <section class="d_jump">
-            <p class="title">
-              <img src="../../assets/images/rectangle.png" height="16" style="vertical-align: middle">
-              基本信息</p>
-            <el-form-item label="产品类型" prop="product">
-              <el-select v-model="ruleForm.product" placeholder="请选择">
-                <el-option-group
-                  v-for="group in productList"
-                  :key="group.label"
-                  :labe="group.label"
-                >
-                  <el-option
-                    v-for="item in group.options"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value"
-                  >
+    <div class="saga-brand-box">
+      <el-tabs :tab-position="tabPosition" class="reset-steps" @tab-click="jump" v-model="stepActive">
+        <el-tab-pane :label="item.name || '信息'" v-for="item in labelKey" :key="item.name" />
+      </el-tabs>
+      <el-form label-position="top" :model="ruleForm" :rules="rules" ref="ruleForm">
+        <section class="d_jump">
+          <p class="title"><i class="iconfont iconjuxing" style="color:#3A8DDE;"></i>基本信息</p>
+          <el-form-item label="产品类型" prop="product">
+            <el-select v-model="ruleForm.product" placeholder="请选择">
+              <el-option-group v-for="group in productList" :key="group.label" :label="group.label">
+                <el-option v-for="item in group.options" :key="item.value" :label="item.label" :value="item.value"></el-option>
+              </el-option-group>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="品牌" prop="brand">
+            <el-select v-model="ruleForm.brand" multiple :multiple-limit="1" filterable @focus="focus" remote
+              placeholder="请选择" :remote-method="remoteMethods" :loading="loading">
+              <el-option v-for="item in brandList" :key="item.value" :label="item.label" :value="item.value" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="型号" prop="type">
+            <el-input v-model="ruleForm.type" />
+          </el-form-item>
+        </section>
+        <section class="d_jump">
+          <p class="title"><i class="iconfont iconjuxing" style="color:#3A8DDE;"></i>技术参数</p>
+          <el-form-item label="CPU规格:">
+            <el-input />
+          </el-form-item>
+          <el-form-item label="CPU规格:">
+            <el-input />
+          </el-form-item>
+          <el-form-item label="CPU规格:">
+            <el-input />
+          </el-form-item>
+          <el-form-item label="CPU规格:">
+            <el-input />
+          </el-form-item>
+          <el-form-item label="CPU规格:">
+            <el-input />
+          </el-form-item>
+          <el-form-item label="CPU规格:">
+            <el-input />
+          </el-form-item>
+          <el-form-item label="CPU规格:">
+            <el-input />
+          </el-form-item>
+          <el-form-item label="CPU规格:">
+            <el-input />
+          </el-form-item>
+          <el-form-item label="CPU规格:">
+            <el-input />
+          </el-form-item>
+          <el-form-item label="CPU规格:">
+            <el-input />
+          </el-form-item>
+          <el-form-item label="CPU规格:">
+            <el-input />
+          </el-form-item>
 
-                  </el-option>
-                </el-option-group>
-              </el-select>
-            </el-form-item>
-            <el-form-item label="品牌" prop="brand">
-              <el-select
-                v-model="ruleForm.brand"
-                multiple
-                :multiple-limit="1"
-                filterable
-                @focus="focus"
-                remote
-                placeholder="请选择"
-                :remote-method="remoteMethods"
-                :loading="loading"
-              >
-                <el-option
-                  v-for="item in brandList"
-                  :key="item.value"
-                  :label="item.label"
-                  :value="item.value"
-                />
-              </el-select>
-            </el-form-item>
-            <el-form-item label="型号" prop="type">
-              <el-input v-model="ruleForm.type"/>
-            </el-form-item>
-          </section>
-          <section class="d_jump">
-            <p class="title">
-              <img src="../../assets/images/rectangle.png" height="16" style="vertical-align: middle"/>
-              技术参数
-            </p>
-            <el-form-item label="CPU规格:">
-              <el-input  />
-            </el-form-item>
-            <el-form-item label="CPU规格:">
-              <el-input/>
-            </el-form-item>
-            <el-form-item label="CPU规格:">
-              <el-input/>
-            </el-form-item>
-            <el-form-item label="CPU规格:">
-              <el-input/>
-            </el-form-item>
-            <el-form-item label="CPU规格:">
-              <el-input/>
-            </el-form-item>
-            <el-form-item label="CPU规格:">
-              <el-input/>
-            </el-form-item>
-            <el-form-item label="CPU规格:">
-              <el-input/>
-            </el-form-item>
-            <el-form-item label="CPU规格:">
-              <el-input/>
-            </el-form-item>
-            <el-form-item label="CPU规格:">
-              <el-input/>
-            </el-form-item>
-            <el-form-item label="CPU规格:">
-              <el-input/>
-            </el-form-item>
-            <el-form-item label="CPU规格:">
-              <el-input/>
-            </el-form-item>
-
-
-          </section>
-          <section class="d_jump">
-            <p class="title">
-              <img src="../../assets/images/rectangle.png" height="16" style="vertical-align: middle">
-              附件信息
-            </p>
-            <el-form-item label="设备文档:">
-              <uploadFiles
-                :readOnly="read"
-                :keysArr="keysArr"
-                @change="changeItem"
-              />
-            </el-form-item>
-          </section>
-        </el-form>
-      </div>
+        </section>
+        <section class="d_jump">
+          <p class="title"><i class="iconfont iconjuxing" style="color:#3A8DDE;"></i>附件信息</p>
+          <el-form-item label="设备文档:">
+            <uploadFiles :readOnly="read" :keysArr="keysArr" @change="changeItem" />
+          </el-form-item>
+        </section>
+      </el-form>
+    </div>
   </div>
 </template>
 
 <script>
-  import uploadFiles from "../public/uploadFiles";
+import uploadFiles from "@/components/public/uploadFiles"
+import { prodRecordQuery } from "@/api/product"
+import { mapGetters } from "vuex"
 
-  export default {
-    components: {uploadFiles},
-    created() {
+export default {
+  components: { uploadFiles },
+  created() {
+    this.getProdType()
+  },
+  mounted() {
+    // this.$refs.ruleForm.validate(valid => {
+    //   console.log(valid)
+    // })
 
-    },
-    mounted() {
-      // this.$refs.ruleForm.validate(valid => {
-      //   console.log(valid)
-      // })
+    let listener = document.querySelector('.saga-brand-box')
+    listener.addEventListener('scroll', this.onScroll)
+    //  option
+    this.list = this.states.map(item => {
+      return { value: `value:${item}`, label: `label:${item}` }
+    })
 
-      let listener = document.querySelector('.saga-brand-box')
-      listener.addEventListener('scroll', this.onScroll)
-      //  option
-      this.list = this.states.map(item => {
-        return {value: `value:${item}`, label: `label:${item}`}
-      })
-
-    },
-    data() {
-      let checkBrand = (rule, value, callback) => {
-        if (value == '') {
-          return callback(new Error('请选择品牌'))
-        } else {
-          callback()
-        }
+  },
+  data() {
+    let checkBrand = (rule, value, callback) => {
+      if (value == '') {
+        return callback(new Error('请选择品牌'))
+      } else {
+        callback()
       }
-      return {
-        read: false,
-        list: [],
-        keysArr: [],
-        loading: false,
-        states: ["Alabama", "Alaska", "Arizona",
-          "Arkansas", "California", "Colorado",
-          "Connecticut", "Delaware", "Florida",
-          "Georgia", "Hawaii", "Idaho", "Illinois",
-          "Indiana", "Iowa", "Kansas", "Kentucky",
-          "Louisiana", "Maine", "Maryland",
-          "Massachusetts", "Michigan", "Minnesota",
-          "Mississippi", "Missouri", "Montana",
-          "Nebraska", "Nevada", "New Hampshire",
-          "New Jersey", "New Mexico", "New York",
-          "North Carolina", "North Dakota", "Ohio",
-          "Oklahoma", "Oregon", "Pennsylvania",
-          "Rhode Island", "South Carolina",
-          "South Dakota", "Tennessee", "Texas",
-          "Utah", "Vermont", "Virginia",
-          "Washington", "West Virginia", "Wisconsin",
-          "Wyoming"],
-        bbs: [{
-          value: '选项1',
-          label: '黄金糕'
-        }, {
-          value: '选项2',
-          label: '双皮奶'
-        }, {
-          value: '选项3',
-          label: '蚵仔煎'
-        }, {
-          value: '选项4',
-          label: '龙须面'
+    }
+    return {
+      read: false,
+      list: [],
+      keysArr: [],
+      loading: false,
+      states: ["Alabama", "Alaska", "Arizona",
+        "Arkansas", "California", "Colorado",
+        "Connecticut", "Delaware", "Florida",
+        "Georgia", "Hawaii", "Idaho", "Illinois",
+        "Indiana", "Iowa", "Kansas", "Kentucky",
+        "Louisiana", "Maine", "Maryland",
+        "Massachusetts", "Michigan", "Minnesota",
+        "Mississippi", "Missouri", "Montana",
+        "Nebraska", "Nevada", "New Hampshire",
+        "New Jersey", "New Mexico", "New York",
+        "North Carolina", "North Dakota", "Ohio",
+        "Oklahoma", "Oregon", "Pennsylvania",
+        "Rhode Island", "South Carolina",
+        "South Dakota", "Tennessee", "Texas",
+        "Utah", "Vermont", "Virginia",
+        "Washington", "West Virginia", "Wisconsin",
+        "Wyoming"],
+      bbs: [{
+        value: '选项1',
+        label: '黄金糕'
+      }, {
+        value: '选项2',
+        label: '双皮奶'
+      }, {
+        value: '选项3',
+        label: '蚵仔煎'
+      }, {
+        value: '选项4',
+        label: '龙须面'
+      }, {
+        value: '选项5',
+        label: '北京烤鸭'
+      }],
+      brandList: [{
+        value: '选项1',
+        label: '黄金糕'
+      }, {
+        value: '选项2',
+        label: '双皮奶'
+      }, {
+        value: '选项3',
+        label: '蚵仔煎'
+      }, {
+        value: '选项4',
+        label: '龙须面'
+      }, {
+        value: '选项5',
+        label: '北京烤鸭'
+      }],
+      productList: [{
+        label: '热门城市',
+        options: [{
+          value: 'Shanghai',
+          label: '上海'
         }, {
-          value: '选项5',
-          label: '北京烤鸭'
-        }],
-        brandList: [{
-          value: '选项1',
-          label: '黄金糕'
+          value: 'Beijing',
+          label: '北京'
+        }]
+      }, {
+        label: '城市名',
+        options: [{
+          value: 'Chengdu',
+          label: '成都'
         }, {
-          value: '选项2',
-          label: '双皮奶'
+          value: 'Shenzhen',
+          label: '深圳'
         }, {
-          value: '选项3',
-          label: '蚵仔煎'
+          value: 'Guangzhou',
+          label: '广州'
         }, {
-          value: '选项4',
-          label: '龙须面'
+          value: 'Dalian',
+          label: '大连'
+        }]
+      }],
+      labelKey: [
+        {
+          name: '基本信息',
         }, {
-          value: '选项5',
-          label: '北京烤鸭'
-        }],
-        productList: [{
-          label: '热门城市',
-          options: [{
-            value: 'Shanghai',
-            label: '上海'
-          }, {
-            value: 'Beijing',
-            label: '北京'
-          }]
+          name: '技术参数',
         }, {
-          label: '城市名',
-          options: [{
-            value: 'Chengdu',
-            label: '成都'
-          }, {
-            value: 'Shenzhen',
-            label: '深圳'
-          }, {
-            value: 'Guangzhou',
-            label: '广州'
-          }, {
-            value: 'Dalian',
-            label: '大连'
-          }]
-        }],
-        labelKey: [
-          {
-            name: '基本信息',
-          }, {
-            name: '技术参数',
-          }, {
-            name: '附件信息',
-          }
-        ],
-        stepActive: '0',
-        tabPosition: 'left',
-        ruleForm: {
-          product: '',
-          brand: '',
-          type: '',
-
-        },
-        rules: {
-          product: [
-            {required: true, message: '请选择产品类型', trigger: 'change'}
-          ],
-          brand: [
-            {required: true, validator: checkBrand, trigger: 'focus,blur'}
-          ],
-          type: [
-            {required: true, message: '请输入型号', trigger: 'blur'}
-          ]
+          name: '附件信息',
         }
+      ],
+      stepActive: '0',
+      tabPosition: 'left',
+      ruleForm: {
+        product: '',
+        brand: '',
+        type: '',
+
+      },
+      rules: {
+        product: [
+          { required: true, message: '请选择产品类型', trigger: 'change' }
+        ],
+        brand: [
+          { required: true, validator: checkBrand, trigger: 'focus,blur' }
+        ],
+        type: [
+          { required: true, message: '请输入型号', trigger: 'blur' }
+        ]
       }
+    }
+  },
+  computed: {
+    ...mapGetters('layout', ['dictionary']),
+  },
+  methods: {
+    getProdType() {
+      let params = {
+        Type: this.dictionary.dictionaryType,
+        GroupId: this.dictionary.groupId,
+        ProjectId: this.dictionary.projectId,
+      }
+      prodRecordQuery(params, res => {
+        debugger
+      })
     },
-    methods: {
-      jump(tab, event) {
-        this.stepActive = tab.index
-        let jump = document.querySelectorAll('.d_jump'),
-          total = jump[this.stepActive].offsetTop,//获取需要滚动的距离
-          listener = document.querySelector('.saga-brand-box'),
-          distance = listener.scrollTop,
-          step = total / 50;
-        if (total > distance) {
-          smoothDown()
-        } else {
-          let newTotal = distance - total + 100
-          step = newTotal / 50
-          smoothUp()
-        }
+    jump(tab, event) {
+      this.stepActive = tab.index
+      let jump = document.querySelectorAll('.d_jump'),
+        total = jump[this.stepActive].offsetTop,//获取需要滚动的距离
+        listener = document.querySelector('.saga-brand-box'),
+        distance = listener.scrollTop,
+        step = total / 50;
+      if (total > distance) {
+        smoothDown()
+      } else {
+        let newTotal = distance - total + 100
+        step = newTotal / 50
+        smoothUp()
+      }
 
-        function smoothDown() {
-          if (distance < total) {
-            distance += step
-            listener.scrollTop = distance
-            setTimeout(smoothDown, 10)
-          } else {
-            listener.scrollTop = total
-          }
+      function smoothDown() {
+        if (distance < total) {
+          distance += step
+          listener.scrollTop = distance
+          setTimeout(smoothDown, 10)
+        } else {
+          listener.scrollTop = total
         }
+      }
 
-        function smoothUp() {
-          if (distance > total) {
-            distance -= step
-            listener.scrollTop = distance
-            setTimeout(smoothUp, 10)
-          } else {
-            listener.scrollTop = total
-          }
+      function smoothUp() {
+        if (distance > total) {
+          distance -= step
+          listener.scrollTop = distance
+          setTimeout(smoothUp, 10)
+        } else {
+          listener.scrollTop = total
         }
-      },
-      onScroll() {
-        let scrolled = document.querySelector('.saga-brand-box').scrollTop
-        let jump = document.querySelectorAll('.d_jump')
-        for (let i = 0; i < jump.length; i++) {
-          if (jump[i].offsetTop >= scrolled) {
-            this.stepActive = i.toString()
-            break
+      }
+    },
+    onScroll() {
+      let scrolled = document.querySelector('.saga-brand-box').scrollTop
+      let jump = document.querySelectorAll('.d_jump')
+      for (let i = 0; i < jump.length; i++) {
+        if (jump[i].offsetTop >= scrolled) {
+          this.stepActive = i.toString()
+          break
 
-          }
         }
-      },
-      remoteMethods(query) {
-        console.log(query, 'query')
-        if (query !== '') {
-          this.loading = true
-          setTimeout(() => {
-            this.loading = false
-            this.brandList = this.list.filter(item => {
-              return item.label.toLowerCase().indexOf(query.toLowerCase()) > -1
-            })
-          }, 200)
+      }
+    },
+    remoteMethods(query) {
+      console.log(query, 'query')
+      if (query !== '') {
+        this.loading = true
+        setTimeout(() => {
+          this.loading = false
+          this.brandList = this.list.filter(item => {
+            return item.label.toLowerCase().indexOf(query.toLowerCase()) > -1
+          })
+        }, 200)
+      } else {
+        this.brandList = []
+      }
+    },
+    focus() {
+      this.brandList = this.bbs
+    },
+    submitForm() {
+      this.$refs.ruleForm.validate((valid) => {
+        if (valid) {
+          console.log(this.ruleForm);
         } else {
-          this.brandList = []
+          console.log('error submit!!');
+          return false;
         }
-      },
-      focus() {
-        this.brandList = this.bbs
-      },
-      submitForm() {
-        this.$refs.ruleForm.validate((valid) => {
-          if (valid) {
-            console.log(this.ruleForm);
-          } else {
-            console.log('error submit!!');
-            return false;
-          }
-        });
-      },
-      changeItem(file) {
-        let arr = []
-        file.forEach(({Key}) => arr.push({Key}))
-      }
+      });
     },
-    watch: {}
-  }
+    changeItem(file) {
+      let arr = []
+      file.forEach(({ Key }) => arr.push({ Key }))
+    }
+  },
+  watch: {}
+}
 </script>
 <style lang="scss" scoped>
-  @media screen and (max-width: 1500px) {
-    .saga-supplement-box {
-      height: 500px;
-      border: 1px solid #42b983;
-    }
-  }
-
+@media screen and (max-width: 1500px) {
   .saga-supplement-box {
-    position: relative;
-    height: 800px;
-    margin-top: 90px;
+    height: 500px;
+    border: 1px solid #42b983;
+  }
+}
 
-    .saga-brand-box {
-      width: 100%;
-      max-height: 800px;
-      /*margin-top: 90px;*/
-      padding: 16px;
-      box-sizing: border-box;
-      background: rgba(255, 255, 255, 1);
-      overflow-y: auto;
+.saga-supplement-box {
+  position: relative;
+  height: 800px;
+  margin-top: 90px;
 
-      .reset-steps {
-        position: absolute;
-        left: 0;
-        top: 0;
-        height: 100%;
-      }
+  .saga-brand-box {
+    width: 100%;
+    max-height: 800px;
+    /*margin-top: 90px;*/
+    padding: 16px;
+    box-sizing: border-box;
+    background: rgba(255, 255, 255, 1);
+    overflow-y: auto;
 
-      .d_jump {
-        display: inline-block;
-        width: calc(100% - 108px);
-        position: relative;
-        left: 100px;
-
-        .title {
-          margin: 25px 70px;
-          padding-bottom: 10px;
-          font-size: 16px;
-          color: #1F2429;
-          border-bottom: 1px solid #EFF0F1;
-        }
+    .reset-steps {
+      position: absolute;
+      left: 0;
+      top: 0;
+      height: 100%;
+    }
 
+    .d_jump {
+      display: inline-block;
+      width: calc(100% - 108px);
+      position: relative;
+      left: 100px;
 
-        /deep/ .el-input__inner {
-          width: 320px;
-        }
+      .title {
+        margin: 25px 70px;
+        padding-bottom: 10px;
+        font-size: 16px;
+        color: #1f2429;
+        border-bottom: 1px solid #eff0f1;
       }
 
-      .el-form-item--mini.el-form-item, .el-form-item--small.el-form-item {
-        padding: 0 340px;
+      /deep/ .el-input__inner {
+        width: 320px;
       }
     }
 
-    /deep/ .el-scrollbar__wrap {
-      overflow-x: hidden;
+    .el-form-item--mini.el-form-item,
+    .el-form-item--small.el-form-item {
+      padding: 0 340px;
     }
   }
 
-  ::-webkit-scrollbar-thumb {
-    height: 50px;
-    outline-offset: -2px;
-    outline: 2px solid #dddee0;
-    border: 2px solid #dddee0;
-    background-color: #dddee0;
-    border-radius: 4px;
+  /deep/ .el-scrollbar__wrap {
+    overflow-x: hidden;
   }
+}
 
-  ::-webkit-scrollbar {
-    width: 8px;
-    height: 8px;
-  }
+::-webkit-scrollbar-thumb {
+  height: 50px;
+  outline-offset: -2px;
+  outline: 2px solid #dddee0;
+  border: 2px solid #dddee0;
+  background-color: #dddee0;
+  border-radius: 4px;
+}
+
+::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+}
 </style>

+ 1 - 3
src/components/supplement/supplementTool.vue

@@ -1,9 +1,7 @@
 <template>
   <div class="saga-toolbar-box">
     <div class="saga-toolbar-main">
-      <p class="supplement-title">
-        <img src="../../assets/images/rectangle.png" height="16" alt="">
-        添加产品</p>
+      <p class="supplement-title"><i class="iconfont iconjuxing" style="color:#3A8DDE;"></i>添加产品</p>
       <span class="fr">
       <el-button>取消</el-button>
       <el-button type="primary" @click="addProduct">创建</el-button>

+ 2 - 2
src/views/supplement/index.vue

@@ -6,8 +6,8 @@
 </template>
 
 <script>
-  import supplementTool from "../../components/supplement/supplementTool";
-  import sagaSupplement from "../../components/supplement/sagaSupplement";
+  import supplementTool from "@/components/supplement/supplementTool";
+  import sagaSupplement from "@/components/supplement/sagaSupplement";
 
   export default {
     name: "index",