From b814de9ab5cd3ce8ac832c7ac711d56311232a35 Mon Sep 17 00:00:00 2001
From: xuhuajiao <13476289682@163.com>
Date: Tue, 7 Feb 2023 10:05:15 +0800
Subject: [PATCH] =?UTF-8?q?bug=E4=BF=AE=E5=A4=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/router/index.js                           |   2 +-
 src/views/login.vue                           | 626 +++++++++---------
 .../listenManage/module/bindCamera.vue        |   2 +
 .../listenManage/videoListen/index.vue        |   5 +-
 .../tagManage/bindTagList/index.vue           | 413 ++++++------
 5 files changed, 529 insertions(+), 519 deletions(-)

diff --git a/src/router/index.js b/src/router/index.js
index 47be649..a84acb6 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -9,7 +9,7 @@ import { filterAsyncRouter } from '@/store/modules/permission'
 
 NProgress.configure({ showSpinner: false })// NProgress Configuration
 
-const whiteList = ['/login']// no redirect whitelist
+const whiteList = ['/login', '/environmentalScreen']// no redirect whitelist
 
 router.beforeEach((to, from, next) => {
   if (to.meta.title) {
diff --git a/src/views/login.vue b/src/views/login.vue
index c4e5235..b958a33 100644
--- a/src/views/login.vue
+++ b/src/views/login.vue
@@ -1,313 +1,313 @@
-<template>
-  <div class="login" :style="'background-image:url(' + Background + ');'">
-    <el-form
-      ref="loginForm"
-      :model="loginForm"
-      :rules="loginRules"
-      label-position="left"
-      label-width="0px"
-      class="login-form"
-    >
-      <h3 class="title">智能库房综合管理系统</h3>
-      <el-form-item prop="username">
-        <el-input
-          v-model="loginForm.username"
-          type="text"
-          auto-complete="off"
-          placeholder="登录账号"
-        >
-          <svg-icon
-            slot="prefix"
-            icon-class="user"
-            class="el-input__icon input-icon"
-          />
-        </el-input>
-      </el-form-item>
-      <el-form-item prop="password">
-        <el-input
-          v-model="loginForm.password"
-          type="password"
-          auto-complete="off"
-          placeholder="密码"
-          @keyup.enter.native="handleLogin"
-        >
-          <svg-icon
-            slot="prefix"
-            icon-class="password"
-            class="el-input__icon input-icon"
-          />
-        </el-input>
-      </el-form-item>
-      <el-form-item class="login-code" prop="code">
-        <el-input
-          v-model="loginForm.code"
-          auto-complete="off"
-          placeholder="验证码"
-          @keyup.enter.native="handleLogin"
-        >
-          <svg-icon
-            slot="prefix"
-            icon-class="validCode"
-            class="el-input__icon input-icon"
-          />
-        </el-input>
-        <div class="code-img">
-          <img :src="codeUrl" @click="getCode">
-        </div>
-      </el-form-item>
-      <!-- <el-checkbox v-model="loginForm.rememberMe" style="margin: 0 0 25px 0">
-        记住我
-      </el-checkbox> -->
-      <el-form-item style="width: 100%">
-        <el-button
-          :loading="loading"
-          size="medium"
-          @click.native.prevent="handleLogin"
-        >
-          <span v-if="!loading">登 录</span>
-          <span v-else>登 录 中...</span>
-        </el-button>
-      </el-form-item>
-    </el-form>
-    <!--  底部  -->
-    <div v-if="$store.state.settings.showFooter" id="el-login-footer">
-      <span v-html="$store.state.settings.footerTxt" />
-      <span> ⋅ </span>
-      <a href="https://beian.miit.gov.cn/#/Integrated/index" target="_blank">{{
-        $store.state.settings.caseNumber
-      }}</a>
-    </div>
-  </div>
-</template>
-
-<script>
-import { encrypt } from '@/utils/rsaEncrypt'
-import Config from '@/settings'
-import { getCodeImg } from '@/api/login'
-import Cookies from 'js-cookie'
-import qs from 'qs'
-import Background from '@/assets/images/background.jpg'
-export default {
-  name: 'Login',
-  data() {
-    return {
-      Background: Background,
-      codeUrl: '',
-      cookiePass: '',
-      loginForm: {
-        username: 'admin',
-        password: '123456',
-        rememberMe: false,
-        code: '',
-        uuid: ''
-      },
-      loginRules: {
-        username: [
-          { required: true, trigger: 'blur', message: '登录账号不能为空' }
-        ],
-        password: [
-          { required: true, trigger: 'blur', message: '密码不能为空' }
-        ],
-        code: [
-          { required: true, trigger: 'change', message: '验证码不能为空' }
-        ]
-      },
-      loading: false,
-      redirect: undefined
-    }
-  },
-  watch: {
-    $route: {
-      handler: function(route) {
-        const data = route.query
-        if (data && data.redirect) {
-          this.redirect = data.redirect
-          delete data.redirect
-          if (JSON.stringify(data) !== '{}') {
-            this.redirect =
-              this.redirect + '&' + qs.stringify(data, { indices: false })
-          }
-        }
-      },
-      immediate: true
-    }
-  },
-  created() {
-    // 获取验证码
-    this.getCode()
-    // 获取用户名密码等Cookie
-    this.getCookie()
-    // token 过期提示
-    this.point()
-  },
-  methods: {
-    getCode() {
-      getCodeImg().then((res) => {
-        this.codeUrl = res.img
-        this.loginForm.uuid = res.uuid
-      })
-    },
-    getCookie() {
-      const username = Cookies.get('username')
-      let password = Cookies.get('password')
-      const rememberMe = Cookies.get('rememberMe')
-      // 保存cookie里面的加密后的密码
-      this.cookiePass = password === undefined ? '' : password
-      password = password === undefined ? this.loginForm.password : password
-      this.loginForm = {
-        username: username === undefined ? this.loginForm.username : username,
-        password: password,
-        rememberMe: rememberMe === undefined ? false : Boolean(rememberMe),
-        code: ''
-      }
-    },
-    handleLogin() {
-      this.$refs.loginForm.validate((valid) => {
-        const user = {
-          username: this.loginForm.username,
-          password: this.loginForm.password,
-          rememberMe: this.loginForm.rememberMe,
-          code: this.loginForm.code,
-          uuid: this.loginForm.uuid
-        }
-        if (user.password !== this.cookiePass) {
-          user.password = encrypt(user.password)
-        }
-        if (valid) {
-          this.loading = true
-          if (user.rememberMe) {
-            Cookies.set('username', user.username, {
-              expires: Config.passCookieExpires
-            })
-            Cookies.set('password', user.password, {
-              expires: Config.passCookieExpires
-            })
-            Cookies.set('rememberMe', user.rememberMe, {
-              expires: Config.passCookieExpires
-            })
-          } else {
-            Cookies.remove('username')
-            Cookies.remove('password')
-            Cookies.remove('rememberMe')
-          }
-          this.$store
-            .dispatch('Login', user)
-            .then(() => {
-              this.loading = false
-              this.$router.push({ path: this.redirect || '/' })
-            })
-            .catch(() => {
-              this.loading = false
-              this.getCode()
-            })
-        } else {
-          console.log('error submit!!')
-          return false
-        }
-      })
-    },
-    point() {
-      const point = Cookies.get('point') !== undefined
-      if (point) {
-        this.$message({
-          message: '当前登录状态已过期，请重新登录！',
-          type: 'warning',
-          duration: 5000
-        })
-        Cookies.remove('point')
-      }
-    }
-  }
-}
-</script>
-
-<style rel="stylesheet/scss" lang="scss">
-.login {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  height: 100vh;
-  position: relative;
-  background-size: cover;
-}
-.title {
-  margin-bottom: 30px;
-  font-size: 30px;
-  font-weight: 400;
-  text-align: center;
-  letter-spacing: 2px;
-  color: #1e2864;
-}
-
-.login-form {
-  width: 26%;
-  padding: 4% 2%;
-  position: absolute;
-  left: calc(100vw - 44%);
-  top: 50%;
-  transform: translateY(-50%);
-  background: #fff;
-  box-shadow: 0px 0px 16px 1px rgba(83, 83, 83, 0.16);
-  border-radius: 10px;
-
-  .el-form-item {
-    width: 100% !important;
-    height: 50px;
-    background: #fff;
-    border-radius: 7px;
-    .el-form-item__content{
-      height: 100%;
-      .el-input{
-        font-size: 16px;
-        height: 100%;
-        input{
-          height: 100%;
-          padding: 0 15px 0 40px;
-        }
-      }
-    }
-  }
-  .login-code {
-    .el-form-item__content{
-      display: flex;
-      justify-content: space-between;
-       .el-input{
-         width: 60%;
-       }
-       .code-img{
-         flex: 1;
-       }
-    }
-  }
-  .input-icon {
-    width: 20px;
-    height: 100%;
-    margin-left: 2px;
-    line-height: 50px;
-    use{
-      width: 20px;
-      height: 23.45px;
-    }
-  }
-  .el-button {
-    width: 100% !important;
-    height: 52px;
-    margin-top: 22px;
-    font-size: 20px;
-    background: #1e2864;
-    border-radius: 5px;
-    color: #ffffff;
-    border: none;
-  }
-}
-.code-img {
-  height: 43px;
-  margin-left: 20px;
-  display: inline-block;
-  img {
-    width: 100%;
-    height: 100% !important;
-    cursor: pointer;
-  }
-}
-</style>
+<template>
+  <div class="login" :style="'background-image:url(' + Background + ');'">
+    <el-form
+      ref="loginForm"
+      :model="loginForm"
+      :rules="loginRules"
+      label-position="left"
+      label-width="0px"
+      class="login-form"
+    >
+      <h3 class="title">智能库房综合管理系统</h3>
+      <el-form-item prop="username">
+        <el-input
+          v-model="loginForm.username"
+          type="text"
+          auto-complete="off"
+          placeholder="登录账号"
+        >
+          <svg-icon
+            slot="prefix"
+            icon-class="user"
+            class="el-input__icon input-icon"
+          />
+        </el-input>
+      </el-form-item>
+      <el-form-item prop="password">
+        <el-input
+          v-model="loginForm.password"
+          type="password"
+          auto-complete="off"
+          placeholder="密码"
+          @keyup.enter.native="handleLogin"
+        >
+          <svg-icon
+            slot="prefix"
+            icon-class="password"
+            class="el-input__icon input-icon"
+          />
+        </el-input>
+      </el-form-item>
+      <el-form-item class="login-code" prop="code">
+        <el-input
+          v-model="loginForm.code"
+          auto-complete="off"
+          placeholder="验证码"
+          @keyup.enter.native="handleLogin"
+        >
+          <svg-icon
+            slot="prefix"
+            icon-class="validCode"
+            class="el-input__icon input-icon"
+          />
+        </el-input>
+        <div class="code-img">
+          <img :src="codeUrl" @click="getCode">
+        </div>
+      </el-form-item>
+      <!-- <el-checkbox v-model="loginForm.rememberMe" style="margin: 0 0 25px 0">
+        记住我
+      </el-checkbox> -->
+      <el-form-item style="width: 100%">
+        <el-button
+          :loading="loading"
+          size="medium"
+          @click.native.prevent="handleLogin"
+        >
+          <span v-if="!loading">登 录</span>
+          <span v-else>登 录 中...</span>
+        </el-button>
+      </el-form-item>
+    </el-form>
+    <!--  底部  -->
+    <div v-if="$store.state.settings.showFooter" id="el-login-footer">
+      <span v-html="$store.state.settings.footerTxt" />
+      <span> ⋅ </span>
+      <a href="https://beian.miit.gov.cn/#/Integrated/index" target="_blank">{{
+        $store.state.settings.caseNumber
+      }}</a>
+    </div>
+  </div>
+</template>
+
+<script>
+import { encrypt } from '@/utils/rsaEncrypt'
+import Config from '@/settings'
+import { getCodeImg } from '@/api/login'
+import Cookies from 'js-cookie'
+import qs from 'qs'
+import Background from '@/assets/images/background.jpg'
+export default {
+  name: 'Login',
+  data() {
+    return {
+      Background: Background,
+      codeUrl: '',
+      cookiePass: '',
+      loginForm: {
+        username: 'admin',
+        password: '',
+        rememberMe: false,
+        code: '',
+        uuid: ''
+      },
+      loginRules: {
+        username: [
+          { required: true, trigger: 'blur', message: '登录账号不能为空' }
+        ],
+        password: [
+          { required: true, trigger: 'blur', message: '密码不能为空' }
+        ],
+        code: [
+          { required: true, trigger: 'change', message: '验证码不能为空' }
+        ]
+      },
+      loading: false,
+      redirect: undefined
+    }
+  },
+  watch: {
+    $route: {
+      handler: function(route) {
+        const data = route.query
+        if (data && data.redirect) {
+          this.redirect = data.redirect
+          delete data.redirect
+          if (JSON.stringify(data) !== '{}') {
+            this.redirect =
+              this.redirect + '&' + qs.stringify(data, { indices: false })
+          }
+        }
+      },
+      immediate: true
+    }
+  },
+  created() {
+    // 获取验证码
+    this.getCode()
+    // 获取用户名密码等Cookie
+    this.getCookie()
+    // token 过期提示
+    this.point()
+  },
+  methods: {
+    getCode() {
+      getCodeImg().then((res) => {
+        this.codeUrl = res.img
+        this.loginForm.uuid = res.uuid
+      })
+    },
+    getCookie() {
+      const username = Cookies.get('username')
+      let password = Cookies.get('password')
+      const rememberMe = Cookies.get('rememberMe')
+      // 保存cookie里面的加密后的密码
+      this.cookiePass = password === undefined ? '' : password
+      password = password === undefined ? this.loginForm.password : password
+      this.loginForm = {
+        username: username === undefined ? this.loginForm.username : username,
+        password: password,
+        rememberMe: rememberMe === undefined ? false : Boolean(rememberMe),
+        code: ''
+      }
+    },
+    handleLogin() {
+      this.$refs.loginForm.validate((valid) => {
+        const user = {
+          username: this.loginForm.username,
+          password: this.loginForm.password,
+          rememberMe: this.loginForm.rememberMe,
+          code: this.loginForm.code,
+          uuid: this.loginForm.uuid
+        }
+        if (user.password !== this.cookiePass) {
+          user.password = encrypt(user.password)
+        }
+        if (valid) {
+          this.loading = true
+          if (user.rememberMe) {
+            Cookies.set('username', user.username, {
+              expires: Config.passCookieExpires
+            })
+            Cookies.set('password', user.password, {
+              expires: Config.passCookieExpires
+            })
+            Cookies.set('rememberMe', user.rememberMe, {
+              expires: Config.passCookieExpires
+            })
+          } else {
+            Cookies.remove('username')
+            Cookies.remove('password')
+            Cookies.remove('rememberMe')
+          }
+          this.$store
+            .dispatch('Login', user)
+            .then(() => {
+              this.loading = false
+              this.$router.push({ path: this.redirect || '/' })
+            })
+            .catch(() => {
+              this.loading = false
+              this.getCode()
+            })
+        } else {
+          console.log('error submit!!')
+          return false
+        }
+      })
+    },
+    point() {
+      const point = Cookies.get('point') !== undefined
+      if (point) {
+        this.$message({
+          message: '当前登录状态已过期，请重新登录！',
+          type: 'warning',
+          duration: 5000
+        })
+        Cookies.remove('point')
+      }
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss">
+.login {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100vh;
+  position: relative;
+  background-size: cover;
+}
+.title {
+  margin-bottom: 30px;
+  font-size: 30px;
+  font-weight: 400;
+  text-align: center;
+  letter-spacing: 2px;
+  color: #1e2864;
+}
+
+.login-form {
+  width: 26%;
+  padding: 4% 2%;
+  position: absolute;
+  left: calc(100vw - 44%);
+  top: 50%;
+  transform: translateY(-50%);
+  background: #fff;
+  box-shadow: 0px 0px 16px 1px rgba(83, 83, 83, 0.16);
+  border-radius: 10px;
+
+  .el-form-item {
+    width: 100% !important;
+    height: 50px;
+    background: #fff;
+    border-radius: 7px;
+    .el-form-item__content{
+      height: 100%;
+      .el-input{
+        font-size: 16px;
+        height: 100%;
+        input{
+          height: 100%;
+          padding: 0 15px 0 40px;
+        }
+      }
+    }
+  }
+  .login-code {
+    .el-form-item__content{
+      display: flex;
+      justify-content: space-between;
+       .el-input{
+         width: 60%;
+       }
+       .code-img{
+         flex: 1;
+       }
+    }
+  }
+  .input-icon {
+    width: 20px;
+    height: 100%;
+    margin-left: 2px;
+    line-height: 50px;
+    use{
+      width: 20px;
+      height: 23.45px;
+    }
+  }
+  .el-button {
+    width: 100% !important;
+    height: 52px;
+    margin-top: 22px;
+    font-size: 20px;
+    background: #1e2864;
+    border-radius: 5px;
+    color: #ffffff;
+    border: none;
+  }
+}
+.code-img {
+  height: 43px;
+  margin-left: 20px;
+  display: inline-block;
+  img {
+    width: 100%;
+    height: 100% !important;
+    cursor: pointer;
+  }
+}
+</style>
diff --git a/src/views/storeManage/listenManage/module/bindCamera.vue b/src/views/storeManage/listenManage/module/bindCamera.vue
index 21e08ed..b313869 100644
--- a/src/views/storeManage/listenManage/module/bindCamera.vue
+++ b/src/views/storeManage/listenManage/module/bindCamera.vue
@@ -96,6 +96,8 @@ export default {
         this.devOptions = devices.map(data => { return { value: data.id, label: data.storeroomId.name + '-' + data.deviceName, self: data } })
         if (this.devOptions?.length > 0) {
           this.devType = this.devOptions[0].value
+        } else {
+          this.devType = ''
         }
       })
     },
diff --git a/src/views/storeManage/listenManage/videoListen/index.vue b/src/views/storeManage/listenManage/videoListen/index.vue
index 1d2ab52..6f7ce06 100644
--- a/src/views/storeManage/listenManage/videoListen/index.vue
+++ b/src/views/storeManage/listenManage/videoListen/index.vue
@@ -24,7 +24,7 @@
       </el-table-column> -->
       <el-table-column prop="deviceCamerBindId.storeroomName" label="所属区域" min-width="150" align="center" />
       <el-table-column prop="deviceCamerBindId.deviceName" label="设备" align="center" min-width="150" />
-      <el-table-column prop="cameraName" label="摄像头" align="center" min-width="150" />
+      <el-table-column prop="deviceCamerBindId.cameraName" label="摄像头" align="center" min-width="150" />
       <el-table-column prop="event" label="事件" align="center" min-width="180" />
       <el-table-column prop="description" label="内容描述" align="center" min-width="180" />
       <el-table-column prop="create_time" label="事件发生时间" align="center" min-width="180">
@@ -59,7 +59,8 @@ export default {
   cruds() {
     return CRUD({
       url: 'api/videos/list',
-      optShow: {}
+      optShow: {},
+      sort: ['createTime,desc']
     })
   },
   data() {
diff --git a/src/views/storeManage/tagManage/bindTagList/index.vue b/src/views/storeManage/tagManage/bindTagList/index.vue
index 501adc0..1a60bc8 100644
--- a/src/views/storeManage/tagManage/bindTagList/index.vue
+++ b/src/views/storeManage/tagManage/bindTagList/index.vue
@@ -1,203 +1,210 @@
-<template>
-  <div>
-    <div class="head-container header">
-      <div class="head-left">
-        <el-select slot="prepend" v-model="query.isType" class="filter-item" style="width: 130px;height:30px;margin-right:10px" @change="initData">
-          <el-option v-for="item in typeOptions" :key="item.value" :label="item.label" :value="item.value" />
-        </el-select>
-        <el-input v-model="query[inputSelect]" clearable size="small" placeholder="请输入关键词" style="width: 250px;" class="input-prepend filter-item" @keyup.enter.native="initData">
-          <el-select slot="prepend" v-model="inputSelect" style="width: 100px;">
-            <el-option v-for="item in queryOptions" :key="item.value" :label="item.label" :value="item.value" />
-          </el-select>
-        </el-input>
-        <el-button class="filter-item" size="mini" type="success" icon="el-icon-search" @click="initData">搜索</el-button>
-      </div>
-      <div class="archives-handler-btn">
-        <!-- iconfont icon-weibiaoti-2 -->
-        <el-button class="lending-btn" type="primary" :loading="unbindBtnLoading" :disabled="selections.length === 0" @click="unbind()">
-          <svg-icon icon-class="remove_bind" class-name="svg-style" style="margin-right:8px" />解除绑定
-        </el-button>
-      </div>
-    </div>
-    <el-table ref="table" v-loading="loading" :data="bindTagList" style="width: 100%;" height="calc(100vh - 357px)" @row-click="clickRowHandler" @selection-change="selectionChangeHandler">
-      <el-table-column type="selection" width="55" align="center" />
-      <el-table-column type="index" label="序号" width="55" align="center" />
-      <el-table-column prop="tid" label="TID" align="center" />
-      <el-table-column label="绑定对象" align="center">
-        <template slot-scope="scope">
-          <span v-if="scope.row.isType === 1">档案</span>
-          <span v-if="scope.row.isType === 2">档案盒</span>
-          <span v-if="scope.row.isType === 3">层架位</span>
-        </template>
-      </el-table-column>
-      <el-table-column prop="title" label="标签名称" align="center" />
-      <el-table-column prop="update_time" width="175" label="操作时间" align="center">
-        <template slot-scope="scope">
-          <div>{{ scope.row.update_time | parseTime }}</div>
-        </template>
-      </el-table-column>
-    </el-table>
-    <el-pagination :page-size.sync="page.size" :total="page.total" :current-page.sync="page.page" style="margin-top: 8px;" layout="total, prev, pager, next, sizes" @size-change="sizeChangeHandler($event)" @current-change="pageChangeHandler" />
-    <el-dialog title="解除绑定" :visible.sync="unbindVisible">
-      <span class="dialog-right-top" />
-      <span class="dialog-left-bottom" />
-      <div class="setting-dialog">
-        <div class="dialog-delt">
-          <p><span>确定解除当前选中标签吗？</span></p>
-        </div>
-        <div slot="footer" class="dialog-footer">
-          <el-button type="primary" @click.native="handleConfirm">确定</el-button>
-        </div>
-      </div>
-    </el-dialog>
-  </div>
-  <!--删除对话框组件-->
-</template>
-
-<script>
-import { initTagList, unbindTag } from '@/api/storeManage/tagManage/bindTagList'
-export default {
-  data() {
-    return {
-      selections: [],
-      bindTagList: [],
-      loading: false,
-      page: {
-        total: 0,
-        size: 10,
-        page: 1
-      },
-      query: {
-        isType: 0,
-        tid: '',
-        query: ''
-      },
-      typeOptions: [
-        {
-          label: '全部',
-          value: 0
-        },
-        {
-          label: '档案',
-          value: 1
-        },
-        {
-          label: '档案盒',
-          value: 2
-        },
-        {
-          label: '层位',
-          value: 3
-        }
-      ],
-      inputSelect: 'tid',
-      queryOptions: [
-        {
-          label: 'TID',
-          value: 'tid'
-        },
-        {
-          label: '标签名称',
-          value: 'query'
-        }
-      ],
-      unbindVisible: false,
-      unbindBtnLoading: false
-    }
-  },
-  created() {
-    this.initData()
-  },
-  methods: {
-    initData() {
-      this.loading = true
-      initTagList(this.getQueryParams()).then((data) => {
-        this.bindTagList = data.content
-        this.page.total = data.totalElements
-        this.loading = false
-        console.log(data)
-      })
-    },
-    getQueryParams() {
-      Object.keys(this.query).length !== 0 && Object.keys(this.query).forEach(item => {
-        if (this.query[item] === null || this.query[item] === '') this.query[item] = undefined
-      })
-      const params = {
-        page: this.page.page - 1,
-        size: this.page.size,
-        ...this.query
-      }
-      if (params.isType === 0) {
-        params.isType = undefined
-      }
-      return params
-    },
-    clickRowHandler(row) {
-      this.$refs.table.toggleRowSelection(row)
-    },
-    unbind() {
-      this.unbindVisible = true
-    },
-    // 每页条数改变
-    sizeChangeHandler(e) {
-      this.page.size = e
-      this.page.page = 1
-      this.initData()
-    },
-    // 当前页改变
-    pageChangeHandler(e) {
-      this.page.page = e
-      this.initData()
-    },
-    selectionChangeHandler(val) {
-      this.selections = val
-    },
-    handleConfirm() {
-      console.log(1)
-      this.unbindVisible = false
-      this.unbindBtnLoading = true
-      const unbindData = this.selections.map((item) => {
-        return {
-          labelType: item.isType,
-          tid: item.tid
-        }
-      })
-      unbindTag(unbindData).then((res) => {
-        this.unbindBtnLoading = false
-        this.$message({
-          message: '解除绑定成功',
-          type: 'success',
-          duration: 2500
-        })
-        this.initData()
-      })
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-@import "~@/assets/styles/archives-manage.scss";
-.header {
-  display: flex;
-  justify-content: space-between;
-  padding-top: 0;
-  margin-top: -10px;
-  .head-left {
-    .el-button {
-      margin-left: -10px;
-      background-color: #3a99fd;
-      &:hover {
-        background-color: #02255f;
-      }
-    }
-  }
-}
-.archives-handler-btn .el-button {
-  height: 30px;
-  width: 106px;
-}
-::v-deep .input-prepend .el-input__inner {
-    padding-left: 100px;
-}
-</style>
+<template>
+  <div>
+    <div class="head-container header">
+      <div class="head-left">
+        <el-select slot="prepend" v-model="query.isType" class="filter-item" style="width: 130px;height:30px;margin-right:10px" @change="initData">
+          <el-option v-for="item in typeOptions" :key="item.value" :label="item.label" :value="item.value" />
+        </el-select>
+        <el-input v-model="query[inputSelect]" clearable size="small" placeholder="请输入关键词" style="width: 250px;" class="input-prepend filter-item" @keyup.enter.native="initData">
+          <el-select slot="prepend" v-model="inputSelect" style="width: 100px;">
+            <el-option v-for="item in queryOptions" :key="item.value" :label="item.label" :value="item.value" />
+          </el-select>
+        </el-input>
+        <el-button class="filter-item" size="mini" type="success" icon="el-icon-search" @click="initData">搜索</el-button>
+      </div>
+      <div class="archives-handler-btn">
+        <!-- iconfont icon-weibiaoti-2 -->
+        <el-button class="lending-btn iconfont icon-jiechubangding-fanbai" type="primary" size="mini" :loading="unbindBtnLoading" :disabled="selections.length === 0" @click="unbind()">
+          <!-- <svg-icon icon-class="remove_bind" class-name="svg-style" style="margin-right:8px" /> -->
+          解除绑定
+        </el-button>
+      </div>
+    </div>
+    <el-table ref="table" v-loading="loading" :data="bindTagList" style="width: 100%;" height="calc(100vh - 357px)" @row-click="clickRowHandler" @selection-change="selectionChangeHandler">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column type="index" label="序号" width="55" align="center" />
+      <el-table-column prop="tid" label="TID" align="center" />
+      <el-table-column label="绑定对象" align="center">
+        <template slot-scope="scope">
+          <span v-if="scope.row.isType === 1">档案</span>
+          <span v-if="scope.row.isType === 2">档案盒</span>
+          <span v-if="scope.row.isType === 3">层架位</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="title" label="标签名称" align="center" />
+      <el-table-column prop="update_time" width="175" label="操作时间" align="center">
+        <template slot-scope="scope">
+          <div>{{ scope.row.update_time | parseTime }}</div>
+        </template>
+      </el-table-column>
+    </el-table>
+    <el-pagination :page-size.sync="page.size" :total="page.total" :current-page.sync="page.page" style="margin-top: 8px;" layout="total, prev, pager, next, sizes" @size-change="sizeChangeHandler($event)" @current-change="pageChangeHandler" />
+    <el-dialog title="解除绑定" :visible.sync="unbindVisible">
+      <span class="dialog-right-top" />
+      <span class="dialog-left-bottom" />
+      <div class="setting-dialog">
+        <div class="dialog-delt">
+          <p><span>确定解除当前选中标签吗？</span></p>
+        </div>
+        <div slot="footer" class="dialog-footer">
+          <el-button type="primary" @click.native="handleConfirm">确定</el-button>
+        </div>
+      </div>
+    </el-dialog>
+  </div>
+  <!--删除对话框组件-->
+</template>
+
+<script>
+import { initTagList, unbindTag } from '@/api/storeManage/tagManage/bindTagList'
+export default {
+  data() {
+    return {
+      selections: [],
+      bindTagList: [],
+      loading: false,
+      page: {
+        total: 0,
+        size: 10,
+        page: 1
+      },
+      query: {
+        isType: 0,
+        tid: '',
+        query: ''
+      },
+      typeOptions: [
+        {
+          label: '全部',
+          value: 0
+        },
+        {
+          label: '档案',
+          value: 1
+        },
+        {
+          label: '档案盒',
+          value: 2
+        },
+        {
+          label: '层位',
+          value: 3
+        }
+      ],
+      inputSelect: 'tid',
+      queryOptions: [
+        {
+          label: 'TID',
+          value: 'tid'
+        },
+        {
+          label: '标签名称',
+          value: 'query'
+        }
+      ],
+      unbindVisible: false,
+      unbindBtnLoading: false
+    }
+  },
+  created() {
+    this.initData()
+  },
+  methods: {
+    initData() {
+      this.loading = true
+      initTagList(this.getQueryParams()).then((data) => {
+        this.bindTagList = data.content
+        this.page.total = data.totalElements
+        this.loading = false
+        console.log(data)
+      })
+    },
+    getQueryParams() {
+      Object.keys(this.query).length !== 0 && Object.keys(this.query).forEach(item => {
+        if (this.query[item] === null || this.query[item] === '') this.query[item] = undefined
+      })
+      const params = {
+        page: this.page.page - 1,
+        size: this.page.size,
+        ...this.query
+      }
+      if (params.isType === 0) {
+        params.isType = undefined
+      }
+      return params
+    },
+    clickRowHandler(row) {
+      this.$refs.table.toggleRowSelection(row)
+    },
+    unbind() {
+      this.unbindVisible = true
+    },
+    // 每页条数改变
+    sizeChangeHandler(e) {
+      this.page.size = e
+      this.page.page = 1
+      this.initData()
+    },
+    // 当前页改变
+    pageChangeHandler(e) {
+      this.page.page = e
+      this.initData()
+    },
+    selectionChangeHandler(val) {
+      this.selections = val
+    },
+    handleConfirm() {
+      console.log(1)
+      this.unbindVisible = false
+      this.unbindBtnLoading = true
+      const unbindData = this.selections.map((item) => {
+        return {
+          labelType: item.isType,
+          tid: item.tid
+        }
+      })
+      unbindTag(unbindData).then((res) => {
+        this.unbindBtnLoading = false
+        this.$message({
+          message: '解除绑定成功',
+          type: 'success',
+          duration: 2500
+        })
+        this.initData()
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/styles/archives-manage.scss";
+.header {
+  display: flex;
+  justify-content: space-between;
+  padding-top: 0;
+  margin-top: -10px;
+  .head-left {
+    .el-button {
+      margin-left: -10px;
+      background-color: #3a99fd;
+      &:hover {
+        background-color: #02255f;
+      }
+    }
+  }
+}
+.archives-handler-btn .el-button {
+  // height: 30px;
+  width: 106px;
+  ::v-deep span{
+    margin-left: 0;
+  }
+  &::before {
+    padding-left: 5px;
+  }
+}
+::v-deep .input-prepend .el-input__inner {
+    padding-left: 100px;
+}
+</style>