From cbe76e64e5dc8aedf9ac94d607962ecbf3684575 Mon Sep 17 00:00:00 2001
From: sd <shidong@jhsoft.cc>
Date: 星期三, 27 八月 2025 17:56:22 +0800
Subject: [PATCH] 国标配置更新树的勾选状态

---
 src/pages/gb28181/index/App.vue |  977 ++++++++++++++++++++++++++++----------------------------
 1 files changed, 485 insertions(+), 492 deletions(-)

diff --git a/src/pages/gb28181/index/App.vue b/src/pages/gb28181/index/App.vue
index 04e3731..7c264b3 100644
--- a/src/pages/gb28181/index/App.vue
+++ b/src/pages/gb28181/index/App.vue
@@ -1,538 +1,531 @@
 <template>
-  <div class="s-system-manage">
-    <div class="s-basic-setting">
-      <el-tabs
-        id="e-basic-setting"
-        v-model="activeName"
-        v-loading="loading"
-        :element-loading-text="loadingText"
-        type="border-card"
-        @tab-click="hanleTabClick"
-      >
-        <el-tab-pane label="鍥芥爣ID" name="gb28181">
-          <div style="width: 775px">
-            <!-- GB28181璁剧疆 -->
-            <el-form :model="gb28181" :rules="rules" label-width="130px" class="alarmSetting" ref="gb28181">
-              <!-- <el-form-item label="鍥介檯鏈嶅姟鍣↖P" prop="ServerIp">
-                  <ip-input :ip="gb28181.ServerIp" @on-blur="gb28181.ServerIp = arguments[0]"></ip-input>
-              </el-form-item>-->
+    <div class="s-system-manage">
+        <div class="s-basic-setting">
+            <el-tabs id="e-basic-setting" v-model="activeName" v-loading="loading" :element-loading-text="loadingText"
+                type="border-card" @tab-click="hanleTabClick">
+                <el-tab-pane label="鍥芥爣ID" name="gb28181">
+                    <div style="width: 775px">
+                        <!-- GB28181璁剧疆 -->
+                        <el-form :model="gb28181" :rules="rules" label-width="130px" class="alarmSetting" ref="gb28181">
 
-              <div style="text-align: left;margin-bottom: 16px;">
-                <el-radio-group v-model="gb28181.idType">
-                  <el-radio :label="0">杈撳叆宸叉湁ID</el-radio>
-                  <el-radio :label="1">鐢熸垚鏂扮殑ID</el-radio>
-                </el-radio-group>
-              </div>
+                            <div style="text-align: left;margin-bottom: 16px;">
+                                <!-- <el-radio-group v-model="gb28181.idType">
+                                    <el-radio :label="0">杈撳叆宸叉湁ID</el-radio>
+                                    <el-radio :label="1">鐢熸垚鏂扮殑ID</el-radio>
+                                </el-radio-group> -->
+                            </div>
 
-              <el-form-item label="鎵�鍦ㄥ湴">
-                <el-select
-                  v-model="locationCity.province"
-                  @change="changeProvince"
-                  size="small"
-                  placeholder="璇烽�夋嫨鐪佷唤"
-                  :disabled="gb28181.idType === 0"
-                >
-                  <el-option
-                    v-for="item in locationCity.provinceOptions"
-                    :key="item.id"
-                    :label="item.name"
-                    size="small"
-                    :value="item.id"
-                  ></el-option>
-                </el-select>
-                <el-select
-                  class="ml10 mr10"
-                  v-model="locationCity.city"
-                  :disabled="!locationCity.province"
-                  @change="changeCity"
-                  size="small"
-                  placeholder="璇烽�夋嫨鍩庡競"
-                >
-                  <el-option
-                    v-for="item in locationCity.cityOptions"
-                    :key="item.id"
-                    :label="item.name"
-                    :value="item.id"
-                  ></el-option>
-                </el-select>
-                <el-select
-                  v-model="locationCity.county"
-                  :disabled="!locationCity.city"
-                  size="small"
-                  placeholder="璇烽�夋嫨鍖哄幙"
-                >
-                  <el-option
-                    v-for="item in locationCity.countyOptions"
-                    :key="item.id"
-                    :label="item.name"
-                    :value="item.id"
-                  ></el-option>
-                </el-select>
-                <el-button type="text" style="position: absolute" v-show="gb28181.idType === 1" @click="newGBID"
-                  >鐢熸垚ID</el-button
-                >
-              </el-form-item>
+                            <!-- <el-form-item label="鎵�鍦ㄥ湴">
+                                <el-select v-model="locationCity.province" @change="changeProvince" size="small"
+                                    placeholder="璇烽�夋嫨鐪佷唤" :disabled="gb28181.idType === 0">
+                                    <el-option v-for="item in locationCity.provinceOptions" :key="item.id"
+                                        :label="item.name" size="small" :value="item.id"></el-option>
+                                </el-select>
+                                <el-select class="ml10 mr10" v-model="locationCity.city"
+                                    :disabled="!locationCity.province" @change="changeCity" size="small"
+                                    placeholder="璇烽�夋嫨鍩庡競">
+                                    <el-option v-for="item in locationCity.cityOptions" :key="item.id"
+                                        :label="item.name" :value="item.id"></el-option>
+                                </el-select>
+                                <el-select v-model="locationCity.county" :disabled="!locationCity.city" size="small"
+                                    placeholder="璇烽�夋嫨鍖哄幙">
+                                    <el-option v-for="item in locationCity.countyOptions" :key="item.id"
+                                        :label="item.name" :value="item.id"></el-option>
+                                </el-select>
+                                <el-button type="text" style="position: absolute" v-show="gb28181.idType === 1"
+                                    @click="newGBID">鐢熸垚ID</el-button>
+                            </el-form-item> -->
 
