xiebeibei преди 4 години
родител
ревизия
046011d4af
променени са 4 файла, в които са добавени 285 реда и са изтрити 94 реда
  1. 15 3
      src/api/editer.js
  2. 1 1
      src/components/edit/attr_select.vue
  3. 265 64
      src/components/edit/edit-dialog.vue
  4. 4 26
      src/components/edit/search_tree.vue

+ 15 - 3
src/api/editer.js

@@ -31,7 +31,19 @@ export function uploadImg({
 export function getGraphElementType(params){
     return httputils.postJson(`${testApi}/graphElement/type/query`, params)
 }
-//查询工程信息化tree数据
-export function querySystem(params){
-    return httputils.postJson(`${dataApi}/data/t_system_wzfl/query`, params)
+// 设备设施-主要设备清单-详情
+export function queryGlsmsasset(data,params){
+    return httputils.postJson(`${dataApi}/data/glsms_asset/query?plazaId=${data.plazaId}&page=${data.page}&size=${data.size}&type=${data.type}`, params)
 }
+// 查询楼层清单
+export function getPlazaFloor(data,params){
+    return httputils.postJson(`${dataApi}/plaza/floor?plazaId=${data.plazaId}`, params)
+}
+// 查询专业系统
+export function getQuerySmsxt(params){
+    return httputils.postJson(`${dataApi}/data/v_glsms_systemcfg/querySmsxt`, params)
+}
+// 查询工程信息化tree数据
+export function getQuerySmsxtBy(data,params){
+    return httputils.postJson(`${dataApi}/data/t_system_wzfl/queryBySmsxt?smsxt=${data.smsxt}`, params)
+}

+ 1 - 1
src/components/edit/attr_select.vue

@@ -178,7 +178,7 @@
         </a-collapse-panel>
       </a-collapse>
     </div>
-    <editDialog ref="dialog" />
+    <editDialog ref="dialog" :typeEdit="1" :getmajorId="1001" :sysNum="5" />
   </div>
 </template>
 

+ 265 - 64
src/components/edit/edit-dialog.vue

@@ -1,5 +1,5 @@
 <template>
-  <a-modal v-model="visible" title="选择编辑" on-ok="handleOk" width="1200px" class="edit-dialog">
+  <a-modal v-model="visible"  title="选择编辑" on-ok="handleOk" width="1200px" class="edit-dialog">
     <template slot="footer">
       <a-button key="back" @click="handleCancel">
         取消
@@ -12,48 +12,50 @@
       <div class="left">
         <div class="header">
           <div class="select">
-            <a-select default-value="全部" style="width:90%;margin-left: 10px" @change="handleMajor">
-              <a-select-option :value="item.value" v-for="item in majorList" :key="item.value">
-                {{item.value}}
-              </a-select-option>
-            </a-select>
+            <Select style="margin: 0 10px"
+                    v-model="majorId"
+                    @change="handleMajor"
+                    :hideClear='true'
+                    :selectdata="majorList"
+                    :placeholder="'请选择'"
+                    class="search-select"
+                    width="236"
+            />
           </div>
           <div class="search">
             <Select
-                v-model="model"
-                caption="所属系统:"
-                :isReadOnly="true"
-                @change="testClick"
+                v-model="floorId"
+                caption="所属楼层:"
+                @change="chageFloor"
                 :hideClear='true'
-                :selectdata="dataSelect2"
+                :selectdata="dataFloor"
                 :placeholder="'请选择'"
                 class="search-select"
                 width="236"
             />
-            <a-input-search placeholder="搜索" class="press-enter" @search="onSearch"/>
+            <a-input-search placeholder="搜索" class="press-enter" @search="onSearch" v-model="keyword"/>
 
           </div>
         </div>
         <div class="tree">
-          <searchTree  @getTreeId="getTreeId"/>
+          <searchTree  @getTreeId="getTreeId" :treeData="treeData"/>
         </div>
         <div class="checkbox">
-          <a-checkbox-group @change="ChangeCheckbox">
-            <a-checkbox v-for="item in plainOptions" :value="item" :key="item" style="display: block">{{item}}
-            </a-checkbox>
-          </a-checkbox-group>
-
+          <a-table :pagination="false" row-key='sbjbm' :columns="typeEdit==1?columnsSys:columnsLocal" :data-source="tableData"  :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange,onSelect:onSelect }" :scroll="{ y: 340 }"  :loading="loading"/>
+          <a-pagination v-if="total>0" v-model="page" :total="total" show-less-items style="margin-left: auto;"  @change="handleTableChange"/>
         </div>
       </div>
       <div class="right">
         <div class="header">
-          <span class="select-number">已选择 <b>2</b>/4</span>
-          <a-button type="link" class="link">清空</a-button>
+          <span class="select-number">已选择 <b>{{selectList.length}}</b>/{{sysNum}}</span>
+          <a-button type="link" class="link" @click="clearSelectList">清空</a-button>
         </div>
 
-        <p v-for="(item,index) in selectList" :key="index" class="list">{{item.value}}
-          <a-icon type="close" class="icon"/>
-        </p>
+        <div class="list-box">
+          <p v-for="(item,index) in selectList" :key="index" class="list">{{item.sbjc}}
+            <a-icon type="close" class="icon" @click="deleteItem(item,index)"/>
+          </p>
+        </div>
 
       </div>
     </div>
@@ -62,36 +64,75 @@
 
 <script>
     import searchTree from "@/components/edit/search_tree";
-
+    import {queryGlsmsasset ,getQuerySmsxt,getPlazaFloor,getQuerySmsxtBy} from "@/api/editer";
     export default {
         name: "edit-dialog",
         components: {searchTree},
+      props:{
+        typeEdit:Number , //用于区分是设备 还是  位置
+        getmajorId:Number, //专业Id
+        sysNum:Number //设备总数
+      },
         data() {
             return {
                 loading: false,
                 visible: false,
                 model: 'test1',
                 searchName: '',
-                dataSelect2: [
-                    {id: 'test1', name: '全部'},
-                    {id: 'test2', name: '单平米'},
-                    {id: 'test3', name: '下级分项'},
-                    {id: 'test4', name: '滑动平均滑动平均'}
-                ],
-                selectList: [
-                    {value: '福建三明万达-供电系统-6楼-工程信息化中的区域编码ND18247283742387443345435'},
-                    {value: '福建三明万达-供电系统-6楼-工程信息化中的区域编码ND18247283742387443345435福建三明万达-供电系统-6楼-工程信息化中的区域编码ND18247283742387443345435'},
-                ],
+                floorId:"",//所属楼层
+                dataFloor: [],
+                selectList: [],
                 plainOptions: ['福建三明万达-供电系统-6楼-工程信息化中的区域编码ND182472e83742', '福建三明万达-供电系统-6楼-工程信息化中的区域编码ND18247283742'],
-                majorList: [
-                    {value: '全部'}, {value: 'luck'}, {value: 'tom'}
-                ],
+                majorList: [],
                 checkedList: [],
-
-
+              keyword:'',
+              classstructureid:'',
+              locfl:'',
+              columnsSys : [
+                {
+                  title: '设备名称',
+                  dataIndex: 'sbjc',
+                  key: 'sbjc',
+                  width: '75%',
+                  scopedSlots: { customRender: 'sbjc' },
+                },
+                {
+                  title: '设备内码',
+                  dataIndex: 'sbxh',
+                  key: 'sbjbm',
+                  width: '25%',
+                },
+              ],
+              columnsLocal : [
+                {
+                  title: '位置名称',
+                  dataIndex: 'name',
+                  key: 'name',
+                  width: '75%',
+                  scopedSlots: { customRender: 'name' },
+                },
+                {
+                  title: '位置内码',
+                  dataIndex: 'code',
+                  key: 'code',
+                  width: '25%',
+                },
+              ],
+              tableData:[],
+              loading:false,
+              page:1,
+              size:10,
+              selectedRowKeys:[],
+              treeData:[],
+              total:0
             }
         },
+        computed:{
+          majorId(){
+            return  this.getmajorId||''
+          }
 
+        },
         methods: {
             showModal() {
                 this.visible = true;
@@ -101,33 +142,178 @@
                 setTimeout(() => {
                     this.visible = false;
                     this.loading = false;
+                  console.log(this.selectedRowKeys);
                 }, 3000);
             },
             handleCancel(e) {
                 this.visible = false;
             },
             onSearch(value) {
-                console.log(value);
+                this.queryGlsmsasset()
             },
             ChangeCheckbox(val) {
                 console.log(val)
             },
-
-
             handleMajor(val) {
-                console.log(val)
+              this.getQuerySmsxtBy(val.id)
             },
-            testClick(data) {
-                console.log(data)
+            chageFloor(data) {
+              this.queryGlsmsasset();
             },
             pressEnter(e) {
                 console.log(e)
             },
-          getTreeId(id){
-              console.log(id);
+            //获取treeId --classstructureid
+            getTreeId(id) {
+              if(this.typeEdit==1){
+                this.classstructureid = id;
+              }else if(this.typeEdit==2){
+                this.locfl = id;
+              }
+
+             this.queryGlsmsasset();
+            },
+          //获取表格数据
+          queryGlsmsasset(){
+            let data = {
+              plazaId: '1000423',//广场id 必填
+              page: this.page,//页数
+              size: this.size,//条数
+              type: this.typeEdit,//类型
             }
-        }
+            if (this.keyword) {
+              data.keyword = `${this.keyword}:brand`
+            }
+            let paramData =  {classstructureid: this.classstructureid,floor:this.floorId};
+            let paramDataLocal =  {locfl: this.locfl,floor:this.floorId};
+            this.loading = true;
+            queryGlsmsasset(data,this.typeEdit==1?paramData:paramDataLocal).then(res => {
+              this.loading = false;
+              if(res.result == 'success'){
+                this.total = res.count;
+                if(res.data){
+                  this.tableData = res.data;
+                }else if(res.count == 0){
+                  this.tableData = [];
+                }
+              }else{
+                this.$message.error('数据请求失败')
+              }
+            })
+          },
+          //分页切换点击
+          handleTableChange(page, pageSize) {
+            this.page = page;
+            this.queryGlsmsasset();
+          },
+          onSelect(record, selected, selectedRows, nativeEvent){
+            if(!selected  && this.selectList.length>0){
+              this.selectList.map((item,index)=>{
+                if( item.sbjbm == record.sbjbm){
+                  this.selectList.splice(index,1);
+                }
+              })
+            }
+          },
+          // 中间表格勾选
+          onSelectChange(selectedRowKeys,selectedRows) {
+            this.selectedRowKeys = selectedRowKeys;
+              if(this.selectedRowKeys.length>this.sysNum){
+                this.selectedRowKeys.pop();
+                this.$message.error('不能超过设备数')
+                return false;
+              }
+            selectedRows.map(item=>{
+              this.selectList.push(item)
+            })
+            let obj = {}
+
+            this.selectList = this.selectList.reduce (function(item,next){
+
+              obj[next.sbjbm] ? ' ' : obj[next.sbjbm]  = true && item.push(next)
+
+              return item;
+
+            },[])
+          },
+          //右侧删除
+          deleteItem(item,index){
+            this.selectedRowKeys.splice(this.selectedRowKeys.indexOf(item.sbjbm),1);
+            this.selectList.splice(index,1);
+          },
+          //右侧清空
+          clearSelectList(){
+            this.selectedRowKeys = [];
+            this.selectList = [];
+          },
+          //获取楼层
+          getPlazaFloor(){
+              let data = {
+                plazaId:'1000423'
+              }
+            getPlazaFloor(data,{}).then(res =>{
+              if(res.result == 'success'){
+                let data = res.data;
+                data.map(item=>{
+                  item.id = item.code;
+                })
+                this.dataFloor  = data;
+              }
+            })
+          },
+          //获取专业
+          getQuerySmsxt(){
+            getQuerySmsxt({}).then(res =>{
+              if(res.result == 'success'){
+                if(res.data){
+                  let data = res.data;
+                  data.map(item=>{
+                    item.id = item.smsxt;
+                    item.name = item.smsxtname;
+                  })
+                  this.majorList  = data;
+                }
+                }
+            })
+          },
+          getQuerySmsxtBy(smsxt){
+              let data = {
+                smsxt:smsxt
+              }
+            getQuerySmsxtBy(data,{}).then(res =>{
+              if(res.result == 'success') {
+                if(res.data){
+                  let data = res.data;
+                  (function recursion(newObj) {
+                    newObj.map(item=>{
+                      item.label = item.name;
+                      if(item.children){
+                        recursion(item.children);
+                      }
+                    })
+                  })(data)
+
+                  this.treeData = data;
+                }
+              }else{
+                this.$message.error('获取失败');
+              }
+            })
+          }
+        },
+        mounted() {
+          this.getQuerySmsxt();
+          //如果有专业就带过来
+          if(this.majorId){
+            this.getQuerySmsxtBy(this.majorId)
+          }else{
+            this.getQuerySmsxtBy('');
+          }
 
+
+
+          this.getPlazaFloor();
+        }
     }
 </script>
 
@@ -140,7 +326,7 @@
       border-radius: 3px;
       border: 1px solid rgba(239, 240, 241, 1);
       display: flex;
-      overflow: auto;
+      /*overflow: auto;*/
 
       .left {
         width: 785px;
@@ -181,37 +367,52 @@
           border-right: 1px solid #EFF0F1;
           display: inline-block;
           float: left;
+          overflow-y: scroll;
+          overflow:overlay;
 
         }
 
         .checkbox {
-          margin-top: 17px;
-          margin-left: 13px;
+          /*margin-top: 17px;*/
+          /*margin-left: 13px;*/
           width: 500px;
+          height: 441px;
           display: inline-block;
+          display: flex;
+          flex-direction: column;
+          justify-content: space-between;
+          /deep/ .ant-table-selection-column {
+            .ant-table-header-column{
+              display: none;
+            }
+          }
         }
       }
 
       .right {
         flex-grow: 1;
 
-
-        .list {
-          background: rgba(239, 240, 241, 1);
-          border-radius: 2px;
-          margin: 8px 12px;
-          position: relative;
-          padding: 5px;
-
-          .icon {
-            position: absolute;
-            bottom: 5px;
-            right: 5px;
-            cursor: pointer;
+        .list-box{
+          height: 440px;
+          overflow-y: scroll;
+          .list {
+            background: rgba(239, 240, 241, 1);
+            border-radius: 2px;
+            margin: 8px 12px;
+            position: relative;
+            padding: 5px;
+
+            .icon {
+              position: absolute;
+              bottom: 5px;
+              right: 5px;
+              cursor: pointer;
+            }
           }
         }
 
 
+
         .select-number {
           margin-left: 12px;
 

+ 4 - 26
src/components/edit/search_tree.vue

@@ -12,12 +12,9 @@
 </template>
 
 <script>
-    import {querySystem} from "@/api/editer";
-
     export default {
         data() {
             return {
-              treeData: [],
               filterText: '',
               defaultProps: {
                 children: 'children',
@@ -25,6 +22,9 @@
               }
             };
         },
+      props:{
+        treeData:Array
+      },
         methods: {
           onChange(e){
             this.$refs.tree.filter(e.target.value);
@@ -38,32 +38,10 @@
               if (!value) return true;
               return data.label.indexOf(value) !== -1;
             },
-            querySystem(){
-              querySystem().then(res =>{
-                if(res.result == 'success') {
-                  let data = res.data;
-                  (function recursion(newObj) {
-                    newObj.map(item=>{
-                      item.label = item.name;
-                      if(item.children){
-                        recursion(item.children);
-                      }
-                    })
-                  })(data)
-
-                  this.treeData = data;
-                }else{
-                  this.$message.error('获取失败');
-                }
-              })
-            },
             checkChange(data) {
               this.$emit('getTreeId',data.id)
             },
-        },
-      mounted() {
-          this.querySystem();
-      }
+        }
     };
 </script>