-              <!-- <el-form-item label="鍥介檯鏈嶅姟鍣ㄧ鍙�" prop="GbServerPort">
-                  <el-input v-model.number="gb28181.ServerPort" placeholder="璇疯緭鍏�" size="small"></el-input>
-              </el-form-item>-->
 
-              <el-form-item label="鍥芥爣ID">
-                <el-input
-                  v-model="gb28181.PublicId"
-                  placeholder="璇疯緭鍏�"
-                  size="small"
-                  :disabled="gb28181.idType === 1"
-                ></el-input>
-              </el-form-item>
 
-              <el-form-item label="鍥芥爣绔彛" prop="GbServerPort">
-                <el-input v-model.number="gb28181.GbServerPort" placeholder="璇疯緭鍏�" size="small"></el-input>
-              </el-form-item>
+                            <el-form-item label="SIP鏈嶅姟鍣↖D">
+                                <!-- <el-input v-model="gb28181.PublicId" placeholder="璇疯緭鍏�" size="small"
+                                    :disabled="gb28181.idType === 1"></el-input> -->
+                                <el-input v-model="gb28181.SipSerial" placeholder="璇疯緭鍏�" size="small"
+                                    :disabled="true"></el-input>
+                            </el-form-item>
 
-              <el-form-item label="寮�鍚壌鏉�" style="text-align: left">
-                <el-switch v-model="gb28181.IsAuth"></el-switch>
-              </el-form-item>
+                            <el-form-item label="SIP鏈嶅姟鍣ㄥ煙">
+                                <el-input v-model.number="gb28181.SipRealm" placeholder="璇疯緭鍏�" :disabled="true"
+                                    size="small"></el-input>
+                            </el-form-item>
 
-              <el-form-item label="閴存潈瀵嗙爜">
-                <el-input
-                  v-model="gb28181.Password"
-                  placeholder="璇疯緭鍏�"
-                  size="small"
-                  :disabled="!gb28181.IsAuth"
-                ></el-input>
-              </el-form-item>
+                            <!-- <el-form-item label="寮�鍚壌鏉�" style="text-align: left">
+                                <el-switch v-model="gb28181.IsAuth"></el-switch>
+                            </el-form-item> -->
 
-              <el-form-item style="float: right">
-                <el-button type="primary" @click="submitGB28281" size="small">淇濆瓨</el-button>
-              </el-form-item>
-            </el-form>
-          </div>
-        </el-tab-pane>
+                            <el-form-item label="SIP鏈嶅姟鍣ㄥ湴鍧�">
+                                <el-input v-model="gb28181.SipHost" placeholder="璇疯緭鍏�" size="small"
+                                    :disabled="!gb28181.IsAuth"></el-input>
+                            </el-form-item>
+                            <el-form-item label="SIP鏈嶅姟鍣ㄧ鍙�">
+                                <el-input v-model="gb28181.SipPort" placeholder="璇疯緭鍏�" size="small"
+                                    :disabled="true"></el-input>
+                            </el-form-item>
 
-        <el-tab-pane label="鎺ュ叆骞冲彴鍒楄〃" name="subordinates">
-          <el-table
-            :data="subDevTable"
-            border
-            fit
-            highlight-current-row
-            style="width: 100%; color:#000"
-            :header-cell-style="{ background: '#f8f8f8', color: '#222222', height: '30px' }"
-          >
-            <el-table-column type="index" label="搴忓彿" align="center" width="50"></el-table-column>
-            <el-table-column prop="name" label="鍚嶇О" align="center"></el-table-column>
-            <el-table-column prop="publicid" label="ID" align="center"></el-table-column>
-            <el-table-column prop="ip" label="IP" align="center"></el-table-column>
-            <el-table-column prop="status" label="鐘舵��" align="center">
-              <template slot-scope="scope">
-                <span :style="scope.row.alive ? `color:#047d19` : 'color:#f11a1a;'">{{
-                  scope.row.alive ? "鍦ㄧ嚎" : "绂荤嚎"
-                }}</span>
-              </template>
-            </el-table-column>
-            <el-table-column prop="corp" label="澶囨敞" align="center"></el-table-column>
-          </el-table>
-        </el-tab-pane>
-        <el-tab-pane label="鍥芥爣鎽勫儚鏈�" name="cameras">
-          <div style="text-align:left">
-            <el-button type="primary" size="small" @click="updateCamerasFromVideosvr">鍒锋柊</el-button>
-          </div>
-          <div class="camera-title">
-            <b>鍥芥爣鎽勫儚鏈洪厤缃�</b>
-            <span>(鏈�澶氬嬀閫�500璺憚鍍忔満)</span>
-          </div>
-          <tree-menu
-            ref="tree"
-            app="gb28181"
-            treeName="localTree"
-            :node="TreeDataPool.treeData"
-            :height="treeHeight"
-            :setting="treeSettings"
-            style="width:600px;min-height:500px"
-          />
-          <div class="base-image" v-loading="TreeDataPool.baseImageLoading">
-            <span>{{ TreeDataPool.cameraNameForBaseImage }}</span>
-            <div class="camera-image" v-show="TreeDataPool.cameraNameForBaseImage.length">
-              <img :src="'data:image/png;base64,' + TreeDataPool.gb28181CameraBaseImage" width="450px" alt />
-            </div>
-          </div>
-          <el-divider></el-divider>
+                            <el-form-item style="float: right">
+                                <!-- <el-button type="primary" @click="submitGB28281" size="small">淇濆瓨</el-button> -->
+                            </el-form-item>
+                        </el-form>
+                    </div>
+                </el-tab-pane>
 
-          <span class="camera-seleted-text">
-            宸查�夋嫨 (
-            <b>{{ TreeDataPool.gb28181CheckedCount }}</b>
-            / {{ TreeDataPool.gb28181ChildNodeCount }} ) 璺�
-          </span>
+                <el-tab-pane label="鎺ュ叆骞冲彴鍒楄〃" name="subordinates">
+                    <el-table :data="subDevTable" border fit highlight-current-row style="width: 100%; color:#000"
+                        :header-cell-style="{ background: '#f8f8f8', color: '#222222', height: '30px' }">
+                        <el-table-column type="index" label="搴忓彿" align="center" width="50"></el-table-column>
+                        <el-table-column prop="name" label="鍚嶇О" align="center"></el-table-column>
+                        <el-table-column prop="publicid" label="ID" align="center"></el-table-column>
+                        <el-table-column prop="corp" label="绔彛" align="center"></el-table-column>
+                        <el-table-column prop="ip" label="IP" align="center"></el-table-column>
+                        <el-table-column prop="status" label="鐘舵��" align="center">
+                            <template slot-scope="scope">
+                                <span :style="scope.row.alive ? `color:#047d19` : 'color:#f11a1a;'">{{
+                                    scope.row.alive ? "鍦ㄧ嚎" : "绂荤嚎"
+                                    }}</span>
+                            </template>
+                        </el-table-column>
+                    </el-table>
+                </el-tab-pane>
+                <el-tab-pane label="鍥芥爣鎽勫儚鏈�" name="cameras">
+                    <div style="text-align:left">
+                        <el-button type="primary" size="small" @click="updateCamerasFromVideosvr">鍒锋柊</el-button>
+                    </div>
+                    <div class="camera-title">
+                        <b>鍥芥爣鎽勫儚鏈洪厤缃�</b>
+                        <span>(鏈�澶氬嬀閫�500璺憚鍍忔満)</span>
+                    </div>
+                    <tree-menu ref="tree" app="gb28181" treeName="localTree" :node="treeData" :height="treeHeight"  @cehckDataUpload="handleParentMethod"
+                        :setting="treeSettings" style="width:600px;min-height:500px" />
+<!--                    <div class="base-image" >
+                        <span>{{ 0 }}</span>
+                        <div class="camera-image">
+                            &lt;!&ndash; <img :src="'data:image/png;base64,' + TreeDataPool?.gb28181CameraBaseImage" width="450px"
+                                alt /> &ndash;&gt;
+                        </div>
+                    </div>-->
+                    <el-divider></el-divider>
 
-          <el-button type="primary" size="small" @click="saveChecked">淇濆瓨</el-button>
-        </el-tab-pane>
-      </el-tabs>
+                    <span class="camera-seleted-text">
+                        宸查�夋嫨 (
+                        <b>{{checkData}}</b>
+                        / {{ totalNode}} ) 璺�
+                    </span>
+
+                    <el-button type="primary" size="small" @click="saveChecked">淇濆瓨</el-button>
+                </el-tab-pane>
+            </el-tabs>
+        </div>
     </div>
-  </div>
 </template>
 
 <script>
-import {
-  getGB28181Config,
-  saveGB28181Config,
-  getGb28181AreaList,
-  newGb28181ID,
-  getAllSubServer,
-  saveGb28181CamTree
-} from "./api"
+import gb28181 from "@/api/gb28181"
 
-import TreeMenu from "@/components/giantTree/index"
+import TreeMenu from "../components/gbZtree.vue"
+// import TreeMenu from "@/components/giantTree/index"
 import { isPort, isIPv4 } from "@/scripts/validate"
 import bus from "@/plugin/bus"
 export default {
-  name: "Gb28181Setting",
-  components: {
-    TreeMenu
-  },
-  directives: {
-    focus: {
-      inserted: function(el) {
-        el.querySelector("input").focus()
-      }
-    }
-  },
-
-  data() {
-    return {
-      activeName: "gb28181",
-      treeHeight: 750,
-      loading: false,
-      loadingText: "",
-      openeds: ["0"],
-      gb28181: {},
-      subDevTable: [],
-      idType: 1,
-      treeSettings: {
-        check: {
-          enable: true
-        }
-      },
-      rules: {
-        ip: [
-          {
-            required: true,
-            message: "璇疯緭鍏P鍦板潃",
-            trigger: "change"
-          },
-          { validator: isIPv4, trigger: "change" }
-        ],
-        ServerIp: [
-          {
-            required: true,
-            message: "璇疯緭鍏P鍦板潃",
-            trigger: "change"
-          },
-          { validator: isIPv4, trigger: "change" }
-        ],
-        ServerPort: [
-          {
-            required: true,
-            message: "璇疯緭鍏ョ鍙�",
-            trigger: "change"
-          },
-          { validator: isPort, trigger: "change" }
-        ],
-        GbServerPort: [
-          {
-            required: true,
-            message: "璇疯緭鍏ョ鍙�",
-            trigger: "change"
-          },
-          { validator: isPort, trigger: "change" }
-        ]
-      },
-      locationCity: {
-        province: "",
-        city: "",
-        county: "",
-        provinceOptions: [],
-        cityOptions: [],
-        countyOptions: []
-      }
-    }
-  },
-  mounted() {
-    this.TreeDataPool.multiple = true
-
-    // 璁板綍鐩綍鏄惁鎶樺彔
-    let foldList = localStorage.getItem("ztree_fold_list")
-    if (foldList) {
-      this.TreeDataPool.foldNodeList = JSON.parse(foldList)
-    }
-
-    this.initGB28181Conf()
-  },
-  methods: {
-    hanleTabClick(tab, event) {
-      if (this.activeName == "subordinates") {
-        getAllSubServer().then((rsp) => {
-          if (rsp && rsp.success) {
-            this.subDevTable = rsp.data
-          }
-        })
-      } else if (this.activeName == "cameras") {
-        this.getCamerasFromVideosvr()
-      }
+    name: "Gb28181Setting",
+    components: {
+        TreeMenu
     },
-    async getCamerasFromVideosvr() {
-      this.loading = true
-      await this.TreeDataPool.fetchVideosvrCameras(false)
-      this.loading = false
-    },
-    async updateCamerasFromVideosvr() {
-      this.loading = true
-      await this.TreeDataPool.fetchVideosvrCameras(true)
-      this.loading = false
-    },
-    saveChecked() {
-      localStorage.setItem("ztree_fold_list", JSON.stringify(this.TreeDataPool.foldNodeList))
-
-      if (this.TreeDataPool.gb28181CheckedCount > 500) {
-        this.$message({
-          type: "warning",
-          message: "鏈�澶氫粎鏀寔閫夋嫨500璺憚鍍忔満. 璇烽噸鏂伴�夋嫨"
-        })
-
-        return
-      }
-
-      this.loading = true
-
-      let treeData = this.TreeDataPool.newTreeByChecked(this.TreeDataPool.activeTreeData)
-
-      saveGb28181CamTree({ checkedMenus: treeData })
-        .then((rsp) => {
-          if (rsp && rsp.success) {
-            this.$message({
-              type: "success",
-              message: "淇濆瓨鎴愬姛"
-            })
-          }
-          this.loading = false
-        })
-        .catch((err) => {
-          this.$message({
-            type: "error",
-            message: "淇濆瓨澶辫触"
-          })
-          this.loading = false
-        })
-    },
-    initGB28181Conf() {
-      getGB28181Config().then((rsp) => {
-        if (rsp && rsp.success) {
-          this.gb28181 = rsp.data
-          //this.gb28181.idType = 0;
-
-          this.$set(this.gb28181, "idType", 0)
-          this.$refs["gb28181"].resetFields()
-        }
-      })
-      getGb28181AreaList().then((rsp) => {
-        if (rsp && rsp.success) {
-          this.locationCity.provinceOptions = rsp.data
-        }
-      })
-    },
-    submitGB28281() {
-      this.$refs["gb28181"].validate((valid) => {
-        if (valid) {
-          saveGB28181Config(this.gb28181).then((rsp) => {
-            if (rsp && rsp.success) {
-              this.$notify({
-                type: "success",
-                message: "GB28181璁剧疆淇濆瓨鎴愬姛"
-              })
+    directives: {
+        focus: {
+            inserted: function (el) {
+                el.querySelector("input").focus()
             }
-          })
-        } else {
-          console.log("error submit!!")
-          return false
         }
-      })
     },
-    changeProvince() {
-      let pid = this.locationCity.province
-      getGb28181AreaList({ parentId: pid }).then((rsp) => {
-        if (rsp && rsp.success) {
-          this.locationCity.cityOptions = rsp.data
-          this.locationCity.city = this.locationCity.cityOptions[0].id
-          this.changeCity()
+    data() {
+        return {
+           totalNode:0,
+           checkData:0,
+            treeData: [{
+                id: 1,
+                label: 'N332',
+                type: 'folder',
+                children: [{
+                    id: 11,
+                    label: 'N332_1',
+                    type: 'folder',
+                    children: [{
+                        id: 111,
+                        label: 'N332_1_1',
+                        type: 'folder',
+                        children: []
+                    }, {
+                        id: 112,
+                        label: 'N332_1_2',
+                        type: 'folder',
+                        children: []
+                    },]
+                }]
+            },
+            {
+                id: 2,
+                label: '鎽勫儚鏈�',
+                type: 'camera',
+                data: {
+                    rtspAddress: 'http://*******',
+                    deviceName: '鎽勫儚鏈�',
+                    deviceAddress: '鏈烘埧',
+                    videoType: "1",
+                    lngLat: ''
+                }
+            }],
+            activeName: "gb28181",
+            treeHeight: 750,
+            loading: false,
+            loadingText: "",
+            openeds: ["0"],
+            gb28181: {},
+            subDevTable: [],
+            idType: 1,
+            treeSettings: {
+                check: {
+                    enable: true
+                }
+            },
+            rules: {
+                ip: [
+                    {
+                        required: true,
+                        message: "璇疯緭鍏P鍦板潃",
+                        trigger: "change"
+                    },
+                    //{ validator: isIPv4, trigger: "change" }
+                ],
+                ServerIp: [
+                    {
+                        required: true,
+                        message: "璇疯緭鍏P鍦板潃",
+                        trigger: "change"
+                    },
+                    //{ validator: isIPv4, trigger: "change" }
+                ],
+                ServerPort: [
+                    {
+                        required: true,
+                        message: "璇疯緭鍏ョ鍙�",
+                        trigger: "change"
+                    },
+                   // { validator: isPort, trigger: "change" }
+                ],
+                GbServerPort: [
+                    {
+                        required: true,
+                        message: "璇疯緭鍏ョ鍙�",
+                        trigger: "change"
+                    },
+                   // { validator: isPort, trigger: "change" }
+                ]
+            },
+            locationCity: {
+                province: "",
+                city: "",
+                county: "",
+                provinceOptions: [],
+                cityOptions: [],
+                countyOptions: []
+            }
         }
-      })
     },
-    changeCity() {
-      let pid = this.locationCity.city
-      getGb28181AreaList({ parentId: pid }).then((rsp) => {
-        if (rsp && rsp.success) {
-          this.locationCity.countyOptions = rsp.data
-          this.locationCity.county = this.locationCity.countyOptions[0].id
-        }
-        console.log(this.locationCity.county)
-      })
-    },
-    newGBID () {
-      console.log(this.locationCity.county)
-      console.log(this.locationCity.countyOptions)
-      let cCode = this.locationCity.county + ""
-      newGb28181ID({ code: cCode }).then((rsp) => {
-        if (rsp && rsp.success) {
-          this.gb28181.PublicId = rsp.data
-        }
-      })
-    },
-    menuOpen() {},
-    menuClose() {},
-    toOpenMenuList(e) {
-      let t = e.clientY - this.$el.offsetTop + 30
-      let l = e.clientX - this.$el.offsetLeft
+    mounted() {
+        // this.TreeDataPool.multiple = true
 
-      window.parent.postMessage(
-        {
-          source: location.href.split("/")[location.href.split("/").length - 1],
-          trigger: "contextmenu",
-          menuT: t,
-          menuL: l
+        // 璁板綍鐩綍鏄惁鎶樺彔
+        // let foldList = localStorage.getItem("ztree_fold_list")
+        // if (foldList) {
+        //     this.TreeDataPool.foldNodeList = JSON.parse(foldList)
+        // }
+
+        // this.initGB28181Conf()
+        this.newGBID()
+    },
+    methods: {
+      handleParentMethod(checkCount){
+        this.checkData  = checkCount
+        // console.info(checkCount)
+      },
+        async getCamerasFromVideosvr() {
+            // console.info(this.TreeDataPool)
+            this.loading = true
+            await this.fetchVideosvrCameras()
+            this.loading = false
         },
-        "*"
-      )
-      return false
+        hanleTabClick(tab, event) {
+            console.info("activeName:" + this.activeName)
+            if (this.activeName == "subordinates") {
+                gb28181.getAllSubServer().then((rsp) => {
+                    if (rsp && rsp.status == 200) {
+                        const results = rsp.data.map(item => {
+                            return {
+                                publicid: item.ID,
+                                name: item.Name,
+                                ip: item.RemoteIP,
+                                corp: item.RemotePort,
+                                alive: item.Online,
+                            };
+                        });
+                        this.subDevTable = results;
+                        // console.info("data:" + JSON.stringify(rsp.data))
+                    }
+                })
+            } else if (this.activeName == "cameras") {
+                this.getCamerasFromVideosvr()
+            } else {
+                gb28181.newGb28181ID().then((rsp) => {
+                    if (rsp && rsp.status == 200) {
+                        this.gb28181 = rsp.data;
+                        // console.info("data:" + JSON.stringify(rsp.data))
+                    }
+                })
+
+            }
+        },
+        changeProvince() {
+            let pid = this.locationCity.province
+            //   getGb28181AreaList({ parentId: pid }).then((rsp) => {
+            //     if (rsp && rsp.success) {
+            //       this.locationCity.cityOptions = rsp.data
+            //       this.locationCity.city = this.locationCity.cityOptions[0].id
+            //       this.changeCity()
+            //     }
+            //   })
+        },
+        changeCity() {
+            let pid = this.locationCity.city
+            //   getGb28181AreaList({ parentId: pid }).then((rsp) => {
+            //     if (rsp && rsp.success) {
+            //       this.locationCity.countyOptions = rsp.data
+            //       this.locationCity.county = this.locationCity.countyOptions[0].id
+            //     }
+            //     console.log(this.locationCity.county)
+            //   })
+        },
+        newGBID() {
+            // console.log(this.locationCity.county)
+            // console.log(this.locationCity.countyOptions)
+            gb28181.newGb28181ID().then((rsp) => {
+                if (rsp && rsp.status == 200) {
+                    this.gb28181 = rsp.data;
+                    // console.info("data:" + JSON.stringify(rsp.data))
+                }
+            })
+        },
+        submitGB28281() {
+            this.$refs["gb28181"].validate((valid) => {
+                if (valid) {
+                    //   saveGB28181Config(this.gb28181).then((rsp) => {
+                    //     if (rsp && rsp.success) {
+                    //       this.$notify({
+                    //         type: "success",
+                    //         message: "GB28181璁剧疆淇濆瓨鎴愬姛"
+                    //       })
+                    //     }
+                    //   })
+                } else {
+                    console.log("error submit!!")
+                    return false
+                }
+            })
+        },
+        async updateCamerasFromVideosvr() {
+            this.loading = true
+            await this.fetchVideosvrCameras()
+            this.loading = false
+        },
+        async fetchVideosvrCameras() {
+            gb28181.getGb28181Pool().then((rsp) => {
+                if (rsp && rsp.status == 200) {
+                // console.log("treeData:",rsp.data.items)
+                    this.treeData = rsp.data.items;
+                    this.totalNode = rsp.data.total;
+                }
+                // console.log("treeData:",this.treeData)
+            })
+        },
+        saveChecked() {
+            const keys = this.$refs.tree.getResults();
+            console.info(JSON.stringify(keys))
+          if (this.checkData ==0) {
+            this.$message({
+              type: "warning",
+              message: "璇烽�夋嫨鎽勫儚鏈猴紝鍐嶈繘琛屼繚瀛�"
+            })
+            return
+          }
+             if (this.checkData > 500) {
+                 this.$message({
+                   type: "warning",
+                    message: "鏈�澶氫粎鏀寔閫夋嫨500璺憚鍍忔満. 璇烽噸鏂伴�夋嫨"
+                })
+               return
+           }
+
+
+
+          gb28181.saveGb28181CamTree(keys)
+               .then((rsp) => {
+                 if (rsp && rsp.status == 200) {
+                       this.$message({
+                             type: "success",
+                             message: "淇濆瓨鎴愬姛"
+                         })
+                   }
+                     this.loading = false
+               })
+                .catch((err) => {
+                    this.$message({
+                        type: "error",
+                        message: "淇濆瓨澶辫触"
+                    })
+                    this.loading = false
+                })
+        },
     }
-  }
 }
 </script>
 <style lang="scss">
 .s-system-manage {
-  width: 100% !important;
-  min-width: 1067px;
-  height: 100%;
-  box-sizing: border-box;
-  padding: 10px;
-  background-color: #f8f9fb;
-  .s-system-manage-breadcrumb {
-    height: 5%;
+    width: 100% !important;
+    min-width: 1067px;
+    height: 100%;
     box-sizing: border-box;
-    border: 1px solid #e4e7ed;
-    box-shadow: #e4e7ed 0px 0px 9px inset;
-    box-shadow: #e4e7ed 0px 0px 9px inset;
-    border-radius: 5px;
-  }
+    padding: 10px;
+    background-color: #f8f9fb;
 
-  .el-tabs--border-card {
-    border: 0px solid #dcdfe6;
-    -webkit-box-shadow: none;
-    box-shadow: none;
+    .s-system-manage-breadcrumb {
+        height: 5%;
+        box-sizing: border-box;
+        border: 1px solid #e4e7ed;
+        box-shadow: #e4e7ed 0px 0px 9px inset;
+        box-shadow: #e4e7ed 0px 0px 9px inset;
+        border-radius: 5px;
+    }
+
+    .el-tabs--border-card {
+        border: 0px solid #dcdfe6;
+        -webkit-box-shadow: none;
+        box-shadow: none;
+
+        .el-tabs__header {
+            border: 0px solid #dcdfe6;
+
+            .el-tabs__item {
+                padding: 5px 50px;
+                height: 50px;
+                font-family: PingFangSC-Regular;
+                font-size: 15px;
+                color: #222222;
+                text-align: center;
+                border: 0px solid transparent;
+            }
+
+            .el-tabs__item:nth-child(2) {
+                padding-left: 50px !important;
+            }
+
+            .el-tabs__item:last-child {
+                padding-right: 50px !important;
+            }
+
+            .el-tabs__item.is-active {
+                color: #3d68e1;
+
+                // border-right-color: #fff;
+                // border-left-color: #fff;
+            }
+
+            .el-tabs__item:not(.is-disabled):hover {
+                color: #3d68e1;
+            }
+        }
+    }
+
     .el-tabs__header {
-      border: 0px solid #dcdfe6;
-      .el-tabs__item {
-        padding: 5px 50px;
-        height: 50px;
-        font-family: PingFangSC-Regular;
-        font-size: 15px;
-        color: #222222;
-        text-align: center;
-        border: 0px solid transparent;
-      }
-      .el-tabs__item:nth-child(2) {
-        padding-left: 50px !important;
-      }
-      .el-tabs__item:last-child {
-        padding-right: 50px !important;
-      }
-      .el-tabs__item.is-active {
-        color: #3d68e1;
-
-        // border-right-color: #fff;
-        // border-left-color: #fff;
-      }
-      .el-tabs__item:not(.is-disabled):hover {
-        color: #3d68e1;
-      }
+        margin-bottom: 0;
     }
-  }
-  .el-tabs__header {
-    margin-bottom: 0;
-  }
-  .el-tabs__content {
-    height: calc(100% - 64px);
-    box-sizing: border-box;
-    overflow-y: auto;
-    padding: 20px 40px !important;
-    background: #fff;
-    .el-tab-pane {
-      width: 100%;
-      .s-title {
+
+    .el-tabs__content {
+        height: calc(100% - 64px);
+        box-sizing: border-box;
+        overflow-y: auto;
+        padding: 20px 40px !important;
+        background: #fff;
+
+        .el-tab-pane {
+            width: 100%;
+
+            .s-title {
+                text-align: left;
+                padding: 15px 0px;
+                font-size: 16px;
+            }
+        }
+    }
+
+    .s-table {
+        border: 1px solid #e8e8e9;
+        margin-top: 40px;
+    }
+
+    .ui-top-title {
+        padding-bottom: 10px;
+        /* border-bottom: 1px solid #ebebeb; */
+        position: relative;
         text-align: left;
-        padding: 15px 0px;
+        padding-left: 15px;
         font-size: 16px;
-      }
+        font-weight: bold;
     }
-  }
 
-  .s-table {
-    border: 1px solid #e8e8e9;
-    margin-top: 40px;
-  }
-
-  .ui-top-title {
-    padding-bottom: 10px;
-    /* border-bottom: 1px solid #ebebeb; */
-    position: relative;
-    text-align: left;
-    padding-left: 15px;
-    font-size: 16px;
-    font-weight: bold;
-  }
-
-  .ui-top-title:before {
-    content: " ";
-    border-left: 4px solid #f53d3d;
-    display: inline-block;
-    height: 16px;
-    position: absolute;
-    top: 50%;
-    left: 0;
-    margin-top: -13px;
-  }
-
-  .el-button--text {
-    color: #3d68e1;
-    text-decoration: underline;
-  }
-
-  .camera-title {
-    text-align: left;
-    padding: 0px 10px;
-    margin: 5px 0px;
-    height: 33px;
-    background-color: #e4e2e2;
-    line-height: 33px;
-    font-size: 14px;
-  }
-
-  .camera-seleted-text {
-    margin-right: 20px;
-
-    .b {
-      color: #3d68e1;
+    .ui-top-title:before {
+        content: " ";
+        border-left: 4px solid #f53d3d;
+        display: inline-block;
+        height: 16px;
+        position: absolute;
+        top: 50%;
+        left: 0;
+        margin-top: -13px;
     }
-  }
 
-  .base-image {
-    position: absolute;
-    top: 18%;
-    left: 57%;
-    width: 450px;
-
-    .camera-image {
-      background-color: black;
-      height: 254px;
+    .el-button--text {
+        color: #3d68e1;
+        text-decoration: underline;
     }
-  }
+
+    .camera-title {
+        text-align: left;
+        padding: 0px 10px;
+        margin: 5px 0px;
+        height: 33px;
+        background-color: #e4e2e2;
+        line-height: 33px;
+        font-size: 14px;
+    }
+
+    .camera-seleted-text {
+        margin-right: 20px;
+
+        .b {
+            color: #3d68e1;
+        }
+    }
+
+    .base-image {
+        position: absolute;
+        top: 18%;
+        left: 57%;
+        width: 450px;
+
+        .camera-image {
+            background-color: black;
+            height: 254px;
+        }
+    }
 }
 </style>

--
Gitblit v1.8.0