From 844ab0bd95485a8efcb43c74cd832b58b9de14df Mon Sep 17 00:00:00 2001
From: zhangzengfei <zhangzengfei@iotlink.com>
Date: 星期四, 30 七月 2020 13:44:40 +0800
Subject: [PATCH] 添加底库管理
---
src/pages/library/index/mixins.ts | 19
src/components/searching/SearchRight.vue | 37
src/components/searching/UploadIcon.vue | 44
src/components/searching/uploadForModel.vue | 345 +++
src/pages/library/components/util.js | 268 ++
src/components/searching/SearchLeft.vue | 361 +++
src/pages/library/components/upload.vue | 483 ++++
src/pages/library/components/baseList.vue | 406 +++
src/components/searching/uploadDialog.vue | 352 +++
src/pages/library/components/addBase.vue | 482 ++++
src/pages/desktop/index/mock/userData.json | 2
src/pages/library/components/carList.vue | 1528 ++++++++++++++
src/pages/library/index/App.vue | 172 +
src/pages/library/index/main.ts | 32
src/components/fTemplate.vue | 57
src/components/searching/UploadImg.vue | 385 +++
src/pages/library/components/personList.vue | 1153 +++++++++++
src/assets/duihao.png | 0
18 files changed, 6,125 insertions(+), 1 deletions(-)
diff --git a/src/assets/duihao.png b/src/assets/duihao.png
new file mode 100644
index 0000000..4eec823
--- /dev/null
+++ b/src/assets/duihao.png
Binary files differ
diff --git a/src/components/fTemplate.vue b/src/components/fTemplate.vue
new file mode 100644
index 0000000..f095c00
--- /dev/null
+++ b/src/components/fTemplate.vue
@@ -0,0 +1,57 @@
+<template>
+ <span v-if="isShow" :class="className">
+ <slot></slot>
+ {{textValve}}
+ </span>
+</template>
+
+<script>
+export default {
+ name: 'fTemplate',
+ props: {
+ className: {
+ type: String,
+ default: ''
+ },
+ textValve: {
+ type: String,
+ default: ''
+ },
+ authority: {
+ type: String,
+ default: 'authority'
+ }
+ },
+ data() {
+ return {
+ // isAdmin: sessionStorage.getItem('isAdmin') === 'true',
+ buttonAuthority: sessionStorage.getItem('buttonAuthoritys') || []
+ }
+ },
+ computed: {
+ isAdmin () {
+ if (
+ sessionStorage.getItem('userInfo') &&
+ sessionStorage.getItem('userInfo') !== ''
+ ) {
+ let loginName = JSON.parse(sessionStorage.getItem('userInfo')).username
+ return (
+ loginName === 'superadmin' || loginName === 'basic'
+ )
+ }
+ return false
+ },
+ isShow () {
+ if (this.isAdmin) {
+ return true
+ } else if (
+ this.buttonAuthority.indexOf(',' + this.authority + ',') > -1
+ ) {
+ return true
+ } else {
+ return false
+ }
+ }
+ }
+}
+</script>
diff --git a/src/components/searching/SearchLeft.vue b/src/components/searching/SearchLeft.vue
new file mode 100644
index 0000000..c04226f
--- /dev/null
+++ b/src/components/searching/SearchLeft.vue
@@ -0,0 +1,361 @@
+<template>
+ <div class="left-section">
+ <div class="source">
+ <h2 class="title">鏁版嵁婧�</h2>
+ <icon class="iconfont iconchushaixuanxiang" @click="closeUpload()"></icon>
+ </div>
+ <p class="compearValue">
+ <span
+ style="font-family: PingFangSC-Regular;font-size: 13px;color: #333333;letter-spacing: 0.28px;margin-right:10px"
+ >瀵规瘮闃堝��</span>
+ <el-input-number
+ size="mini"
+ v-model="picQuality"
+ controls-position="right"
+ :min="1"
+ :max="100"
+ ></el-input-number>
+ </p>
+ <div class="upload-img-box">
+ <img :src="'/httpImage/'+tempUploadImg" alt="涓存椂娴嬭瘯" v-show="!displayUpload" class="bigPhoto" />
+ <el-upload
+ ref="upload"
+ :list-type="'picture-card'"
+ action
+ :http-request="uploadImg"
+ v-show="displayUpload"
+ accept="image/*"
+ :limit="1"
+ :on-remove="removeImg"
+ :on-success="uploadSuccess"
+ :on-error="uploadError"
+ :before-upload="beforeUpload"
+ >
+ <i
+ ref="uploadIcon"
+ class="el-icon-upload"
+ style="color:#3D68E1;font-size:60px;position:relative;left:50px"
+ ></i>
+ <span
+ class="el-upload__text"
+ style="font-size:12px;color:#3D68E1;position:relative;top:25px;left:-30px"
+ >
+ <em>鐐瑰嚮閫夋嫨涓婁紶鍥剧墖</em>
+ </span>
+ </el-upload>
+ </div>
+ <div class="res-img-box" v-if="resReady" :style="oneLine? 'height:95px':'height:185px'">
+ <div class="single-box fl" v-for="(item, index) in realSmallPath" :key="index">
+ <img
+ :src="item
+ ? '/httpImage/'+item
+ : tempImg
+ "
+ @click="selected($event,index)"
+ style="max-height:100%"
+ :style="index == clickNum ? 'border:1px solid #FF7733':''"
+ />
+ <img class="select" v-show="index == clickNum" :src="selectedIcon" alt />
+ </div>
+ <div class="single-box fl" v-for="(item, index) in unrealSmallPath" :key="index+'t'">
+ <img :src="item
+ ? item
+ : tempImg
+ " />
+ </div>
+ </div>
+ <el-select
+ v-if="resReady"
+ v-model="compareTabs"
+ multiple
+ collapse-tags
+ @change="selectChange"
+ style="margin: 15px 0;width: 100%"
+ placeholder="璇烽�夋嫨"
+ >
+ <el-option
+ v-for="item in VideoPhotoData.tabsForUploadImg"
+ :key="item.key+'p'"
+ :label="item.title"
+ :disabled="item.disabled"
+ :value="item.key"
+ ></el-option>
+ </el-select>
+ <el-button-group v-if="resReady" style="margin-top:10px">
+ <el-button type="info" size="small" @click="reUpload">閲嶆柊涓婁紶</el-button>
+ <el-button type="primary" size="small" style="margin-left:10px" @click="searchStart">寮�濮嬫绱�</el-button>
+ </el-button-group>
+ </div>
+</template>
+
+<script>
+import request from "@/scripts/httpRequest"
+export default {
+ watch: {
+ "TreeDataPool.selectedNodes": function (value) {
+ this.VideoPhotoData.treeNodes = value
+ this.VideoPhotoData.findPerson()
+ },
+ "TreeDataPool.selectedNodes": function (value) {
+ this.VideoPhotoData.searchTime = value
+ this.VideoPhotoData.findPerson()
+ },
+ "VideoPhotoData.tabsForUploadImg": function (value) {
+ this.selectChange()
+ },
+ "VideoPhotoData.uploadImg": {
+ handler(val) {
+ // console.log('val:::', val)
+ if (val !== "") {
+ this.tempUploadImg = val
+ this.realSmallPath = [val]
+ this.unrealSmallPath = [this.tempImg, this.tempImg]
+ this.resReady = true
+ this.displayUpload = false
+ }
+ },
+ immediate: true,
+ deep: true
+ }
+ },
+ computed: {
+ getResImg() {
+ let arr = this.realSmallPath;
+ // let str =
+ // "http://hbimg.b0.upaiyun.com/56ce44d4d6746ef6c88de4d241f76713fc67cf13b05b-ejL0af_fw658";
+ // let time = parseInt(Math.random() * 10);
+ // for (let i = 0; i < time; i++) {
+ // arr.push(str);
+ // }
+ if (arr.length <= 3) {
+ arr.length = 3;
+ } else if (arr.length <= 6) {
+ arr.length = 6;
+ } else if (arr.length <= 9) {
+ arr.length = 9;
+ }
+ return arr;
+ }
+ },
+ data() {
+ return {
+ tempUploadImg: "",
+ tempImg: require("../../assets/nobody.png"),
+ selectedIcon: require("../../assets/duihao.png"),
+ bigPhoto: [],
+ displayUpload: true,
+ clickNum: 0,
+ picQuality: 60,
+ dialogImageUrl: "",
+ dialogVisible: false,
+ resReady: false,
+ value: "",
+ compareTabs: ["esData"],
+ realSmallPath: [],
+ unrealSmallPath: [],
+ oneLine: true,
+ multiSelect: false
+ };
+ },
+ mounted() {
+ this.selectChange()
+ },
+ methods: {
+ selectChange() {
+ if (!this.compareTabs.includes("esData") && this.compareTabs.length > 0) {
+ for (let i = 0; i < this.VideoPhotoData.tabsForUploadImg.length; i++) {
+ if (this.VideoPhotoData.tabsForUploadImg[i].title === "鎶撴媿搴�") {
+ this.VideoPhotoData.tabsForUploadImg[i].disabled = true;
+ }
+ }
+ this.$emit('labelDisabled', true)
+ return;
+ }
+ if (this.compareTabs.includes("esData")) {
+ for (let i = 0; i < this.VideoPhotoData.tabsForUploadImg.length; i++) {
+ if (this.VideoPhotoData.tabsForUploadImg[i].title !== "鎶撴媿搴�") {
+ this.VideoPhotoData.tabsForUploadImg[i].disabled = true;
+ }
+ }
+ this.$emit('labelDisabled', false)
+ } else {
+ for (let i = 0; i < this.VideoPhotoData.tabsForUploadImg.length; i++) {
+ this.VideoPhotoData.tabsForUploadImg[i].disabled = false;
+ }
+ }
+ },
+ selected(e, index) {
+ // console.log(index, '閫変腑浜嗙鍑犱釜', e)
+ this.clickNum = index
+ },
+ async uploadImg(param) {
+ const fd = new FormData()
+ fd.append('file', param.file)
+ fd.append('picQuality', this.picQuality)
+ // console.log("1121231", fd)
+ let res = await request({
+ method: 'post',
+ url: `/data/api-v/dbperson/faceExtract`,
+ data: fd
+ })
+ this.unrealSmallPath.length = 0
+ // console.log("鍒囧浘杩斿洖锛�", res)
+ if (res.success) {
+ document.querySelector(".el-upload-list").querySelector("img").src = "http://" + res.data.uploadImage
+ this.realSmallPath = res.data.smImage
+ if (res.data.smImage.length > 3) {
+ this.oneLine = false
+ } else {
+ this.oneLine = true
+ }
+ if (res.data.smImage.length % 3 !== 0) {
+ // 鐢ㄨ櫄鎷熶汉鍍忚ˉ鍏ㄦ暣琛�
+ const length = res.data.smImage.length % 3
+ console.log("鐪嬬湅length鐨勫��", length)
+ this.unrealSmallPath.length = 0
+ for (var i = 0; i < 3 - length; i++) {
+ this.unrealSmallPath.push(this.tempImg)
+ }
+ }
+ console.log('--------------锛�', param)
+ }
+ },
+ uploadSuccess(resp, file, fileList) {
+ this.$notify({
+ title: "鎴愬姛",
+ message: "鍥剧墖涓婁紶鎴愬姛锛�",
+ type: "success"
+ });
+ this.resReady = true;
+ console.log("鏂囦欢鍒楄〃锛�", file, fileList)
+ console.log("涓婁紶鐨勬枃浠讹細", this.bigPhoto)
+ },
+ closeUpload() {
+ this.$emit("closeUpload")
+ },
+ beforeUpload() {
+ this.$refs.uploadIcon.parentNode.classList.add("s-display");
+ console.log("涓婁紶涔嬪墠鏂囦欢锛�", this.bigPhoto)
+ },
+ uploadError(err) {
+ this.$notify({
+ title: "澶辫触",
+ message: "鍥剧墖涓婁紶澶辫触锛�" + err,
+ type: "warning"
+ });
+ console.log("涓婁紶澶辫触", err)
+ this.dialogImageUrl = "";
+ this.dialogVisible = false;
+ this.$refs.uploadIcon.parentNode.classList.remove("s-display");
+ },
+ removeImg() {
+ this.resReady = false;
+ this.$refs.uploadIcon.parentNode.classList.remove("s-display");
+ },
+ reUpload() {
+ this.displayUpload = true
+ this.$refs.upload.clearFiles();
+ this.dialogImageUrl = "";
+ this.dialogVisible = false;
+ this.resReady = false;
+ this.$refs.uploadIcon.parentNode.classList.remove("s-display");
+ },
+ searchStart() {
+ this.VideoPhotoData.rightSectionDisplay = true;
+ this.VideoPhotoData.picUrl = this.realSmallPath[this.clickNum]
+ this.VideoPhotoData.compareTabs = this.compareTabs
+ this.VideoPhotoData.showType = "findByPic"
+ this.VideoPhotoData.findPerson()
+ },
+ }
+};
+</script>
+<style lang="scss">
+.left-section {
+ width: 300px;
+ height: 100%;
+ //border: 1px solid #ccc;
+ box-sizing: border-box;
+ background: #fff;
+ //position: relative;
+ //left: -200px;
+ float: left;
+ margin-right: 15px;
+ padding: 15px;
+ // .el-upload-dragger {
+ // display:none!important
+ // }
+ .source {
+ position: relative;
+ icon {
+ position: absolute;
+ top: 0px;
+ right: 0px;
+ cursor: pointer;
+ }
+ }
+ .el-upload--picture-card {
+ width: 260px !important;
+ }
+ .el-upload-list--picture-card {
+ width: 260px !important;
+ .el-upload-list__item {
+ width: 260px !important;
+ img {
+ width: 260px;
+ height: 148px;
+ object-fit: contain;
+ }
+ }
+ }
+ .title {
+ text-align: left;
+ }
+ .compearValue {
+ text-align: left;
+ padding: 15px 0px;
+ }
+}
+.right-section {
+ width: calc(100% - 315px);
+ height: 100%;
+ float: left;
+ overflow: auto;
+}
+.res-img-box {
+ width: 100%;
+ overflow: auto;
+ //height: 95px;
+ margin-top: 10px;
+ text-align: left;
+ .single-box {
+ //border: 1px solid #ccc;
+ width: 33%;
+ height: 90px;
+ padding: 5px;
+ box-sizing: border-box;
+ position: relative;
+ img {
+ width: 100%;
+ cursor: pointer;
+ border-radius: 3px;
+ }
+ .select {
+ position: absolute;
+ width: 20px;
+ height: 20px;
+ bottom: 5px;
+ right: 5px;
+ }
+ }
+}
+.s-display {
+ display: none !important;
+}
+
+.bigPhoto {
+ width: 148px;
+ height: 148px;
+ border-radius: 4px;
+}
+</style>
diff --git a/src/components/searching/SearchRight.vue b/src/components/searching/SearchRight.vue
new file mode 100644
index 0000000..dc6ce77
--- /dev/null
+++ b/src/components/searching/SearchRight.vue
@@ -0,0 +1,37 @@
+<template>
+ <div class="right-section" v-if="VideoPhotoData.rightSectionDisplay">
+ <Card
+ v-for="(item, index) in VideoPhotoData.persons"
+ :key="index + 'u'"
+ :outHeight="'162px'"
+ :outWidth="cardWidth"
+ :data="item"
+ :showType="'findByPic'"
+ @detailsClick="getDetails($event, index)"
+ ></Card>
+ </div>
+</template>
+
+<script>
+import Card from "../subComponents/Card";
+
+export default {
+ components: {
+ Card
+ },
+ props: {
+ cardWidth: {
+ type: String,
+ default: "25%"
+ },
+ },
+ methods: {
+ getDetails(ev, index) {
+ this.CardList.datalist = this.VideoPhotoData.persons
+ let obj = this.CardList.datalist[index];
+ this.CardList.details.push(obj);
+ this.VideoPhotoData.activeCard = obj.activeObject.id
+ }
+ }
+};
+</script>
diff --git a/src/components/searching/UploadIcon.vue b/src/components/searching/UploadIcon.vue
new file mode 100644
index 0000000..837ac72
--- /dev/null
+++ b/src/components/searching/UploadIcon.vue
@@ -0,0 +1,44 @@
+<template>
+ <div class="uploadIconBox">
+ <i class="el-input__icon el-icon-camera-solid" @click="showUpload"></i>
+ <SearchLeft v-show="visibile" @closeUpload="showUpload"></SearchLeft>
+ </div>
+</template>
+<script>
+import SearchLeft from './uploadForModel'
+export default {
+ components: {
+ SearchLeft
+ },
+ data() {
+ return {
+ visibile: false
+ }
+ },
+ methods: {
+ showUpload() {
+ this.visibile = !this.visibile
+ }
+ }
+}
+</script>
+<style lang="scss">
+.uploadIconBox {
+ position: relative;
+ i {
+ font-size: 20px;
+ color: #999;
+ cursor: pointer;
+ }
+ .left-section1 {
+ //border: 1px solid #ccc;
+ border-radius: 5px;
+ position: absolute;
+ z-index: 2;
+ height: 700px;
+ left: -330px;
+ top: 45px;
+ box-shadow: #eee 0px 0px 10px 10px;
+ }
+}
+</style>
\ No newline at end of file
diff --git a/src/components/searching/UploadImg.vue b/src/components/searching/UploadImg.vue
new file mode 100644
index 0000000..4f59cee
--- /dev/null
+++ b/src/components/searching/UploadImg.vue
@@ -0,0 +1,385 @@
+<template>
+ <div class="s-upload-img">
+ <div class="upload-area">
+ <h2 class="title">
+ 鏁版嵁婧�
+ <i
+ class="iconfont iconchushaixuanxiang close"
+ style="margin-left:200px;cursor:pointer;color:#ccc"
+ @click="VideoPhotoData.uploadDiaplay = false"
+ ></i>
+ </h2>
+ <p class="compearValue">
+ <span
+ style="font-family: PingFangSC-Regular;font-size: 13px;color: #333333;letter-spacing: 0.28px;margin-right:10px"
+ >瀵规瘮闃堝��</span>
+ <el-input-number
+ size="mini"
+ v-model="VideoPhotoData.threshold"
+ controls-position="right"
+ :min="1"
+ :max="100"
+ ></el-input-number>
+ </p>
+ <div class="upload-img-box">
+ <img :src="'/httpImage/'+tempUploadImg" alt="涓存椂娴嬭瘯" v-show="!displayUpload" class="bigPhoto" />
+ <el-upload
+ ref="upload"
+ :list-type="'picture-card'"
+ action
+ :http-request="uploadImg"
+ v-show="displayUpload"
+ accept="image/*"
+ :limit="1"
+ :on-remove="removeImg"
+ :on-success="uploadSuccess"
+ :on-error="uploadError"
+ :before-upload="beforeUpload"
+ >
+ <i
+ ref="uploadIcon"
+ class="el-icon-upload"
+ style="color:#3D68E1;font-size:60px;position:relative;left:50px"
+ ></i>
+ <span
+ class="el-upload__text"
+ style="font-size:12px;color:#3D68E1;position:relative;top:25px;left:-30px"
+ >
+ <em>鐐瑰嚮閫夋嫨涓婁紶鍥剧墖</em>
+ </span>
+ <!-- <i class="el-icon-upload" style="color:#3D68E1"></i>
+ <div class="el-upload__text" style="font-size:12px;color:#3D68E1">灏嗘枃浠舵嫋鍒版澶勶紝鎴�<em>鐐瑰嚮涓婁紶</em></div>-->
+ </el-upload>
+ <!-- <el-dialog :visible.sync="dialogVisible">
+ <img width="100%" :src="dialogImageUrl" alt />
+ </el-dialog>-->
+ </div>
+ <div class="res-img-box" v-if="resReady" :style="oneLine? 'height:95px':'height:185px'">
+ <div class="single-box fl" v-for="(item, index) in realSmallPath" :key="index">
+ <img
+ :src="item
+ ? '/httpImage/'+item
+ : tempImg
+ "
+ @click="selected($event,index)"
+ style="max-height:100%"
+ :style="index == clickNum ? 'border:1px solid #FF7733':''"
+ />
+ <img class="select" v-show="index == clickNum" :src="selectedIcon" alt />
+ </div>
+ <div class="single-box fl" v-for="(item, index) in unrealSmallPath" :key="index+'t'">
+ <img :src="item
+ ? item
+ : tempImg
+ " />
+ </div>
+ </div>
+ <el-select
+ v-if="resReady"
+ v-model="compareTabs"
+ multiple
+ collapse-tags
+ @change="selectChange"
+ style="margin: 15px 0;width: 100%"
+ placeholder="璇烽�夋嫨"
+ >
+ <el-option
+ v-for="item in VideoPhotoData.tabsForUploadImg"
+ :key="item.key+'p'"
+ :label="item.title"
+ :disabled="item.disabled"
+ :value="item.key"
+ ></el-option>
+ </el-select>
+ <el-button-group v-if="resReady" style="margin-top:10px;">
+ <el-button type="info" size="small" @click="reUpload">閲嶆柊涓婁紶</el-button>
+ <el-button type="primary" size="small" style="margin-left:10px" @click="searchStart">寮�濮嬫绱�</el-button>
+ </el-button-group>
+ </div>
+ </div>
+</template>
+
+<script>
+import Card from "../subComponents/Card";
+import request from "@/scripts/httpRequest"
+export default {
+ watch: {
+ "VideoPhotoData.tabsForUploadImg": function (value) {
+ this.selectChange()
+ },
+ "VideoPhotoData.uploadImg": {
+ handler(val) {
+ // console.log('val:::', val)
+ if (val !== "") {
+ this.tempUploadImg = val
+ this.realSmallPath = [val]
+ this.unrealSmallPath = [this.tempImg, this.tempImg]
+ this.resReady = true
+ this.displayUpload = false
+ }
+ },
+ immediate: true,
+ deep: true
+ }
+ },
+ computed: {
+ getResImg() {
+ let arr = this.realSmallPath;
+ // let str =
+ // "http://hbimg.b0.upaiyun.com/56ce44d4d6746ef6c88de4d241f76713fc67cf13b05b-ejL0af_fw658";
+ // let time = parseInt(Math.random() * 10);
+ // for (let i = 0; i < time; i++) {
+ // arr.push(str);
+ // }
+ if (arr.length <= 3) {
+ arr.length = 3;
+ } else if (arr.length <= 6) {
+ arr.length = 6;
+ } else if (arr.length <= 9) {
+ arr.length = 9;
+ }
+ return arr;
+ }
+ },
+ data() {
+ return {
+ tempUploadImg: "",
+ tempImg: require("../../assets/nobody.png"),
+ selectedIcon: require("../../assets/duihao.png"),
+ bigPhoto: [],
+ displayUpload: true,
+ clickNum: 0,
+ picQuality: 60,
+ dialogImageUrl: "",
+ dialogVisible: false,
+ resReady: false,
+ rightSectionDisplay: true,
+ value: "",
+ compareTabs: ["esData"],
+ realSmallPath: [],
+ unrealSmallPath: [],
+ oneLine: true,
+ multiSelect: false
+ };
+ },
+ mounted() {
+ this.selectChange()
+ this.$nextTick(() => {
+ let scrollContain = this.$refs.rightSection
+ console.log("璧嬪�煎鍣細", scrollContain)
+ this.VideoPhotoData.scrollContainDom = scrollContain
+ })
+ },
+ methods: {
+ selectChange() {
+ if (!this.compareTabs.includes("esData") && this.compareTabs.length > 0) {
+ for (let i = 0; i < this.VideoPhotoData.tabsForUploadImg.length; i++) {
+ if (this.VideoPhotoData.tabsForUploadImg[i].title === "鎶撴媿搴�") {
+ this.VideoPhotoData.tabsForUploadImg[i].disabled = true;
+ }
+ }
+ this.$emit('labelDisabled', true)
+ return;
+ }
+ if (this.compareTabs.includes("esData")) {
+ for (let i = 0; i < this.VideoPhotoData.tabsForUploadImg.length; i++) {
+ if (this.VideoPhotoData.tabsForUploadImg[i].title !== "鎶撴媿搴�") {
+ this.VideoPhotoData.tabsForUploadImg[i].disabled = true;
+ }
+ }
+ this.$emit('labelDisabled', false)
+ } else {
+ for (let i = 0; i < this.VideoPhotoData.tabsForUploadImg.length; i++) {
+ this.VideoPhotoData.tabsForUploadImg[i].disabled = false;
+ }
+ }
+ },
+ selected(e, index) {
+ this.clickNum = index
+ },
+ async uploadImg(param) {
+ const fd = new FormData()
+ fd.append('file', param.file)
+ fd.append('picQuality', this.VideoPhotoData.threshold)
+ let res = await request({
+ method: 'post',
+ url: `/data/api-v/dbperson/faceExtract`,
+ data: fd
+ })
+ this.unrealSmallPath.length = 0
+ console.log("鍒囧浘杩斿洖锛�", res)
+ if (res.success) {
+ document.querySelector(".el-upload-list").querySelector("img").src = "/httpImage/" + res.data.uploadImage
+ this.resReady = true;
+ this.realSmallPath = res.data.smImage
+ this.VideoPhotoData.isHaveRealSmallImg = res.data.smImage.length > 0 ? true : false
+ if (res.data.smImage.length > 3) {
+ this.oneLine = false
+ } else {
+ this.oneLine = true
+ }
+ if (res.data.smImage.length % 3 !== 0) {
+ // 鐢ㄨ櫄鎷熶汉鍍忚ˉ鍏ㄦ暣琛�
+ const length = res.data.smImage.length % 3
+ console.log("鐪嬬湅length鐨勫��", length)
+ this.unrealSmallPath.length = 0
+ for (var i = 0; i < 3 - length; i++) {
+ this.unrealSmallPath.push(this.tempImg)
+ }
+ }
+ }
+ },
+ uploadSuccess(resp, file, fileList) {
+ this.$notify({
+ title: "鎴愬姛",
+ message: "鍥剧墖涓婁紶鎴愬姛锛�",
+ type: "success"
+ });
+ this.resReady = true;
+ console.log("鏂囦欢鍒楄〃锛�", file, fileList)
+ console.log("涓婁紶鐨勬枃浠讹細", this.bigPhoto)
+ },
+ beforeUpload() {
+ this.$refs.uploadIcon.parentNode.classList.add("s-display");
+ console.log("涓婁紶涔嬪墠鏂囦欢锛�", this.bigPhoto)
+ },
+ uploadError(err) {
+ this.$notify({
+ title: "澶辫触",
+ message: "鍥剧墖涓婁紶澶辫触锛�" + err.data,
+ type: "error"
+ });
+ console.log("涓婁紶澶辫触", err)
+ this.dialogImageUrl = "";
+ this.dialogVisible = false;
+ this.$refs.uploadIcon.parentNode.classList.remove("s-display");
+ },
+ toAdd(item) {
+ this.CardList.addBaseList.push(item)
+ },
+ removeImg() {
+ this.resReady = false;
+ this.$refs.uploadIcon.parentNode.classList.remove("s-display");
+ },
+ reUpload() {
+ this.displayUpload = true
+ this.$refs.upload.clearFiles();
+ // this.dialogImageUrl = "";
+ // this.dialogVisible = false;
+ this.resReady = false;
+ this.$refs.uploadIcon.parentNode.classList.remove("s-display");
+ },
+ searchStart() {
+ if (this.compareTabs.length == 0) {
+ this.$notify({
+ title: "璀﹀憡",
+ type: "warning",
+ message: "鎮ㄨ繕娌℃湁閫夋嫨瑕佹瘮瀵圭殑鐩爣搴�",
+ })
+ return
+ }
+ this.rightSectionDisplay = true;
+ this.VideoPhotoData.uploadType = true;
+ this.VideoPhotoData.picUrl = this.realSmallPath[this.clickNum]
+ this.VideoPhotoData.compareTabs = this.compareTabs
+ console.log("閫夌殑搴擄細", this.compareTabs)
+ this.VideoPhotoData.showType = "findByPic"
+ if (this.displayUpload) {
+ this.VideoPhotoData.findPerson()
+ } else {
+ this.VideoPhotoData.findPerson2()
+ }
+ },
+ getDetails(ev, index) {
+ this.CardList.datalist = this.VideoPhotoData.persons
+ let obj = this.CardList.datalist[index];
+ this.CardList.details = Array.from(
+ new Set([...this.CardList.details, ...[obj]])
+ );
+ this.VideoPhotoData.activeCard = obj.activeObject.id
+ }
+ }
+};
+</script>
+<style lang="scss">
+.s-upload-img {
+ width: 100%;
+ height: 100%;
+ box-sizing: border-box;
+ padding: 5px;
+ .upload-area {
+ width: 300px;
+ height: 100%;
+ //border: 1px solid #ccc;
+ box-sizing: border-box;
+ background: #fff;
+ padding: 15px;
+ // .el-upload-dragger {
+ // display:none!important
+ // }
+ .el-upload--picture-card {
+ width: 260px !important;
+ }
+ .el-upload-list--picture-card {
+ width: 260px !important;
+ .el-upload-list__item {
+ width: 260px !important;
+ img {
+ width: 260px;
+ height: 148px;
+ object-fit: contain;
+ }
+ }
+ }
+ .title {
+ text-align: left;
+ }
+ .compearValue {
+ text-align: left;
+ padding: 15px 0px;
+ }
+ }
+ .res-img-box {
+ width: 100%;
+ overflow: auto;
+ //height: 95px;
+ margin-top: 10px;
+ text-align: left;
+ .single-box {
+ //border: 1px solid #ccc;
+ width: 33%;
+ height: 90px;
+ padding: 5px;
+ box-sizing: border-box;
+ position: relative;
+ img {
+ object-fit: contain;
+ cursor: pointer;
+ border-radius: 3px;
+ }
+ .select {
+ position: absolute;
+ width: 20px;
+ height: 20px;
+ bottom: 5px;
+ right: 5px;
+ }
+ }
+ }
+}
+.s-display {
+ display: none !important;
+}
+
+.bigPhoto {
+ width: 148px;
+ height: 148px;
+ border-radius: 4px;
+}
+.el-upload-list__item {
+ transition: none !important;
+}
+.close:hover {
+ color: #3d68e1 !important;
+}
+</style>
diff --git a/src/components/searching/uploadDialog.vue b/src/components/searching/uploadDialog.vue
new file mode 100644
index 0000000..67ce475
--- /dev/null
+++ b/src/components/searching/uploadDialog.vue
@@ -0,0 +1,352 @@
+<template>
+ <span class="upload-content">
+ <slot></slot>
+ <div class="s-upload-img" v-show="isShowUpload">
+ <div class="left-section">
+ <h2 class="title">鏁版嵁婧�</h2>
+ <p class="compearValue">
+ <span
+ style="font-family: PingFangSC-Regular;font-size: 13px;color: #333333;letter-spacing: 0.28px;margin-right:10px"
+ >瀵规瘮闃堝��</span>
+ <el-input-number
+ size="mini"
+ v-model="picQuality"
+ controls-position="right"
+ :min="1"
+ :max="100"
+ ></el-input-number>
+ </p>
+
+ <div class="upload-img-box">
+ <el-upload
+ ref="upload"
+ :list-type="'picture-card'"
+ action
+ :http-request="uploadImg"
+ accept="image/*"
+ :limit="1"
+ :on-remove="removeImg"
+ :on-success="uploadSuccess"
+ :on-error="uploadError"
+ :before-upload="beforeUpload"
+ >
+ <i
+ ref="uploadIcon"
+ class="el-icon-upload"
+ style="color:#3D68E1;font-size:60px;position:relative;left:50px"
+ ></i>
+ <span
+ class="el-upload__text"
+ style="font-size:12px;color:#3D68E1;position:relative;top:25px;left:-30px"
+ >
+ <em>鐐瑰嚮閫夋嫨涓婁紶鍥剧墖</em>
+ </span>
+ </el-upload>
+ </div>
+ <div class="res-img-box" v-if="resReady" :style="oneLine? 'height:95px':'height:185px'">
+ <div class="single-box fl" v-for="(item, index) in realSmallPath" :key="index">
+ <img
+ :src="item
+ ? '/httpImage/'+item
+ : tempImg
+ "
+ @click="selected($event,index)"
+ style="max-height:100%"
+ :style="index == clickNum ? 'border:1px solid #FF7733':''"
+ />
+ <img class="select" v-show="index == clickNum" :src="selectedIcon" alt />
+ </div>
+ <div class="single-box fl" v-for="(item, index) in unrealSmallPath" :key="index+'t'">
+ <img
+ :src="item
+ ? item
+ : tempImg
+ "
+ />
+ </div>
+ </div>
+ <el-select
+ v-if="resReady"
+ v-model="compareTabs"
+ multiple
+ collapse-tags
+ @change="selectChange"
+ style="margin: 15px 0;width: 100%"
+ placeholder="璇烽�夋嫨"
+ >
+ <el-option
+ v-for="item in VideoPhotoData.tabsForUploadImg"
+ :key="item.key+'p'"
+ :label="item.title"
+ :disabled="item.disabled"
+ :value="item.key"
+ ></el-option>
+ </el-select>
+ <el-button-group v-if="resReady" style="margin-top:10px">
+ <el-button type="info" size="small" @click="reUpload">閲嶆柊涓婁紶</el-button>
+ <el-button type="primary" size="small" style="margin-left:10px" @click="searchStart">寮�濮嬫绱�</el-button>
+ </el-button-group>
+ </div>
+ </div>
+ <div class="upload-model" v-show="isShowUpload" @click="isShowUpload=false"></div>
+ </span>
+</template>
+
+<script>
+import request from "@/scripts/httpRequest"
+
+export default {
+ props: {
+
+ },
+ watch: {
+
+ },
+ computed: {
+ getResImg() {
+ let arr = this.realSmallPath;
+ // let str =
+ // "http://hbimg.b0.upaiyun.com/56ce44d4d6746ef6c88de4d241f76713fc67cf13b05b-ejL0af_fw658";
+ // let time = parseInt(Math.random() * 10);
+ // for (let i = 0; i < time; i++) {
+ // arr.push(str);
+ // }
+ if (arr.length <= 3) {
+ arr.length = 3;
+ } else if (arr.length <= 6) {
+ arr.length = 6;
+ } else if (arr.length <= 9) {
+ arr.length = 9;
+ }
+ return arr;
+ }
+ },
+ data() {
+ return {
+ tempUploadImg: "",
+ tempImg: require("../../assets/nobody.png"),
+ selectedIcon: require("../../assets/duihao.png"),
+ bigPhoto: [],
+ isShowUpload: false,
+ clickNum: 0,
+ picQuality: 60,
+ dialogImageUrl: "",
+ dialogVisible: false,
+ resReady: false,
+ rightSectionDisplay: false,
+ value: "",
+ compareTabs: ["esData"],
+ realSmallPath: [],
+ unrealSmallPath: [],
+ oneLine: true,
+ multiSelect: false
+ };
+ },
+ mounted() {
+ this.selectChange()
+ },
+ methods: {
+ selectChange() {
+ if (!this.compareTabs.includes("esData") && this.compareTabs.length > 0) {
+ for (let i = 0; i < this.VideoPhotoData.tabsForUploadImg.length; i++) {
+ if (this.VideoPhotoData.tabsForUploadImg[i].title === "鎶撴媿搴�") {
+ this.VideoPhotoData.tabsForUploadImg[i].disabled = true;
+ }
+ }
+ this.$emit('labelDisabled')
+ return;
+ }
+ if (this.compareTabs.includes("esData")) {
+ for (let i = 0; i < this.VideoPhotoData.tabsForUploadImg.length; i++) {
+ if (this.VideoPhotoData.tabsForUploadImg[i].title !== "鎶撴媿搴�") {
+ this.VideoPhotoData.tabsForUploadImg[i].disabled = true;
+ }
+ }
+ } else {
+ for (let i = 0; i < this.VideoPhotoData.tabsForUploadImg.length; i++) {
+ this.VideoPhotoData.tabsForUploadImg[i].disabled = false;
+ }
+ }
+ },
+ selected(e, index) {
+ console.log(index, '閫変腑浜嗙鍑犱釜', e)
+ this.clickNum = index
+ },
+ async uploadImg(param) {
+ const fd = new FormData()
+ fd.append('file', param.file)
+ fd.append('picQuality', this.picQuality)
+ console.log("1121231", fd)
+ let res = await request({
+ method: 'post',
+ url: `/data/api-v/dbperson/faceExtract`,
+ data: fd
+ })
+ this.unrealSmallPath.length = 0
+ console.log("鍒囧浘杩斿洖锛�", res)
+ if (res.success) {
+ document.querySelector(".el-upload-list").querySelector("img").src = "http://" + res.data.uploadImage
+ this.realSmallPath = res.data.smImage
+ if (res.data.smImage.length > 3) {
+ this.oneLine = false
+ } else {
+ this.oneLine = true
+ }
+ if (res.data.smImage.length % 3 !== 0) {
+ // 鐢ㄨ櫄鎷熶汉鍍忚ˉ鍏ㄦ暣琛�
+ const length = res.data.smImage.length % 3
+ console.log("鐪嬬湅length鐨勫��", length)
+ this.unrealSmallPath.length = 0
+ for (var i = 0; i < 3 - length; i++) {
+ this.unrealSmallPath.push(this.tempImg)
+ }
+ }
+ console.log('--------------锛�', param)
+ }
+ },
+ uploadSuccess(resp, file, fileList) {
+ this.$notify({
+ title: "鎴愬姛",
+ message: "鍥剧墖涓婁紶鎴愬姛锛�",
+ type: "success"
+ });
+ this.resReady = true;
+ console.log("鏂囦欢鍒楄〃锛�", file, fileList)
+ console.log("涓婁紶鐨勬枃浠讹細", this.bigPhoto)
+ },
+ beforeUpload() {
+ this.$refs.uploadIcon.parentNode.classList.add("s-display");
+ console.log("涓婁紶涔嬪墠鏂囦欢锛�", this.bigPhoto)
+ },
+ uploadError(err) {
+ this.$notify({
+ title: "澶辫触",
+ message: "鍥剧墖涓婁紶澶辫触锛�" + err,
+ type: "warning"
+ });
+ console.log("涓婁紶澶辫触", err)
+ this.dialogImageUrl = "";
+ this.dialogVisible = false;
+ this.$refs.uploadIcon.parentNode.classList.remove("s-display");
+ },
+ removeImg() {
+ this.resReady = false;
+ this.$refs.uploadIcon.parentNode.classList.remove("s-display");
+ },
+ reUpload() {
+ this.displayUpload = true
+ this.$refs.upload.clearFiles();
+ this.dialogImageUrl = "";
+ this.dialogVisible = false;
+ this.resReady = false;
+ this.$refs.uploadIcon.parentNode.classList.remove("s-display");
+ },
+ searchStart() {
+ this.rightSectionDisplay = true;
+ this.VideoPhotoData.picUrl = this.realSmallPath[this.clickNum]
+ this.VideoPhotoData.compareTabs = this.compareTabs
+ this.VideoPhotoData.showType = "findByPic"
+ this.VideoPhotoData.findPerson()
+ },
+ getDetails(ev, index) {
+ this.CardList.datalist = this.VideoPhotoData.persons
+ let obj = this.CardList.datalist[index];
+ this.CardList.details.push(obj);
+ this.VideoPhotoData.activeCard = obj.activeObject.id
+ }
+ }
+};
+</script>
+<style lang="scss">
+.s-upload-img {
+ width: 100%;
+ height: 100%;
+ box-sizing: border-box;
+ padding: 5px;
+ .left-section {
+ width: 300px;
+ height: 100%;
+ //border: 1px solid #ccc;
+ box-sizing: border-box;
+ background: #fff;
+ float: left;
+ margin-right: 15px;
+ padding: 15px;
+ // .el-upload-dragger {
+ // display:none!important
+ // }
+ .el-upload--picture-card {
+ width: 260px !important;
+ }
+ .el-upload-list--picture-card {
+ width: 260px !important;
+ .el-upload-list__item {
+ width: 260px !important;
+ img {
+ width: 260px;
+ height: 148px;
+ object-fit: contain;
+ }
+ }
+ }
+ .title {
+ text-align: left;
+ }
+ .compearValue {
+ text-align: left;
+ padding: 15px 0px;
+ }
+ }
+ .right-section {
+ width: calc(100% - 315px);
+ height: 100%;
+ float: left;
+ overflow: auto;
+ }
+ .res-img-box {
+ width: 100%;
+ overflow: auto;
+ //height: 95px;
+ margin-top: 10px;
+ text-align: left;
+ .single-box {
+ //border: 1px solid #ccc;
+ width: 33%;
+ height: 90px;
+ padding: 5px;
+ box-sizing: border-box;
+ position: relative;
+ img {
+ width: 100%;
+ cursor: pointer;
+ border-radius: 3px;
+ }
+ .select {
+ position: absolute;
+ width: 20px;
+ height: 20px;
+ bottom: 5px;
+ right: 5px;
+ }
+ }
+ }
+}
+.s-display {
+ display: none !important;
+}
+
+.bigPhoto {
+ width: 148px;
+ height: 148px;
+ border-radius: 4px;
+}
+.upload-model {
+ position: fixed;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ z-index: 99;
+ background: rgba(0, 0, 0, 0.2);
+}
+</style>
diff --git a/src/components/searching/uploadForModel.vue b/src/components/searching/uploadForModel.vue
new file mode 100644
index 0000000..dc764fa
--- /dev/null
+++ b/src/components/searching/uploadForModel.vue
@@ -0,0 +1,345 @@
+<template>
+ <div class="left-section1">
+ <div class="source">
+ <h2 class="title">鏁版嵁婧�</h2>
+ <div class="icon">
+ <i class="iconfont iconchushaixuanxiang" @click="closeUpload()"></i>
+ </div>
+ </div>
+ <p class="compearValue">
+ <span
+ style="font-family: PingFangSC-Regular;font-size: 13px;color: #333333;letter-spacing: 0.28px;margin-right:10px"
+ >瀵规瘮闃堝��</span>
+ <el-input-number
+ size="mini"
+ v-model="picQuality"
+ controls-position="right"
+ :min="1"
+ :max="100"
+ ></el-input-number>
+ </p>
+ <div class="upload-img-box">
+ <el-upload
+ ref="upload"
+ :list-type="'picture-card'"
+ action
+ :http-request="uploadImg"
+ accept="image/*"
+ :limit="1"
+ :on-remove="removeImg"
+ :on-success="uploadSuccess"
+ :on-error="uploadError"
+ :before-upload="beforeUpload"
+ >
+ <i
+ ref="uploadIcon"
+ class="el-icon-upload"
+ style="color:#3D68E1;font-size:60px;position:relative;left:50px"
+ ></i>
+ <span
+ class="el-upload__text"
+ style="font-size:12px;color:#3D68E1;position:relative;top:25px;left:-30px"
+ >
+ <em>鐐瑰嚮閫夋嫨涓婁紶鍥剧墖</em>
+ </span>
+ </el-upload>
+ </div>
+ <div class="res-img-box" v-if="resReady" :style="oneLine? 'height:95px':'height:185px'">
+ <div class="single-box fl" v-for="(item, index) in realSmallPath" :key="index">
+ <img
+ :src="item
+ ? '/httpImage/'+item
+ : tempImg
+ "
+ @click="selected($event,index)"
+ style="max-height:100%"
+ :style="index == clickNum ? 'border:1px solid #FF7733':''"
+ />
+ <img class="select" v-show="index == clickNum" :src="selectedIcon" alt />
+ </div>
+ <div class="single-box fl" v-for="(item, index) in unrealSmallPath" :key="index+'t'">
+ <img :src="item
+ ? item
+ : tempImg
+ " />
+ </div>
+ </div>
+ <el-button-group v-if="resReady" style="margin-top:10px">
+ <el-button type="info" size="small" @click="reUpload">閲嶆柊涓婁紶</el-button>
+ <el-button type="primary" size="small" style="margin-left:10px" @click="searchStart">寮�濮嬫绱�</el-button>
+ </el-button-group>
+ </div>
+</template>
+
+<script>
+import request from "@/scripts/httpRequest"
+import searchPhotoFromBase from "@/api/baseLibrary"
+export default {
+ watch: {
+ "VideoPhotoData.tabsForUploadImg": function (value) {
+ this.selectChange()
+ },
+ "VideoPhotoData.uploadImg": {
+ handler(val) {
+ // console.log('val:::', val)
+ if (val !== "") {
+ this.tempUploadImg = val
+ this.realSmallPath = [val]
+ this.unrealSmallPath = [this.tempImg, this.tempImg]
+ this.resReady = true
+ this.displayUpload = false
+ }
+ },
+ immediate: true,
+ deep: true
+ }
+ },
+ computed: {
+ getResImg() {
+ let arr = this.realSmallPath;
+ // let str =
+ // "http://hbimg.b0.upaiyun.com/56ce44d4d6746ef6c88de4d241f76713fc67cf13b05b-ejL0af_fw658";
+ // let time = parseInt(Math.random() * 10);
+ // for (let i = 0; i < time; i++) {
+ // arr.push(str);
+ // }
+ if (arr.length <= 3) {
+ arr.length = 3;
+ } else if (arr.length <= 6) {
+ arr.length = 6;
+ } else if (arr.length <= 9) {
+ arr.length = 9;
+ }
+ return arr;
+ }
+ },
+ data() {
+ return {
+ tempUploadImg: "",
+ tempImg: require("../../assets/nobody.png"),
+ selectedIcon: require("../../assets/duihao.png"),
+ bigPhoto: [],
+ displayUpload: true,
+ clickNum: 0,
+ picQuality: 60,
+ dialogImageUrl: "",
+ dialogVisible: false,
+ resReady: false,
+ value: "",
+ compareTabs: ["esData"],
+ realSmallPath: [],
+ unrealSmallPath: [],
+ oneLine: true,
+ multiSelect: false
+ };
+ },
+ mounted() {
+ this.selectChange()
+ },
+ methods: {
+ selectChange() {
+ if (!this.compareTabs.includes("esData") && this.compareTabs.length > 0) {
+ for (let i = 0; i < this.VideoPhotoData.tabsForUploadImg.length; i++) {
+ if (this.VideoPhotoData.tabsForUploadImg[i].title === "鎶撴媿搴�") {
+ this.VideoPhotoData.tabsForUploadImg[i].disabled = true;
+ }
+ }
+ this.$emit('labelDisabled', true)
+ return;
+ }
+ if (this.compareTabs.includes("esData")) {
+ for (let i = 0; i < this.VideoPhotoData.tabsForUploadImg.length; i++) {
+ if (this.VideoPhotoData.tabsForUploadImg[i].title !== "鎶撴媿搴�") {
+ this.VideoPhotoData.tabsForUploadImg[i].disabled = true;
+ }
+ }
+ this.$emit('labelDisabled', false)
+ } else {
+ for (let i = 0; i < this.VideoPhotoData.tabsForUploadImg.length; i++) {
+ this.VideoPhotoData.tabsForUploadImg[i].disabled = false;
+ }
+ }
+ },
+ selected(e, index) {
+ console.log(index, '閫変腑浜嗙鍑犱釜', e)
+ this.clickNum = index
+ },
+ async uploadImg(param) {
+ const fd = new FormData()
+ fd.append('file', param.file)
+ fd.append('picQuality', this.picQuality)
+ console.log("1121231", fd)
+ let res = await request({
+ method: 'post',
+ url: `/data/api-v/dbperson/faceExtract`,
+ data: fd
+ })
+ this.unrealSmallPath.length = 0
+ console.log("鍒囧浘杩斿洖锛�", res)
+ if (res.success) {
+ document.querySelector(".el-upload-list").querySelector("img").src = "/httpImage/" + res.data.uploadImage
+ this.realSmallPath = res.data.smImage
+ if (res.data.smImage.length > 3) {
+ this.oneLine = false
+ } else {
+ this.oneLine = true
+ }
+ if (res.data.smImage.length % 3 !== 0) {
+ // 鐢ㄨ櫄鎷熶汉鍍忚ˉ鍏ㄦ暣琛�
+ const length = res.data.smImage.length % 3
+ console.log("鐪嬬湅length鐨勫��", length)
+ this.unrealSmallPath.length = 0
+ for (var i = 0; i < 3 - length; i++) {
+ this.unrealSmallPath.push(this.tempImg)
+ }
+ }
+ console.log('--------------锛�', param)
+ }
+ },
+ uploadSuccess(resp, file, fileList) {
+ this.$notify({
+ title: "鎴愬姛",
+ message: "鍥剧墖涓婁紶鎴愬姛锛�",
+ type: "success"
+ });
+ this.resReady = true;
+ console.log("鏂囦欢鍒楄〃锛�", file, fileList)
+ console.log("涓婁紶鐨勬枃浠讹細", this.bigPhoto)
+ },
+ closeUpload() {
+ this.$emit("closeUpload")
+ },
+ beforeUpload() {
+ this.$refs.uploadIcon.parentNode.classList.add("s-display");
+ console.log("涓婁紶涔嬪墠鏂囦欢锛�", this.bigPhoto)
+ },
+ uploadError(err) {
+ this.$notify({
+ title: "澶辫触",
+ message: "鍥剧墖涓婁紶澶辫触锛�" + err,
+ type: "warning"
+ });
+ console.log("涓婁紶澶辫触", err)
+ this.dialogImageUrl = "";
+ this.dialogVisible = false;
+ this.$refs.uploadIcon.parentNode.classList.remove("s-display");
+ },
+ removeImg() {
+ this.resReady = false;
+ this.$refs.uploadIcon.parentNode.classList.remove("s-display");
+ },
+ reUpload() {
+ this.displayUpload = true
+ this.$refs.upload.clearFiles();
+ this.dialogImageUrl = "";
+ this.dialogVisible = false;
+ this.resReady = false;
+ this.$refs.uploadIcon.parentNode.classList.remove("s-display");
+ },
+ searchStart() {
+ this.BaseManageData.threshold = this.picQuality;
+ this.BaseManageData.picUrl = this.realSmallPath[this.clickNum]
+ this.BaseManageData.searchPhotoFromBase()
+ },
+ }
+};
+</script>
+<style lang="scss">
+.left-section1 {
+ width: 300px;
+ height: 100%;
+ //border: 1px solid #ccc;
+ box-sizing: border-box;
+ background: #fff;
+ //position: relative;
+ //left: -200px;
+ float: left;
+ margin-right: 15px;
+ padding: 15px;
+ // .el-upload-dragger {
+ // display:none!important
+ // }
+ .source {
+ position: relative;
+ .icon {
+ position: absolute;
+ top: 0px;
+ right: 0px;
+ cursor: pointer;
+ }
+ }
+ .el-upload--picture-card {
+ width: 260px !important;
+ }
+ .el-upload-list--picture-card {
+ width: 260px !important;
+ .el-upload-list__item {
+ width: 260px !important;
+ img {
+ width: 260px;
+ height: 148px;
+ object-fit: contain;
+ }
+ }
+ }
+ .title {
+ text-align: left;
+ }
+ .compearValue {
+ text-align: left;
+ padding: 15px 0px;
+ .el-input-number__decrease {
+ .el-icon-arrow-down {
+ font-size: 12px;
+ }
+ }
+ .el-input-number__increase {
+ .el-icon-arrow-up {
+ font-size: 12px;
+ }
+ }
+ }
+}
+.right-section {
+ width: calc(100% - 315px);
+ height: 100%;
+ float: left;
+ overflow: auto;
+}
+.res-img-box {
+ width: 100%;
+ overflow: auto;
+ //height: 95px;
+ margin-top: 10px;
+ text-align: left;
+ .single-box {
+ //border: 1px solid #ccc;
+ width: 33%;
+ height: 90px;
+ padding: 5px;
+ box-sizing: border-box;
+ position: relative;
+ img {
+ width: 100%;
+ cursor: pointer;
+ border-radius: 3px;
+ }
+ .select {
+ position: absolute;
+ width: 20px;
+ height: 20px;
+ bottom: 5px;
+ right: 5px;
+ }
+ }
+}
+.s-display {
+ display: none !important;
+}
+
+.bigPhoto {
+ width: 148px;
+ height: 148px;
+ border-radius: 4px;
+}
+</style>
diff --git a/src/pages/desktop/index/mock/userData.json b/src/pages/desktop/index/mock/userData.json
index 5e2e466..48afd61 100644
--- a/src/pages/desktop/index/mock/userData.json
+++ b/src/pages/desktop/index/mock/userData.json
@@ -72,7 +72,7 @@
"src": "../../images/app-mid/library.png",
"alt": "姣斿搴撶鐞�",
"type": "2",
- "url": "/view/gb28181",
+ "url": "/view/library",
"name": "姣斿搴撶鐞�"
},
{
diff --git a/src/pages/library/components/addBase.vue b/src/pages/library/components/addBase.vue
new file mode 100644
index 0000000..3b67b73
--- /dev/null
+++ b/src/pages/library/components/addBase.vue
@@ -0,0 +1,482 @@
+<template>
+ <div>
+ <el-form
+ ref="baseForm"
+ :model="form"
+ :rules="rules"
+ label-width="150px"
+ class="mt50"
+ label-position="left"
+ >
+ <el-row>
+ <el-col :span="10" :offset="1">
+ <el-form-item label="鍚嶇О" label-width="80px" style="width:100%" required prop="tableName">
+ <el-input size="small" v-model="form.tableName" placeholder="璇疯緭鍏�"></el-input>
+ </el-form-item>
+ </el-col>
+ <el-col :span="9" :offset="1">
+ <el-form-item label="瀵规帴鏁版嵁搴�" label-width="100px" :span="11">
+ <el-select
+ size="small"
+ v-model="form.cameraBrand"
+ disabled
+ placeholder="璇烽�夋嫨瀵规帴鏁版嵁搴�"
+ style="width:100%"
+ >
+ <el-option label="浜哄憳搴�" value="person"></el-option>
+ <el-option label="鍦ㄩ�冨簱" value="zaitao"></el-option>
+ <el-option label="鍚告瘨搴�" value="xidu"></el-option>
+ </el-select>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="10" :offset="1">
+ <el-form-item label="绫诲瀷" label-width="80px" style="width:100%" required prop="tableType">
+ <el-select size="small" v-model="form.tableType" placeholder="璇烽�夋嫨" style="width:100%">
+ <el-option label="浜哄憳搴�" value="person"></el-option>
+ <el-option label="杞﹁締" value="car"></el-option>
+ </el-select>
+ </el-form-item>
+ </el-col>
+ <el-col :span="9" :offset="1">
+ <el-form-item label="搴撳湴鍧�" label-width="100px" :span="11">
+ <el-input size="small" disabled placeholder="璇疯緭鍏�"></el-input>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="10" :offset="1">
+ <el-form-item
+ label="榛戠櫧鍚嶅崟"
+ label-width="80px"
+ style="width:100%;text-align:left"
+ required
+ prop="bwType"
+ >
+ <el-radio-group v-model="form.bwType" class>
+ <el-radio :label="`1`">榛戝悕鍗�</el-radio>
+ <el-radio :label="`0`">鐧藉悕鍗�</el-radio>
+ </el-radio-group>
+ </el-form-item>
+ </el-col>
+ <el-col :span="9" :offset="1">
+ <el-form-item label="鐢ㄦ埛鍚�" label-width="100px" :span="11">
+ <el-input size="small" v-model="form.userName" disabled placeholder="榛樿鍊�"></el-input>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="10" :offset="1" class="flex-box">
+ <el-form-item
+ label="鏈夋晥鏃堕棿"
+ label-width="80px"
+ style="width:100%"
+ required
+ prop="startTime"
+ >
+ <el-col :span="11" class="pick-time">
+ <el-date-picker
+ size="small"
+ type="datetime"
+ placeholder="閫夋嫨鏃ユ湡"
+ value-format="yyyy-MM-dd HH:mm:ss"
+ v-model="form.startTime"
+ :picker-options="pickerOptions"
+ style="width: 100%;"
+ ></el-date-picker>
+ <el-checkbox v-model="foreverChecked" @change="forever" class="check-css">姘镐箙鏈夋晥</el-checkbox>
+ <!-- <el-radio v-model="foreverChecked" label="1">澶囬�夐」</el-radio> -->
+ </el-col>
+ <el-col :span="2" class="text-center pick-time">
+ <span>鍒�</span>
+ </el-col>
+ <el-col :span="11">
+ <el-date-picker
+ size="small"
+ type="datetime"
+ placeholder="閫夋嫨鏃ユ湡"
+ :disabled="foreverChecked"
+ value-format="yyyy-MM-dd HH:mm:ss"
+ v-model="form.endTime"
+ :picker-options="pickerOptions"
+ style="width: 100%;"
+ ></el-date-picker>
+ </el-col>
+ </el-form-item>
+ </el-col>
+ <el-col :span="9" :offset="1">
+ <el-form-item label="瀵嗙爜" label-width="100px" :span="11">
+ <el-input size="small" v-model="form.pwd" disabled placeholder="榛樿鍊�"></el-input>
+ <input v-model="form.id" type="hidden" />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <!-- <el-row>
+ <el-col :span="7" :offset="1">
+ <el-form-item label="鏄惁鍚屾" label-width="80px" style="width:100%;text-align:left" required>
+ <el-radio-group v-model="form.isSync" class>
+ <el-radio label="1">鏄�</el-radio>
+ <el-radio label="0">鍚�</el-radio>
+ </el-radio-group>
+ </el-form-item>
+ </el-col>
+ </el-row> -->
+ <el-row>
+ <el-col :span="6" :offset="15">
+ <el-form-item style="margin-top:50px;text-align:right;" label-width="0px">
+ <el-button type="info" size="small" @click="onCancle">鍙栨秷</el-button>
+ <el-button type="primary" size="small" @click="onSubmit('baseForm')" class="save">淇濆瓨</el-button>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ </el-form>
+ </div>
+</template>
+<script>
+import { addBase, updateBase } from '@/api/baseLibrary'
+export default {
+ name: 'addBase',
+ data() {
+ const validatePass = (rule, value, callback) => {
+ if (this.form.startTime && this.form.startTime !== '') {
+ if (this.dateCompare(this.form.startTime, value) !== 1) {
+ callback(new Error('缁撴潫鏃堕棿涓嶈兘澶т簬寮�濮嬫椂闂达紒'))
+ } else {
+ callback()
+ }
+ }
+ }
+ return {
+ foreverChecked: false,
+ form: {
+ analyServerId: '',
+ tableName: '',
+ startTime: new Date(),
+ tableType: '',
+ isForever: '0',
+ id: '',
+ endTime: '',
+ bwType: '1',
+ enable: 0, // 1鐢熸晥锛�0鏈敓鏁�
+ isSync: '1', // 1涓哄悓姝ワ紝0涓烘湰鍦�
+ tableDesc: '' // 搴曞簱鎻忚堪
+ },
+ pickerOptions: {
+ disabledDate(time) {
+ return time.getTime() < Date.now() - 24 * 60 * 60 * 1000
+ }
+ },
+ rules: {
+ tableName: [
+ { required: true, message: '搴曞簱鍚嶇О涓嶈兘涓虹┖' }
+ ],
+ tableType: [
+ { required: true, message: '搴曞簱绫诲瀷涓嶈兘涓虹┖' }
+ ],
+ bwType: [
+ { required: true, message: '榛戠櫧鍚嶅崟蹇呴��' }
+ ],
+ startTime: [
+ { required: !this.foreverChecked, message: '璇烽�夋嫨璧峰鏃堕棿' }
+ ],
+ endTime: [
+ { validator: validatePass, trigger: 'change' }
+ ]
+ }
+ }
+ },
+ mounted() {
+ this.init()
+ },
+ watch: {
+ baseObject: function (newVal, oldVal) {
+ this.foreverChecked = false
+ this.form = newVal
+ console.log(this.form,'baseObject')
+ if (!newVal.endTime || newVal.endTime === undefined || newVal.endTime === null) {
+ this.form.isForever = '1'
+ this.foreverChecked = true
+ } else {
+ this.form.isForever = '0'
+ this.foreverChecked = false
+ }
+ },
+ 'form.endTime': function (newVal, oldVal) {
+ if (!newVal || newVal === null || newVal === undefined) {
+ this.form.isForever = '1'
+ this.foreverChecked = true
+ } else {
+ this.form.isForever = '0'
+ this.foreverChecked = false
+ if (this.form.startTime && this.form.startTime !== '') {
+ // console.log(this.form.startTime, newVal)
+
+ if (this.dateCompare(this.$moment(this.form.startTime).format('YYYY-MM-DD'), this.$moment(newVal).format('YYYY-MM-DD')) !== 1) {
+ this.$toast({
+ type: 'warning',
+ message: '缁撴潫鏃堕棿涓嶈兘灏忎簬寮�濮嬫椂闂达紒'
+ })
+ this.form.endTime = ''
+ }
+ }
+ }
+ },
+ 'form.startTime': function (newVal, oldVal) {
+ if (newVal) {
+ if (this.form.endTime && this.form.endTime !== '') {
+ if (this.dateCompare(this.$moment(this.form.endTime).format('YYYY-MM-DD'), this.$moment(newVal).format('YYYY-MM-DD')) === 1) {
+ this.$toast({
+ type: 'warning',
+ message: '缁撴潫鏃堕棿涓嶈兘灏忎簬寮�濮嬫椂闂达紒'
+ })
+ this.form.endTime = ''
+ }
+ }
+ }
+ }
+ },
+ methods: {
+ onSubmit(formName) {
+ console.log(this.form.id, 'submit')
+ if (this.form.id) {
+ // id涓嶄负绌猴紝淇敼搴曞簱
+ this.$refs[formName].validate(async (valid) => {
+ if (valid) {
+ // const { ...json } = this.form
+ let res = await updateBase({
+ analyServerId: this.form.analyServerId,
+ tableName: this.form.tableName,
+ startTime: this.$moment(this.form.startTime).format('YYYY-MM-DD HH:mm:ss'),
+ tableType: this.form.tableType,
+ isForever: this.foreverChecked ? '1':'0',
+ id: this.form.id,
+ endTime: this.form.endTime ? this.$moment(this.form.endTime).format('YYYY-MM-DD HH:mm:ss') : '',
+ bwType: this.form.bwType,
+ enable: this.form.enable,
+ tableDesc: this.form.tableDesc,
+ // isSync: this.form.isSync,
+ })
+ if (res.success === true) {
+ this.$notify({
+ title: "鎴愬姛",
+ message: "搴曞簱淇℃伅淇濆瓨鎴愬姛锛�",
+ type: "success"
+ });
+ this.$emit('refresh')
+ } else {
+ this.$notify({
+ title: "澶辫触",
+ message: "搴曞簱淇℃伅淇濆瓨澶辫触锛�",
+ type: "error"
+ });
+ }
+ }
+ })
+ } else {
+ // id涓虹┖锛屾柊澧炲簳搴�
+ this.$refs[formName].validate(async (valid) => {
+ if (valid) {
+ // const { ...json } = this.form
+ // console.log('鏂板鍙傛暟', json)
+ addBase({
+ tableName: this.form.tableName,
+ startTime: this.$moment(this.form.startTime).format('YYYY-MM-DD 00:00:00'),
+ tableType: this.form.tableType,
+ isForever: this.foreverChecked ? '1':'0',
+ id: this.form.id,
+ endTime: this.form.endTime ? this.$moment(this.form.endTime).format('YYYY-MM-DD 23:59:59') : '',
+ bwType: this.form.bwType,
+ enabled: this.form.enabled,
+ tableDesc: this.form.tableDesc,
+ analyServerId: this.type,
+ // isSync: this.form.isSync,
+ }).then((res) => {
+ this.$notify({
+ title: "鎴愬姛",
+ message: "搴曞簱淇℃伅淇濆瓨鎴愬姛锛�",
+ type: "success"
+ });
+ this.$emit('refresh')
+ }).catch((err) => {
+ this.$notify({
+ title: "澶辫触",
+ message: err.data,
+ type: "error"
+ });
+ })
+ }
+ })
+ }
+ },
+ onCancle(){
+ this.$emit('closeAdd')
+ },
+ forever(value) {
+ if (value) {
+ this.form.endTime = ''
+ }
+ },
+ init() {
+ console.log('娣诲姞搴曞簱琛ㄥ崟鏀跺埌鐨勬暟鎹�', this.baseObject, this.type)
+ if(Object.keys(this.baseObject).length > 3){
+ this.form = this.baseObject
+ if (!this.form.endTime) {
+ this.foreverChecked = true
+ } else {
+ this.foreverChecked = false
+ }
+ }else{
+ this.$refs.baseForm.resetFields()
+ }
+ },
+ dateParse(dateString) {
+ var SEPARATOR_BAR = '-'
+ var SEPARATOR_SLASH = '/'
+ var SEPARATOR_DOT = '.'
+ var dateArray
+ if (dateString.indexOf(SEPARATOR_BAR) > -1) {
+ dateArray = dateString.split(SEPARATOR_BAR)
+ } else if (dateString.indexOf(SEPARATOR_SLASH) > -1) {
+ dateArray = dateString.split(SEPARATOR_SLASH)
+ } else {
+ dateArray = dateString.split(SEPARATOR_DOT)
+ }
+ return new Date(dateArray[0], dateArray[1] - 1, dateArray[2])
+ },
+ isEmpty(str) {
+ if (!str || str === undefined || str === null) {
+ return true
+ } else {
+ return false
+ }
+ },
+ dateCompare(dateString, compareDateString) {
+ // dateString:褰撳墠鏃堕棿
+ // compareDateString:闇�瑕佹瘮杈冪殑鏃堕棿
+ if (this.isEmpty(dateString)) {
+ // alert('dateString涓嶈兘涓虹┖')
+ return
+ }
+ if (this.isEmpty(compareDateString)) {
+ // alert('compareDateString涓嶈兘涓虹┖')
+ return 1
+ }
+ var dateTime = this.dateParse(dateString).getTime()
+ var compareDateTime = this.dateParse(compareDateString).getTime()
+ if (compareDateTime > dateTime) {
+ return 1
+ } else if (compareDateTime === dateTime) {
+ return 0
+ } else {
+ return -1
+ }
+ }
+ },
+ props: {
+ baseObject: {
+ default: () => { },
+ type: Object
+ },
+ type: {
+ default: 'sync',
+ type: String
+ }
+ }
+}
+</script>
+<style lang="scss">
+.el-radio__inner {
+ border: 1px solid #dcdfe6;
+ border-radius: 100%;
+ width: 14px;
+ height: 14px;
+ background-color: #fff;
+ cursor: pointer;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+}
+.el-radio__input.is-checked .el-radio__inner {
+ border-color: #3d68e1;
+ background: #3d68e1;
+}
+.save {
+ background: #3d68e1;
+ border-radius: 2px;
+ outline: none;
+}
+.check-css {
+ position: relative;
+ left: -42px;
+ .el-checkbox__inner {
+ display: inline-block;
+ position: relative;
+ border: 1px solid #dcdfe6;
+ border-radius: 10px;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+ width: 14px;
+ height: 14px;
+ background-color: #fff;
+ z-index: 1;
+ -webkit-transition: border-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46),
+ background-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46);
+ transition: border-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46),
+ background-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46);
+ }
+ .el-checkbox__input.is-checked .el-checkbox__inner,
+ .el-checkbox__input.is-indeterminate .el-checkbox__inner {
+ background-color: #3d68e1;
+ border-color: #3d68e1;
+ }
+}
+
+.pick-time {
+ .el-input__inner {
+ -webkit-appearance: none;
+ background-color: #fff;
+ background-image: none;
+ border-radius: 4px;
+ border: 1px solid #dcdfe6;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+ color: #606266;
+ display: inline-block;
+ font-size: inherit;
+ height: 40px;
+ line-height: 40px;
+ outline: none;
+ padding: 0 0 0 15px;
+ -webkit-transition: border-color .2s cubic-bezier(.645,.045,.355,1);
+ transition: border-color .2s cubic-bezier(.645,.045,.355,1);
+ width: 100%;
+ }
+ .el-input--prefix .el-input__inner {
+ padding-left: 22px;
+ }
+ .el-input--suffix .el-input__inner {
+ padding-right: 0;
+ }
+ .el-input__prefix {
+ position: absolute;
+ height: 100%;
+ left: 0px;
+ top: 0;
+ text-align: center;
+ color: #C0C4CC;
+ -webkit-transition: all 0.3s;
+ transition: all 0.3s;
+ }
+ .el-input__suffix {
+ position: absolute;
+ height: 100%;
+ right: -2px;
+ top: 0;
+ text-align: center;
+ color: #C0C4CC;
+ -webkit-transition: all 0.3s;
+ transition: all 0.3s;
+ pointer-events: none;
+ }
+}
+</style>
diff --git a/src/pages/library/components/baseList.vue b/src/pages/library/components/baseList.vue
new file mode 100644
index 0000000..d714f17
--- /dev/null
+++ b/src/pages/library/components/baseList.vue
@@ -0,0 +1,406 @@
+<template>
+ <div :style="listWidth?`width:${listWidth};`:''" class="out-div el-menu-vertical-demo">
+ <el-collapse v-model="activeNames">
+ <el-collapse-item name="1" class="el-collapse-item__wrap">
+ <template slot="title">
+ <span
+ :class="title==='鍚屾搴�'?'iconfont iconshuaxintongbu':'iconfont iconwenjianjia'"
+ style="font-size:18px;"
+ ></span>
+ <span class="ml5 f14">{{title}}</span>
+ <i
+ class="el-icon-circle-plus-outline ml10"
+ style="font-size:20px;color:#3D68E1;"
+ @click.stop="add('sync')"
+ v-if="isShow('videoTable:edit')"
+ ></i>
+ <span
+ class="ml5"
+ style="font-size:14px;color:#3D68E1;"
+ @click.stop="add('sync')"
+ v-if="isShow('videoTable:edit')"
+ >鏂板</span>
+ </template>
+ <div class="max-height">
+ <el-row
+ class="p10 cursor-pointer"
+ v-for="(item, index) in data"
+ :key="item.id"
+ @click.native="clickCategory(index, 'sync' ,item)"
+ :class="{activeRow:categoryIndex=='sync' + index}"
+ >
+ <el-col :span="12" :class="item.bwType === '1'?'c-red':'c-green'">
+ <p
+ style="text-align:left;margin-left:10px"
+ class="name-ellipsis"
+ :title="item.tableName"
+ >{{item.tableName}}</p>
+ </el-col>
+ <el-col :span="10" :offset="1">
+ <el-switch
+ :active-value="1"
+ :inactive-value="0"
+ v-model="item.enable"
+ size="small"
+ style="margin-top:-7px"
+ :disabled="isDisabled(item)"
+ @change="enable(item)"
+ >
+ <!-- :disabled="isDisa(item)" -->
+ </el-switch>
+ <el-tooltip content="缂栬緫" placement="top" popper-class="atooltip">
+ <span
+ class="iconfont iconbianji iconStyle1"
+ @click.stop="edit(item,'sync')"
+ v-if="isShow('videoTable:edit')"
+ ></span>
+ </el-tooltip>
+ <el-tooltip content="鍒犻櫎" placement="top" popper-class="atooltip">
+ <span
+ class="iconfont iconshanchu iconStyle1"
+ style="color:#E74C3C;"
+ v-if="isShow('videoTable:edit')"
+ @click.stop="deleteBase(item.id)"
+ ></span>
+ </el-tooltip>
+ </el-col>
+ <el-col
+ :span="24"
+ class="tl ml10 f12"
+ style="color:#888888"
+ >{{item.startTime}}~{{item.endTime?item.endTime:'姘镐箙鏈夋晥'}}</el-col>
+ </el-row>
+ </div>
+ </el-collapse-item>
+ <el-collapse-item name="2" class="el-collapse-item__wrap">
+ <template slot="title">
+ <span class="iconfont iconwenjianjia" style="font-size:18px;"></span>
+ <span class="ml5 f14">{{titleB}}</span>
+ <i
+ class="el-icon-circle-plus-outline ml10"
+ style="font-size:20px;color:#3D68E1;"
+ @click.stop="add('local')"
+ v-if="isShow('videoTable:edit')"
+ ></i>
+ <span
+ class="ml5"
+ style="font-size:14px;color:#3D68E1;"
+ @click.stop="add('local')"
+ v-if="isShow('videoTable:edit')"
+ >鏂板</span>
+ </template>
+ <div class="max-height">
+ <el-row
+ class="p10 cursor-pointer"
+ v-for="(item, index) in dataB"
+ :key="item.id"
+ @click.native="clickCategory(index, 'local' ,item)"
+ :class="{activeRow:categoryIndex=='local' + index}"
+ >
+ <el-col :span="12" :class="item.bwType === '1'?'c-red':'c-green'">
+ <p
+ style="text-align:left;margin-left:10px"
+ class="name-ellipsis"
+ :title="item.tableName"
+ >{{item.tableName}}</p>
+ </el-col>
+ <el-col :span="10" :offset="1">
+ <el-switch
+ :active-value="1"
+ :inactive-value="0"
+ v-model="item.enable"
+ size="small"
+ style="margin-top:-7px"
+ :disabled="isDisabled(item)"
+ @change="enable(item)"
+ ></el-switch>
+ <el-tooltip content="缂栬緫" placement="top" popper-class="atooltip">
+ <span
+ class="iconfont iconbianji iconStyle1"
+ @click.stop="edit(item,'local')"
+ v-if="isShow('videoTable:edit')"
+ ></span>
+ </el-tooltip>
+ <el-tooltip content="鍒犻櫎" placement="top" popper-class="atooltip">
+ <span
+ class="iconfont iconshanchu iconStyle1"
+ style="color:#E74C3C;"
+ v-if="isShow('videoTable:edit')"
+ @click.stop="deleteBase(item.id)"
+ ></span>
+ </el-tooltip>
+ </el-col>
+ <el-col
+ :span="24"
+ class="tl ml10 f12"
+ style="color:#888888"
+ >{{item.startTime}}~{{item.endTime?item.endTime:'姘镐箙鏈夋晥'}}</el-col>
+ </el-row>
+ </div>
+ </el-collapse-item>
+ </el-collapse>
+ </div>
+</template>
+<script>
+// const data = [{ name: '鍚告瘨搴�', id: '1', time: '2019-01-01 12:00:00 ~ 2019-01-04 12:00:00' },
+// { name: '鍦ㄩ�冨簱', id: '2', time: '2019-01-01 12:00:00 ~ 2019-01-04 12:00:00' }, { name: '鍚告瘨搴�', id: '3', time: '2019-01-01 12:00:00 ~ 2019-01-04 12:00:00' },
+// { name: '鍦ㄩ�冨簱', id: '4', time: '2019-01-01 12:00:00 ~ 2019-01-04 12:00:00' }]
+import { updateDbTableStatus } from '@/api/baseLibrary'
+export default {
+ name: 'baseList',
+ data() {
+ return {
+ buttonAuthority: sessionStorage.getItem('buttonAuthoritys') || [],
+ activeNames: ['1', '2'],
+ categoryIndex: '',
+ data: [],
+ dataB: [],
+ clickBase: {} // 褰撳墠鐐瑰嚮鐨勫簳搴撳璞�
+ }
+ },
+ computed: {
+ // eslint-disable-next-line vue/return-in-computed-property
+ isAdmin() {
+ if (
+ sessionStorage.getItem('userInfo') &&
+ sessionStorage.getItem('userInfo') !== ''
+ ) {
+ let loginName = JSON.parse(sessionStorage.getItem('userInfo')).username
+ return (
+ loginName === 'superadmin' || loginName === 'basic'
+ )
+ }
+ return false;
+ }
+ },
+ mounted() {
+ this.init()
+ },
+ methods: {
+ isShow(authority) {
+ if (this.isAdmin) {
+ return true
+ } else if (
+ this.buttonAuthority.indexOf(',' + authority + ',') > -1
+ ) {
+ return true
+ } else {
+ return false
+ }
+ },
+ async init() {
+ // console.log("鎵ц浜唅nit娌�")
+ await this.BaseManageData.querySyncTables()
+ this.data = this.BaseManageData.syncTables
+ this.defaultShow()
+ await this.BaseManageData.queryLocalTables()
+ this.dataB = this.BaseManageData.localTables
+ this.defaultShow()
+ },
+ handleChange(val) {
+ console.log(val)
+ },
+ async enable(item) {
+ let res = await updateDbTableStatus({
+ id: item.id,
+ enable: item.enable
+ })
+ if (res.success === true) {
+ this.$notify({
+ type: 'success',
+ message: '搴曞簱鎴愬姛鍙樻洿鐢熸晥鐘舵�侊紒'
+ })
+ } else {
+ this.$notify({
+ type: 'error',
+ message: '搴曞簱鍙樻洿鐢熸晥鐘舵�佸け璐ワ紒'
+ })
+ }
+ },
+ add(type) {
+ this.$emit('changeShow', null, type)
+ },
+ isDisabled(item) {
+ var flag = true
+ if (this.isShow('videoTable:edit')) {
+ if (item.endTime == "") {
+ flag = false
+ } else {
+ flag = !this.$moment(new Date()).isBetween(item.startTime, item.endTime)
+ }
+ }
+ return flag
+ },
+ clickCategory(index, type, item) { // 杩欓噷鎴戜滑浼犲叆涓�涓綋鍓嶅��
+ this.categoryIndex = type + index
+ // 璋冪敤鍒囨崲鍙充晶闈㈡澘鐨勫嚱鏁板苟涓斿垏鎹㈢埗缁勪欢涓璱sSelected鐨勫�艰鍙︿竴涓粍浠舵竻闄よ閫変腑鐘舵��
+ // this.$emit('clearSelected')
+ this.clickBase = item
+ this.$emit('getList', item)
+ },
+ edit(item, type) {
+ this.$emit('changeShow', item, type)
+ },
+ deleteBase(id) {
+ let token = sessionStorage.getItem('loginedInfo') && JSON.parse(sessionStorage.getItem('loginedInfo')).access_token
+ this.$confirm('鎻愮ず锛氱‘瀹氬垹闄ゅ簳搴擄紵', {
+ center: true,
+ cancelButtonClass: 'comfirm-class-cancle',
+ confirmButtonClass: 'comfirm-class-sure'
+ }).then(() => {
+ fetch(`/data/api-v/dbtable/deleteDBtablesById/${id}`, {
+ method: 'POST',
+ headers: {
+ 'Content-Type': 'application/json',
+ 'Authorization': token
+ }
+ }).then(res => {
+ return res.json()
+ }).then(data => {
+ console.log(data.data)
+ if (data.success) {
+ this.$notify({
+ type: 'success',
+ message: '搴曞簱鍒犻櫎鎴愬姛锛�'
+ })
+ }
+ this.init()
+ }).catch(err => {
+ this.$notify({
+ type: 'error',
+ message: err
+ })
+ })
+ })
+ },
+ // 榛樿鏄剧ず绗竴涓簱鐨勬暟鎹�
+ defaultShow() {
+ // console.log(this.data.length,'defaultShow')
+ if (this.data !== undefined && this.data.length > 0) {
+ this.clickCategory(0, 'sync', this.data[0])
+ } else {
+ if (this.dataB !== undefined && this.dataB.length > 0) {
+ this.clickCategory(0, 'local', this.data[0])
+ }
+ }
+ },
+ // 娣诲姞鏃堕棿姣旇緝鍑芥暟
+ dateParse(dateString) {
+ var SEPARATOR_BAR = '-'
+ var SEPARATOR_SLASH = '/'
+ var SEPARATOR_DOT = '.'
+ var dateArray
+ if (dateString.indexOf(SEPARATOR_BAR) > -1) {
+ dateArray = dateString.split(SEPARATOR_BAR)
+ } else if (dateString.indexOf(SEPARATOR_SLASH) > -1) {
+ dateArray = dateString.split(SEPARATOR_SLASH)
+ } else {
+ dateArray = dateString.split(SEPARATOR_DOT)
+ }
+ return new Date(dateArray[0], dateArray[1] - 1, dateArray[2])
+ },
+ isEmpty(str) {
+ if (!str || str === undefined || str === null) {
+ return true
+ } else {
+ return false
+ }
+ },
+ dateCompare(dateString, compareDateString) {
+ // dateString:褰撳墠鏃堕棿
+ // compareDateString:闇�瑕佹瘮杈冪殑鏃堕棿
+ if (this.isEmpty(dateString)) {
+ // alert('dateString涓嶈兘涓虹┖')
+ return
+ }
+ if (this.isEmpty(compareDateString)) {
+ // alert('compareDateString涓嶈兘涓虹┖')
+ return 1
+ }
+ var dateTime = this.dateParse(dateString).getTime()
+ var compareDateTime = this.dateParse(compareDateString).getTime()
+ if (compareDateTime > dateTime) {
+ return 1
+ } else if (compareDateTime === dateTime) {
+ return 0
+ } else {
+ return -1
+ }
+ },
+ // 宸︿晶搴曞簱鐢熸晥寮�鍏虫槸鍚﹀惎鐢ㄥ垽鏂�
+ // isDisa(data) {
+ // if (!this.isShow('videoTable:edit')) {
+ // return true
+ // } else {
+ // return false
+ // }
+ // }
+ },
+ props: {
+ listWidth: {
+ default: '300px',
+ type: String
+ },
+ title: {
+ default: '鍚屾搴�',
+ type: String
+ },
+ titleB: {
+ default: '鏈湴搴�',
+ type: String
+ },
+ isSelected: {
+ default: false,
+ type: Boolean
+ },
+ type: {
+ default: '',
+ type: String
+ }
+ }
+}
+</script>
+<style lang="scss">
+.iconStyle1 {
+ font-size: 18px;
+ margin-left: 15px;
+ cursor: pointer;
+}
+.activeRow {
+ background: rgb(245, 247, 250);
+}
+.cursor-pointer {
+ cursor: pointer;
+}
+.max-height {
+ max-height: 350px;
+}
+.c-red {
+ color: red;
+ font-size: 14px;
+}
+.c-green {
+ color: #222222 100%;
+ font-size: 14px;
+}
+.out-div {
+ overflow: hidden auto;
+ max-height: 100%;
+ // max-height: 890px;
+ .el-collapse-item__wrap {
+ will-change: height;
+ background-color: #fff;
+ overflow: hidden;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+ border-bottom: 0px solid #ebeef5;
+ }
+}
+.name-ellipsis {
+ max-width: 160px;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ margin: 0 auto;
+}
+</style>
diff --git a/src/pages/library/components/carList.vue b/src/pages/library/components/carList.vue
new file mode 100644
index 0000000..9e03c14
--- /dev/null
+++ b/src/pages/library/components/carList.vue
@@ -0,0 +1,1528 @@
+<template>
+ <div class="table-parent">
+ <el-row class style="margin:20px">
+ <!-- <el-col :span="4" class="tl">
+ <b class="f14">{{this.baseObject.tableName}}</b>
+ </el-col>
+ <el-col :span="2">
+ <b class="f14">{{this.baseObject.bwType === '1'?'榛戝悕鍗�':'鐧藉悕鍗�'}}</b>
+ </el-col>
+ <el-col :span="8">
+ <b class="f14">鏈夋晥鏃堕棿锛歿{this.baseObject.startTime}}--{{this.baseObject.endTime?this.baseObject.endTime:'姘镐箙鏈夋晥'}}</b>
+ </el-col>-->
+ <div class="tl">
+ <span
+ class="f14"
+ style="color:#000000;"
+ >{{this.baseObject.tableName?this.baseObject.tableName + '/ ':''}}</span>
+ <span
+ class="f14"
+ style="color:#000000;"
+ >{{this.baseObject.bwType === '1'?'榛戝悕鍗�/ ':'鐧藉悕鍗�/ '}}</span>
+ <span
+ class="f14"
+ style="color:#000000;"
+ >鏈夋晥鏃堕棿锛歿{this.baseObject.startTime}}--{{this.baseObject.endTime?this.baseObject.endTime:'姘镐箙鏈夋晥'}}</span>
+ </div>
+ </el-row>
+ <el-row class style="margin:40px 0 40px 20px">
+ <el-col :span="6">
+ <el-input
+ placeholder="濮撳悕/鎬у埆/韬唤璇佸彿/鎵嬫満鍙�"
+ autocomplete="off"
+ width="100%"
+ size="small"
+ v-model="BaseManageData.contentValue"
+ @keyup.enter.native="handleSearch"
+ ></el-input>
+ </el-col>
+ <el-col :span="2">
+ <el-button size="small" type="primary" @click="handleSearch">鎼滅储</el-button>
+ </el-col>
+ <el-col :offset="8" :span="3">
+ <fTemplate authority="videoTable:edit">
+ <el-button
+ size="small"
+ class="ml10"
+ type="danger"
+ @click="deleteBatch"
+ v-if="isShow('videoTable:edit')"
+ >鎵归噺鍒犻櫎</el-button>
+ </fTemplate>
+ </el-col>
+ <el-col :span="2">
+ <div class="text-left">
+ <el-button size="small" class="ml10" type="primary" @click="addCar">娣诲姞杞﹁締</el-button>
+ <el-drawer
+ title="杞﹁締淇℃伅"
+ :modal="false"
+ :destroy-on-close="true"
+ :append-to-body="true"
+ :visible.sync="addDrawer"
+ :direction="direction"
+ :before-close="handleClose1"
+ >
+ <div class="drawerSpace">
+ <div class="uploadLine">
+ <div class="car-picture">
+ <el-upload
+ action
+ :http-request="uploadCar"
+ accept="image/*"
+ list-type="picture-card"
+ :file-list="form.carUrls"
+ :before-remove="handleRemoveCarPic"
+ >
+ <i class="el-icon-plus" style="margin-top:25px"></i>
+ <div>涓婁紶杞﹁締鐓х墖</div>
+ </el-upload>
+ </div>
+ <div class="person-picture">
+ <el-upload
+ action
+ :http-request="uploadPerson"
+ list-type="picture-card"
+ accept="image/*"
+ :limit="1"
+ :file-list="form.faceUrl"
+ :on-remove="handleRemoveFacePic"
+ >
+ <i class="el-icon-plus" style="margin-top:25px"></i>
+ <div>涓婁紶杞︿富鐓х墖</div>
+ </el-upload>
+ </div>
+ </div>
+ <el-form
+ ref="formForCar"
+ :model="form"
+ label-width="100px"
+ style="margin-top:20px;margin-bottom: 50px"
+ :rule="rules"
+ >
+ <el-form-item label="*杞︾墝鍙凤細">
+ <el-input placeholder="璇疯緭鍏ヨ溅鐗屽彿" v-model="form.carNo" class="inputWidth"></el-input>
+ </el-form-item>
+ <el-form-item label="杞﹁締绫诲瀷锛�">
+ <el-select v-model="form.carType" placeholder="璇烽�夋嫨杞﹁締绫诲瀷" class="inputWidth">
+ <el-option
+ v-for="item in VideoPhotoData.dictionary.CARTYPE"
+ :key="item.value"
+ :label="item.name"
+ :value="item.value"
+ ></el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item label="杞﹁締鍝佺墝锛�">
+ <el-select v-model="form.carBrand" placeholder="璇烽�夋嫨杞﹁締鍝佺墝" class="inputWidth">
+ <el-option
+ v-for="item in VideoPhotoData.dictionary.BRAND"
+ :key="item.value"
+ :label="item.name"
+ :value="item.value"
+ ></el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item label="杞﹁韩棰滆壊锛�">
+ <el-select v-model="form.carColor" placeholder="璇烽�夋嫨杞﹁韩棰滆壊" class="inputWidth">
+ <el-option
+ v-for="item in VideoPhotoData.dictionary.nColor"
+ :key="item.value"
+ :label="item.name"
+ :value="item.value"
+ ></el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item label="杞︿富濮撳悕锛�">
+ <el-input v-model="form.personName" class="inputWidth"></el-input>
+ </el-form-item>
+ <el-form-item label="杞︿富鎬у埆锛�">
+ <el-radio-group v-model="form.sex">
+ <el-radio label="鐢�"></el-radio>
+ <el-radio label="濂�"></el-radio>
+ </el-radio-group>
+ </el-form-item>
+ <el-form-item label="韬唤璇佸彿锛�">
+ <el-input v-model="form.idCard" class="inputWidth"></el-input>
+ </el-form-item>
+ <el-form-item label="鎵嬫満鍙凤細">
+ <el-input v-model="form.phoneNum" class="inputWidth"></el-input>
+ </el-form-item>
+ <el-form-item label="鍏朵粬锛�">
+ <el-input v-model="form.reserved" class="inputWidth"></el-input>
+ </el-form-item>
+ <el-form-item style="text-align:tight">
+ <el-button type="primary" @click="submitCar" style="margin-left:120px">淇濆瓨</el-button>
+ <el-button @click="resetForm">鍙栨秷</el-button>
+ </el-form-item>
+ </el-form>
+ </div>
+ </el-drawer>
+ </div>
+ </el-col>
+ <el-col :span="3">
+ <div class="text-left">
+ <el-button size="small" class="ml10" type="primary" @click="addBatch">鎵归噺涓婁紶杞︾墝</el-button>
+ <el-drawer
+ title="涓婁紶杞︾墝"
+ :modal="false"
+ :append-to-body="true"
+ :visible.sync="addBatchDrawer"
+ :direction="direction"
+ :before-close="handleClose2"
+ >
+ <div class="drawerSpace">
+ <div class="plateAttach">
+ <el-input
+ type="textarea"
+ :rows="25"
+ v-model="plates"
+ style="width:90%"
+ placeholder="璇疯緭鍏ヨ溅鐗屽彿"
+ ></el-input>
+ <p>杞︾墝鍙蜂互閫楀彿鎴栧洖杞﹂敭闅斿紑锛屽崟娆℃渶澶氭敮鎸�100鏉′笂浼狅紝渚嬪锛氫含YAB123,浜現34Y87</p>
+ <el-button type="primary" @click="platesBatch" style="margin-left:210px">淇濆瓨</el-button>
+ <el-button @click="resetForm('ruleForm')">鍙栨秷</el-button>
+ </div>
+ </div>
+ </el-drawer>
+ </div>
+ </el-col>
+ </el-row>
+ <div style="display:flex;" class="border-tabl ml20">
+ <el-table
+ id="multipleTable"
+ ref="multipleTable"
+ :data="BaseManageData.personList"
+ tooltip-effect="dark"
+ style="width: 100%;"
+ :fit="true"
+ :max-height="tableHeight"
+ :default-sort="{prop: 'createTime', order: 'descending'}"
+ @selection-change="handleSelectionChange"
+ :header-cell-style="{background:'#f8f8f8',color:'#222222'}"
+ >
+ <el-table-column type="selection" width="30"></el-table-column>
+ <el-table-column label="搴忓彿" width="70" sortable align="center">
+ <template slot-scope="scope">{{scope.$index+1}}</template>
+ </el-table-column>
+ <el-table-column prop="carNo" label="杞︾墝鍙�" sortable align="center" width="120"></el-table-column>
+ <el-table-column
+ prop="carType"
+ label="杞﹁締绫诲瀷"
+ width="100"
+ show-overflow-tooltip
+ sortable
+ align="center"
+ ></el-table-column>
+ <el-table-column prop="carBrand" label="杞﹁締鍝佺墝" min-width="100" sortable align="center"></el-table-column>
+ <el-table-column
+ prop="carColor"
+ label="杞﹁韩棰滆壊"
+ width="100"
+ show-overflow-tooltip
+ sortable
+ align="center"
+ >
+ <template
+ slot-scope="scope"
+ >{{getDataName(VideoPhotoData.dictionary.nColor,scope.row.carColor)}}</template>
+ </el-table-column>
+ <el-table-column
+ prop="personName"
+ label="杞︿富濮撳悕"
+ min-width="110"
+ show-overflow-tooltip
+ sortable
+ align="center"
+ ></el-table-column>
+ <el-table-column prop="sex" label="杞︿富鎬у埆" align="center" width="80"></el-table-column>
+ <el-table-column
+ prop="carUrls"
+ label="杞﹁締鐓х墖"
+ width="140"
+ show-overflow-tooltip
+ sortable
+ class="picture"
+ align="center"
+ >
+ <template slot-scope="scope">
+ <el-carousel
+ style="height:100px;"
+ :autoplay="false"
+ indicator-position="none"
+ :arrow="scope.row.carUrls.length > 1 ? 'always' : 'never'"
+ >
+ <el-carousel-item v-for="(item, index) in scope.row.carUrls" :key="index">
+ <img style="width:100px;height:100px;object-fit:contain;" :src="item.url" alt />
+ </el-carousel-item>
+ </el-carousel>
+ </template>
+ </el-table-column>
+ <el-table-column
+ prop="createTime"
+ label="鍏ュ簱鏃堕棿"
+ width="140"
+ show-overflow-tooltip
+ sortable
+ align="center"
+ ></el-table-column>
+ <!-- <el-table-column prop="reserved" label="鍏朵粬" align="center"></el-table-column> -->
+ <el-table-column label="鐢熸晥鐘舵��" align="center" width="80">
+ <template slot-scope="scope">
+ <el-switch
+ v-model="scope.row.enable"
+ :active-value="1"
+ :disabled="!isShow('videoTable:edit')"
+ :inactive-value="0"
+ @change="enable(scope.row)"
+ ></el-switch>
+ </template>
+ </el-table-column>
+ <el-table-column label="鎿嶄綔" min-width="200" align="center">
+ <template slot-scope="scope">
+ <fTemplate authority="videoTable:edit">
+ <el-tooltip content="缂栬緫" placement="top" popper-class="atooltip">
+ <span
+ class="iconfont iconbianji iconStyle1"
+ style="font-size:15px;"
+ @click="handleClick(scope.row)"
+ ></span>
+ </el-tooltip>
+ </fTemplate>
+ <el-tooltip content="鏌ユ壘姝や汉" placement="top" popper-class="atooltip">
+ <span class="iconfont iconsousuoren iconStyle1" @click="tosearch(scope.row)"></span>
+ </el-tooltip>
+ <fTemplate authority="videoTable:edit">
+ <el-tooltip content="澶嶅埗" placement="top" popper-class="atooltip">
+ <span
+ class="iconfont iconfuzhi iconStyle1"
+ title="澶嶅埗"
+ @click="copyClick(scope.row)"
+ ></span>
+ </el-tooltip>
+ </fTemplate>
+ <fTemplate authority="videoTable:edit">
+ <el-tooltip content="绉诲姩" placement="top" popper-class="atooltip">
+ <span
+ class="iconfont iconyidongzhi iconStyle1"
+ style="font-size:15px;"
+ title="绉诲姩"
+ @click="moveClick(scope.row)"
+ ></span>
+ </el-tooltip>
+ </fTemplate>
+ <fTemplate authority="videoTable:edit">
+ <el-tooltip content="鍒犻櫎" placement="top" popper-class="atooltip">
+ <span
+ class="iconfont iconshanchu iconStyle1"
+ style="color:#E74C3C;"
+ @click="deleteThis(scope.row.id)"
+ title="鍒犻櫎"
+ ></span>
+ </el-tooltip>
+ </fTemplate>
+ </template>
+ </el-table-column>
+ </el-table>
+ </div>
+ <div class="pt5 pb20" style="height:40px;position:relative">
+ <el-pagination
+ @current-change="refrash"
+ :current-page="BaseManageData.page"
+ :page-size="BaseManageData.size"
+ style="position:absolute;right:10px;bottom:5px"
+ :total="BaseManageData.total"
+ ></el-pagination>
+ </div>
+ <el-dialog
+ title="鎻愮ず"
+ :visible.sync="dialogVisible"
+ :append-to-body="true"
+ :close="getCarList"
+ width="30%"
+ >
+ <div>
+ <div class="tl">
+ <span>涓婁紶鎴愬姛鐨勬暟閲忥細{{uploadResult.successList.length}}</span>
+ </div>
+ <div class="flex-box mt10">
+ <span>涓婁紶澶辫触鐨勬暟閲忥細{{uploadResult.failList.length}}</span>
+ <div class="ml20" v-for="(i,index) in uploadResult.failList" :key="index">{{i}}</div>
+ </div>
+ <div class="flex-box mt10">
+ <span>鍖呭惈澶氬紶浜鸿劯鐨勫浘鐗囨暟閲忥細{{uploadResult.multiFaceList.length}}</span>
+ <div class="ml20" v-for="(i,index) in uploadResult.multiFaceList" :key="index">{{i}}</div>
+ </div>
+ <div class="flex-box mt10">
+ <span>涓嶅惈浜鸿劯鐨勫浘鐗囨暟閲忥細{{uploadResult.noFaceList.length}}</span>
+ <div class="ml20" v-for="(i,index) in uploadResult.noFaceList" :key="index">{{i}}</div>
+ </div>
+ </div>
+ </el-dialog>
+
+ <el-dialog
+ title="澶嶅埗鍒�"
+ :visible.sync="copyVisiabled"
+ :append-to-body="true"
+ okText="淇濆瓨"
+ width="35%"
+ class="copy"
+ cancelText="鍙栨秷"
+ >
+ <div class="addToBase1">
+ <div class="items" v-if="baseObject.bwType === '1'">
+ <div class="lable">
+ <p>榛戝悕鍗� ></p>
+ </div>
+ <div class="baseList">
+ <el-checkbox-group v-model="BaseManageData.selectBlacks" @change="blackAngWhite">
+ <div class="base" v-for="(item, index) in BaseManageData.blackList" :key="index">
+ <el-checkbox
+ :label="item.value"
+ :title="item.title"
+ :disabled="item.disabled"
+ >{{item.title}}</el-checkbox>
+ </div>
+ </el-checkbox-group>
+ </div>
+ </div>
+ <div class="items" v-else>
+ <div class="lable">
+ <p>鐧藉悕鍗� ></p>
+ </div>
+ <div class="baseList">
+ <el-checkbox-group v-model="BaseManageData.selectWhites" @change="blackAngWhite">
+ <div class="base" v-for="(item, index) in BaseManageData.whiteList" :key="index">
+ <el-checkbox
+ :label="item.value"
+ :title="item.title"
+ :disabled="item.disabled"
+ >{{item.title}}</el-checkbox>
+ </div>
+ </el-checkbox-group>
+ </div>
+ </div>
+ </div>
+ <div slot="footer" class="dialog-footer">
+ <el-button size="small" @click="copyClose" type="info">鍙� 娑�</el-button>
+ <el-button size="small" type="primary" @click="copySubmit()">纭� 瀹�</el-button>
+ </div>
+ </el-dialog>
+
+ <el-dialog
+ title="绉诲姩鑷�"
+ :visible.sync="moveVisiabled"
+ :append-to-body="true"
+ okText="淇濆瓨"
+ class="move"
+ width="35%"
+ cancelText="鍙栨秷"
+ >
+ <div class="addToBase1">
+ <div class="items">
+ <div class="lable">
+ <p>榛戝悕鍗� ></p>
+ </div>
+ <div class="baseList">
+ <el-checkbox-group
+ v-model="BaseManageData.selectBlacks"
+ @change="blackAngWhite"
+ :max="1"
+ >
+ <div class="base" v-for="(item, index) in BaseManageData.blackList" :key="index">
+ <el-checkbox
+ :label="item.value"
+ :title="item.title"
+ :disabled="item.disabled"
+ >{{item.title}}</el-checkbox>
+ </div>
+ </el-checkbox-group>
+ </div>
+ </div>
+ <div class="items">
+ <div class="lable">
+ <p>鐧藉悕鍗� ></p>
+ </div>
+ <div class="baseList">
+ <el-checkbox-group
+ v-model="BaseManageData.selectWhites"
+ @change="blackAngWhite"
+ :max="1"
+ >
+ <div class="base" v-for="(item, index) in BaseManageData.whiteList" :key="index">
+ <el-checkbox
+ :label="item.value"
+ :title="item.title"
+ :disabled="item.disabled"
+ >{{item.title}}</el-checkbox>
+ </div>
+ </el-checkbox-group>
+ </div>
+ </div>
+ </div>
+ <div slot="footer" class="dialog-footer">
+ <el-button size="small" @click="moveClose" type="info">鍙� 娑�</el-button>
+ <el-button size="small" type="primary" @click="moveSubmit()">纭� 瀹�</el-button>
+ </div>
+ </el-dialog>
+ </div>
+</template>
+<script>
+import { addBaseCar, updateBaseCar, deleteBasePersons, plateBatch } from "@/api/baseLibrary";
+import axios from "axios";
+// import { findByType } from '@/server/video.js'
+import Upload from "./upload";
+import fTemplate from "@/components/fTemplate";
+import request from "@/scripts/httpRequest"
+export default {
+ components: {
+ // httpImg,
+ fTemplate
+ },
+ props: {
+ baseObject: {
+ default: () => { },
+ type: Object
+ }
+ },
+ data() {
+ return {
+ dialogFormVisible: false,
+ addDrawer: false,
+ plates: "",
+ addBatchDrawer: false,
+ direction: 'rtl',
+ dialogImageUrl: '',
+ fileList: [{ name: "fasjido.jpg", url: "group2/M00/0A/D7/wKgBnFyjH0-AUE5eAAC8hSMP2Yw110.jpg" }, { name: "fasjido.jpg", url: "group2/M00/0A/D7/wKgBnFyjH0-AUE5eAAC8hSMP2Yw110.jpg" }],
+ provinces: [{ name: '浜�', value: 1 }, { name: '娲�', value: 2 }, { name: '鍐�', value: 3 }],
+ copyVisiabled: false,
+ moveVisiabled: false,
+ buttonAuthority: sessionStorage.getItem("buttonAuthoritys") || [],
+ searchName: "",
+ current: 1,
+ compare: false,
+ pageSize: 10,
+ total: 0,
+ orderType: "desc",
+ orderName: "id",
+ contentValue: "",
+ visible: false,
+ selectedRowKeys: [],
+ form: {
+ id: "",
+ sex: "鐢�",
+ name: "",
+ tableId: "",
+ picDesc: "",
+ idCard: "",
+ phoneNum: "",
+ monitorLevel: "one",
+ carUrls: [], //{url:"/httpImage/192.168.20.10:6701/818,56d0122c44f069"},{url:"/httpImage/192.168.20.10:6701/818,56d0122c44f069"}
+ faceUrl: [],
+ faceFeature: "",
+ carPicUrls: "",
+ personPicUrl: "",
+ carColor: "0",
+ carType: "0",
+ carBrand: "0",
+ carNo: "",
+ enable: 0,
+ reserved: ""
+ },
+ rules: {
+ picDesc: [
+ { required: true, message: "璇疯緭鍏ョ収鐗囨爣璇�", trigger: "change" }
+ ],
+ sex: [{ required: true, message: "璇峰嬀閫夋�у埆", trigger: "change" }],
+ monitorLevel: [
+ { required: true, message: "璇烽�夋嫨浜哄憳绛夌骇", trigger: "change" }
+ ]
+ },
+ tableData: [],
+ tableHeight: window.innerHeight - 320,
+ multipleSelection: [],
+ peoperLevel: [],
+ oldWidth: "",
+ oldHeight: "",
+ // 涓婁紶鍚庣殑寮规鏄剧ず
+ dialogVisible: false,
+ // 鎵归噺涓婁紶鍚庣殑杩斿洖缁撴灉
+ uploadResult: { failList: [], successList: [], multiFaceList: [], noFaceList: [] }
+ };
+ },
+ computed: {
+ isAdmin() {
+ if (
+ sessionStorage.getItem('userInfo') &&
+ sessionStorage.getItem('userInfo') !== ''
+ ) {
+ let loginName = JSON.parse(sessionStorage.getItem('userInfo')).username
+ return (
+ loginName === 'superadmin' || loginName === 'basic'
+ )
+ }
+ return false;
+ }
+ },
+ methods: {
+ handleRemoveCarPic(file, fileList) {
+ console.log("鍒犻櫎鏂囦欢", file, fileList);
+ var index = fileList.findIndex(item => {
+ if (item.uid == file.uid) {
+ return true
+ }
+ })
+ console.log("鍒犻櫎鐨勭储寮�", index)
+ this.form.carUrls.splice(index, 1)
+ console.log("鍒犻櫎鍚庣殑fileList:", this.fileList)
+ },
+ handleRemoveFacePic(file, fileList) {
+ this.form.faceUrl.splice(0, 1)
+ console.log("鍒犻櫎鍚庣殑faceUrl:", this.fileList)
+ },
+ beforeUoload() {
+
+ },
+ handlePictureCardPreview(file) {
+ this.dialogImageUrl = file.url;
+ this.dialogVisible = true;
+ },
+ async uploadCar(param) {
+ const fd = new FormData()
+ console.log("鏂囦欢鍙傛暟锛�", param)
+ fd.append('file', param.file)
+ fd.append('picType', '0')
+ console.log("鍙傛暟锛�", fd)
+ let res = await request({
+ method: 'post',
+ url: `/data/api-v/dbperson/fileupload`,
+ data: fd
+ })
+ console.log("鍥剧墖涓婁紶缁撴灉锛�", res.success)
+ if (res.success) {
+ this.form.carUrls.push({ url: "/httpImage/" + res.data.picUrl })
+ console.log("carUrl:", this.form.carUrls)
+ }
+ },
+ async uploadPerson(param) {
+ const fd = new FormData()
+ fd.append('file', param.file)
+ fd.append('picType', '1')
+ let res = await request({
+ method: 'post',
+ url: `/data/api-v/dbperson/fileupload`,
+ data: fd
+ })
+ if (res.success) {
+ this.form.faceUrl.push({ url: "/httpImage/" + res.data.picUrl })
+ this.form.faceFeature = res.data.faceFeature
+ console.log("faceUrl:", this.form.faceUrl)
+ }
+ },
+ addCar() {
+ this.addDrawer = true
+ },
+ addBatch() {
+ this.addBatchDrawer = true
+ },
+ resetForm() {
+
+ },
+ handleClose1(done) {
+ this.form = {
+ id: "",
+ sex: "鐢�",
+ name: "",
+ tableId: "",
+ picDesc: "",
+ idCard: "",
+ phoneNum: "",
+ monitorLevel: "one",
+ carUrls: [], //{url:"/httpImage/192.168.20.10:6701/818,56d0122c44f069"},{url:"/httpImage/192.168.20.10:6701/818,56d0122c44f069"}
+ faceUrl: [],
+ faceFeature: "",
+ carPicUrls: "",
+ personPicUrl: "",
+ carColor: "0",
+ carType: "0",
+ carBrand: "0",
+ carNo: "",
+ enable: 0,
+ reserved: ""
+ },
+ done()
+ // this.$confirm('纭鍏抽棴锛�')
+ // .then(_ => {
+ // done();
+ // })
+ // .catch(_ => {});
+ },
+ handleClose2(done) {
+ done()
+ // this.$confirm('纭鍏抽棴锛�')
+ // .then(_ => {
+ // done();
+ // })
+ // .catch(_ => {});
+ },
+ isShow(authority) {
+ if (this.isAdmin) {
+ return true
+ } else if (
+ this.buttonAuthority.indexOf(',' + authority + ',') > -1
+ ) {
+ return true
+ } else {
+ return false
+ }
+ },
+ toggleSelection(rows) {
+ if (rows) {
+ rows.forEach(row => {
+ this.$refs.multipleTable.toggleRowSelection(row);
+ });
+ } else {
+ this.$refs.multipleTable.clearSelection();
+ }
+ },
+ deleteThis(id) {
+ let token =
+ sessionStorage.getItem("loginedInfo") &&
+ JSON.parse(sessionStorage.getItem("loginedInfo")).access_token;
+ this.$confirm("鎻愮ず锛氱‘瀹氬垹闄よ搴曞簱浜哄憳锛�", {
+ center: true,
+ cancelButtonClass: "comfirm-class-cancle",
+ confirmButtonClass: "comfirm-class-sure"
+ })
+ .then(_ => {
+ fetch(`/data/api-v/dbperson/deleteDbPersonById/${id}`, {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json",
+ Authorization: token
+ }
+ })
+ .then(res => {
+ return res.json();
+ })
+ .then(data => {
+ // console.log(data.data);
+ if (data.success) {
+ this.$notify({
+ type: "success",
+ message: "璇ヤ汉鍛樺垹闄ゆ垚鍔燂紒"
+ });
+ }
+ this.getCarList();
+ })
+ .catch(err => {
+ console.log(err);
+ });
+ })
+ .catch(_ => { });
+ },
+ sayHello() {
+ console.log("hello");
+ },
+ getUploadResult(result) {
+ console.log(result, "涓婁紶鐨勮繑鍥�");
+ this.uploadResult = result.data;
+ this.dialogVisible = true;
+ this.getCarList();
+ },
+ async getCarList() {
+ // console.log("鎵ц浜嗗埛鏂板嚱鏁�", this.BaseManageData.syncTables[0]);
+ if (this.baseObject.id && this.baseObject.id !== undefined) {
+ // console.log("搴曞簱id", this.baseObject.id);
+ this.BaseManageData.tableId = this.baseObject.id;
+ // this.BaseManageData.queryPersonList();
+ this.setLoadSearch(this.BaseManageData.queryPersonList())
+ }
+ },
+ changeDialog(data) {
+ data.erFileList.map((item, index) => {
+ this.$notify({
+ type: "error",
+ message: item.errorMsg.message
+ });
+ });
+ },
+ handleClose() {
+ //this.getCarList();
+ this.dialogFormVisible = false;
+ },
+ handleSelectionChange(val) {
+ this.selectedRowKeys = val;
+ },
+ refrash(current, pageSize) {
+ this.current = current;
+ this.BaseManageData.page = current;
+ this.getCarList();
+ },
+ handleClick(row) {
+ this.form = row;
+ // 杩欏潡鍎垮悗鍙扮殑瀛楀吀value鍊兼湁闂锛岄渶瑕佸墠绔潵鍥炶浆
+ this.form.carColor += ""
+ this.form.carType += ""
+ this.form.carBrand += ""
+ console.log("this.form", this.form)
+ this.addDrawer = true;
+ },
+ async submit() {
+ this.$refs["formForEdit"].validate(async valid => {
+ // console.log("閫氳繃楠岃瘉", valid);
+ if (valid) {
+ let { ...json } = this.form;
+ delete (json["compareScore"])
+ // console.log("淇敼鐨勫弬鏁帮細", json);
+ let res = await updateBasePerson(json);
+ // console.log("淇濆瓨浜�", res);
+ if (res.success) {
+ this.$notify({
+ type: "success",
+ message: "浜哄憳淇敼鎴愬姛锛�"
+ });
+ this.dialogFormVisible = false;
+ } else {
+ this.$notify({
+ type: "error",
+ message: "浜哄憳淇敼澶辫触锛岃閲嶈瘯锛侊紒"
+ });
+ }
+ } else {
+ return false;
+ }
+ });
+ },
+ confirm() {
+ this.$confirm({
+ title: "Confirm",
+ content: "Bla bla ...",
+ okText: "纭",
+ cancelText: "鍙栨秷"
+ });
+ },
+ async enable(item) {
+ let res = await updateBasePerson({
+ id: item.id,
+ enable: item.enable,
+ sex: item.sex,
+ personName: item.personName,
+ picDesc: item.picDesc,
+ idCard: item.idCard,
+ phoneNum: item.phoneNum,
+ monitorLevel: item.monitorLevel,
+ personPicUrl: item.personPicUrl,
+ reserved: item.reserved
+ });
+ if (res.success === true) {
+ this.$notify({
+ type: "success",
+ message: "搴曞簱浜哄憳鎴愬姛鍙樻洿鐢熸晥鐘舵�侊紒"
+ });
+ } else {
+ this.$notify({
+ type: "error",
+ message: "搴曞簱浜哄憳鍙樻洿鐢熸晥鐘舵�佸け璐ワ紒"
+ });
+ }
+ },
+ handleSearch() {
+ this.getCarList();
+ },
+ searchImg() {
+ this.$refs.uploadDrag && this.$refs.uploadDrag.uploadStart();
+ },
+ haveScore(row) {
+ if (row.compareScore && row.compareScore !== "") {
+ return true
+ } else {
+ return false
+ }
+ },
+ async searchImgList(faceUrl, threshold) {
+ // console.log("鎼滃浘鍙傛暟", faceUrl, threshold);
+ let json = {
+ tableId: this.baseObject.id,
+ page: this.current,
+ size: this.pageSize,
+ faceUrl: faceUrl,
+ threshold: threshold,
+ orderType: this.orderType,
+ orderName: this.orderName
+ };
+ let res = await getPersonByPhoto(json);
+ // console.log("鍒楄〃鏌ヨ", json);
+ this.tableData = res.data.datalist;
+ this.total = res.data.total;
+ this.compare = true;
+ },
+ updateThreshold() { },
+ async updateFace(param) {
+ const fd = new FormData();
+ fd.append("file", param.file);
+ fd.append("id", this.form.id);
+ // console.log("鎹㈣劯浜嗗悧", fd);
+ let res = await axios({
+ method: "post",
+ url: `/data/api-v/dbperson/updateFace`,
+ headers: {
+ 'Authorization': sessionStorage.getItem('loginedInfo') && JSON.parse(sessionStorage.getItem('loginedInfo')).access_token
+ },
+ data: fd
+ });
+ if (res.data.success) {
+ this.form.personPicUrl = res.data.data.personPicUrl;
+ this.form.faceFeature = res.data.data.faceFeature;
+ }
+ },
+ uploadSuccess() {
+ console.log("鎹㈣劯鎴愬姛浜�");
+ },
+ uploadError() {
+ console.log("鎹㈣劯澶辫触浜�");
+ },
+ deleteBatch() {
+ // console.log('瑕佸垹闄ょ殑', this.selectedRowKeys.length)
+ if (this.selectedRowKeys.length === 0) {
+ this.$notify({
+ type: "warning",
+ message: "璇烽�夋嫨瑕佸垹闄ょ殑浜哄憳"
+ });
+ } else {
+ this.$confirm("鎻愮ず锛氱‘瀹氬垹闄よ搴曞簱閫変腑浜哄憳锛�", {
+ center: true,
+ cancelButtonClass: "comfirm-class-cancle",
+ confirmButtonClass: "comfirm-class-sure"
+ }).then(async _ => {
+ let ids = [];
+ this.selectedRowKeys.map((item, index) => {
+ ids.push(item.id);
+ });
+ // console.log('鎵归噺鍒犻櫎鏁扮粍', ids)
+ let res = await deleteBasePersons(ids);
+ // console.log(res, '鎵归噺鍒犻櫎缁撴灉')
+ if (res.success) {
+ this.$notify({
+ type: "success",
+ message: "鍒犻櫎鎴愬姛锛�"
+ });
+ this.getCarList();
+ } else {
+ this.$notify({
+ type: "error",
+ message: "鍒犻櫎澶辫触锛�"
+ });
+ }
+ });
+ }
+ },
+ async init() {
+ await this.BaseManageData.querySyncTables();
+ await this.BaseManageData.queryLocalTables();
+ if (this.baseObject.id && this.baseObject.id !== undefined) {
+ // console.log("one;", this.baseObject.id);
+ } else if (
+ this.BaseManageData.syncTables[0].id &&
+ this.BaseManageData.syncTables[0].id !== undefined
+ ) {
+ this.BaseManageData.tableId = this.BaseManageData.syncTables[0].id;
+ this.BaseManageData.queryPersonList();
+ } else {
+ this.BaseManageData.tableId = this.BaseManageData.localTables[0].id;
+ this.BaseManageData.queryPersonList();
+ }
+ },
+ handleRowStyle({ row, rowIndex }) {
+ // console.log(row, rowIndex, "handleRowStyle");
+ if (rowIndex === 0) {
+ return "background:#222222;";
+ }
+ },
+ blackAngWhite() {
+ if (this.BaseManageData.selectBlacks.length > 0) {
+ for (let i = 0; i < this.BaseManageData.whiteList.length; i++) {
+ //this.VideoPhotoData.whiteList[i].disabled = true
+ this.$set(this.BaseManageData.whiteList[i], 'disabled', true)
+ }
+ }
+ if (this.BaseManageData.selectBlacks.length == 0) {
+ for (let i = 0; i < this.BaseManageData.whiteList.length; i++) {
+ //this.VideoPhotoData.whiteList[i].disabled = false
+ this.$set(this.BaseManageData.whiteList[i], 'disabled', false)
+ }
+ }
+ if (this.BaseManageData.selectWhites.length > 0) {
+ for (let i = 0; i < this.BaseManageData.blackList.length; i++) {
+ // this.VideoPhotoData.blackList[i].disabled = true
+ this.$set(this.BaseManageData.blackList[i], 'disabled', true)
+ }
+ }
+ if (this.BaseManageData.selectWhites.length == 0) {
+ for (let i = 0; i < this.BaseManageData.blackList.length; i++) {
+ //this.VideoPhotoData.blackList[i].disabled = false
+ this.$set(this.BaseManageData.blackList[i], 'disabled', false)
+ }
+ }
+ },
+ tosearch(item) {
+ // console.log("璺宠浆鍦板潃", item)
+ var curWwwPath = window.document.location.href;
+ var pathname = window.document.location.pathname;
+ var pos = curWwwPath.indexOf(pathname);
+ var localhostPath = curWwwPath.substring(0, pos); //ip+port
+ var href = localhostPath + "/Layout/Searching"
+ let captureId = item.id == "" ? item.personId : item.id
+ var url = item.personPicUrl ? item.personPicUrl : item.personPicUrl
+ // console.log("璺宠浆鍦板潃",href,"url",url)
+ var compType = 0
+ window.open(href + '?showType=findByPic&targetId=' + captureId + '&picSmUrl=' + url + '&compType=' + compType)
+ },
+ async platesBatch() {
+ var temp = this.plates.split(/[\n,]/g);
+ var reg = /[浜触娌笣鍐�璞簯杈介粦婀樼殩椴佹柊鑻忔禉璧ｉ剛妗傜敇鏅嬭挋闄曞悏闂借吹绮ら潚钘忓窛瀹佺惣浣块]{1}[A-Z]{1}[A-Z0-9]{5,6}/;
+ for (let i = 0; i < temp.length; i++) {
+ if (temp[i] == '') {
+ temp.splice(i, 1)
+ i--
+ } else {
+ if (!reg.test(temp[i])) {
+ this.$notify({
+ type: "error",
+ message: "杞︾墝鍙�:" + temp[i] + "涓嶇鍚堣鍒欙紝璇锋鏌�!"
+ })
+ return
+ }
+ }
+ }
+ if (temp.length == 0) {
+ this.$notify({
+ type: 'error',
+ message: '璇疯緭鍏ヨ溅鐗屽彿',
+ })
+ return
+ }
+ let param = {
+ tableId: this.baseObject.id,
+ carNos: temp
+ }
+ let resp = await plateBatch(param)
+ console.log("resp:", resp)
+ if (resp && resp.success) {
+ // 鍒锋柊car鍒楄〃
+ this.$notify({
+ type: "success",
+ message: resp.msg
+ });
+ this.getCarList();
+ this.addBatchDrawer = false;
+ } else {
+ this.$notify({
+ type: "error",
+ message: resp.msg
+ });
+ }
+
+ },
+ async submitCar() {
+ this.$refs["formForCar"].validate(async valid => {
+ // console.log("閫氳繃楠岃瘉", valid);
+ if (valid) {
+ let { ...json } = this.form;
+
+ for (let index in json.carUrls) {
+ if (index == 0) {
+ json.carPicUrls += json.carUrls[index].url.substring(11)
+ } else {
+ json.carPicUrls += ";" + json.carUrls[index].url.substring(11)
+ }
+ }
+ json.carColor = parseInt(json.carColor)
+ json.carType = parseInt(json.carType)
+ json.carBrand = parseInt(json.carBrand)
+ json.personPicUrl = json.faceUrl[0].url.substring(11)
+ json.tableId = this.baseObject.id
+ console.log("琛ㄥ崟鐨刯son鍖栵細", json)
+ delete (json["compareScore"])
+ // console.log("淇敼鐨勫弬鏁帮細", json);
+ let res
+ if (json.id == "") {
+ res = await addBaseCar(json);
+ } else {
+ res = await updateBaseCar(json);
+ }
+ console.log("淇濆瓨浜�", res);
+ if (res.success) {
+ this.$notify({
+ type: "success",
+ message: res.data.msg
+ });
+ this.getCarList();
+ this.addDrawer = false;
+ } else {
+ this.$notify({
+ type: "error",
+ message: res.data.msg
+ });
+ }
+ } else {
+ return false;
+ }
+ });
+ },
+ copyClick(row) {
+ this.BaseManageData.personId = row.id
+ this.copyVisiabled = true
+ },
+ moveClick(row) {
+ this.BaseManageData.personId = row.id
+ this.moveVisiabled = true
+ },
+ copyClose() {
+ this.copyVisiabled = false
+ this.BaseManageData.personId = ""
+ this.BaseManageData.selectBlacks = []
+ this.BaseManageData.selectWhites = []
+ },
+ moveClose() {
+ this.moveVisiabled = false
+ this.BaseManageData.personId = ""
+ this.BaseManageData.selectBlacks = []
+ this.BaseManageData.selectWhites = []
+ },
+ copySubmit() {
+ if (this.BaseManageData.selectBlacks.length === 0 && this.BaseManageData.selectWhites.length === 0) {
+ this.$notify({
+ title: "娉ㄦ剰",
+ message: "璇烽�夋嫨瑕佸鍒跺埌鐨勫簱",
+ type: "warning"
+ })
+ return
+ }
+ var resp = this.BaseManageData.copyTo()
+ resp.then(data => {
+ if (data.success) {
+ this.$notify({
+ title: "鎴愬姛",
+ message: data.data,
+ type: "success"
+ })
+ } else {
+ this.$notify({
+ title: "澶辫触",
+ message: data.data,
+ type: "error"
+ })
+ }
+ })
+ this.copyVisiabled = false
+ this.BaseManageData.personId = ""
+ this.BaseManageData.selectBlacks = []
+ this.BaseManageData.selectWhites = []
+ },
+ getDataName: (dataList, key) => {
+ let name = ""
+ if (Array.isArray(dataList) && dataList.length > 0) {
+ for (let i = 0; i < dataList.length; i++) {
+ if (dataList[i].value == key) {
+ name = dataList[i].name
+ }
+ }
+ }
+ return name
+ },
+ moveSubmit() {
+ if (this.BaseManageData.selectBlacks.length === 0 && this.BaseManageData.selectWhites.length === 0) {
+ this.$notify({
+ title: "娉ㄦ剰",
+ message: "璇烽�夋嫨瑕佺Щ鍔ㄥ埌鐨勫簱",
+ type: "warning"
+ })
+ return
+ }
+ var resp = this.BaseManageData.moveTo()
+ resp.then(data => {
+ if (data.success) {
+ this.$notify({
+ title: "鎴愬姛",
+ message: data.data,
+ type: "success"
+ })
+ } else {
+ this.$notify({
+ title: "澶辫触",
+ message: data.data,
+ type: "error"
+ })
+ }
+ this.moveVisiabled = false
+ this.BaseManageData.personId = ""
+ this.BaseManageData.selectBlacks = []
+ this.BaseManageData.selectWhites = []
+ this.BaseManageData.queryPersonList()
+ })
+ },
+ setLoadSearch(fn) {
+ this.AuthData.setLoading("multipleTable", this);
+ fn.then(_ => {
+ this.AuthData.closeLoad();
+ })
+ }
+ },
+ mounted() {
+ this.getCarList();
+ this.VideoPhotoData.queryDictionary();
+ this.BaseManageData.queryTagList();
+ this.oldWidth = document.body.clientWidth;
+ this.oldHeight = document.body.clientHeight;
+ this.blackAngWhite();
+ window.onresize = () => {
+ let width = document.body.clientWidth;
+ let height = document.body.clientHeight;
+ // console.log(width, height, "绐楀彛鍙樺寲瀵规瘮", this.oldWidth, this.oldHeight);
+ if (width !== this.oldWidth && width < 1750) {
+ }
+ this.$nextTick(() => {
+ this.$refs.multipleTable.doLayout();
+ });
+ };
+ this.$nextTick(() => {
+ this.$refs.multipleTable.doLayout();
+ });
+ },
+ beforeDestroy() {
+ window.onresize = null;
+ },
+ watch: {
+ baseObject: {
+ handler(newVal, oldVal) {
+ // console.log(newVal, "鐩戝惉baseObject");
+ this.BaseManageData.cleanData();
+ this.getCarList();
+ },
+ deep: true
+ },
+ "BaseManageData.selectBlacks": function (value) {
+ this.blackAngWhite()
+ },
+ "BaseManageData.selectWhites": function (value) {
+ this.blackAngWhite()
+ },
+ }
+};
+</script>
+<style lang="scss">
+.iconStyle1 {
+ font-size: 16px;
+ margin-left: 8px;
+ cursor: pointer;
+ color: #303133;
+}
+.activeRow {
+ background: rgb(245, 247, 250);
+}
+.cursor-pointer {
+ cursor: pointer;
+}
+.el-table {
+ position: relative;
+ overflow: hidden;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+ -webkit-box-flex: 1;
+ -ms-flex: 1;
+ flex: 1;
+ width: auto;
+ max-width: none;
+ font-size: 14px;
+ color: #606266;
+ thead {
+ background: green !important;
+ }
+}
+.avatar-uploader:hover {
+ .mask1 {
+ display: block;
+ }
+}
+.mask1 {
+ position: absolute;
+ width: 150px;
+ height: 150px;
+ background: rgba(0, 0, 0, 0.35);
+ backdrop-filter: blur(1px) brightness(100%);
+ text-align: center;
+ z-index: 1;
+ border-radius: 3px;
+ display: none;
+}
+.table-parent {
+ // position: relative;
+ height: 90%;
+ overflow: visible !important;
+ .picture {
+ .el-carousel__item {
+ display: flex;
+ justify-content: center;
+ align-items: Center;
+ overflow: hidden;
+ }
+ .el-carousel__container {
+ height: 100% !important;
+ .el-carousel__arrow {
+ top: 50% !important;
+ }
+ .el-carousel__arrow {
+ height: 20px;
+ width: 20px;
+ }
+ .el-carousel__arrow--right {
+ right: 5px !important;
+ }
+ .el-carousel__arrow--left {
+ left: 5px !important;
+ }
+ }
+ }
+ .el-carousel__container {
+ height: 100px;
+ .el-carousel__arrow {
+ width: 25px;
+ height: 25px;
+ }
+ }
+ .el-drawer.ltr,
+ .el-drawer.rtl {
+ width: 27% !important;
+ height: 90%;
+ top: 9%;
+ .el-drawer__header {
+ border-bottom: 2px solid #eee;
+ padding-bottom: 10px;
+ font-size: 16px;
+ margin-bottom: 0px;
+ }
+ }
+}
+
+.text-left {
+ .el-upload-list {
+ display: none;
+ }
+}
+.border-tabl {
+ border: 1px solid #ebeef5;
+ border-bottom: none;
+ // border-bottom: none;
+}
+.el-dialog__header {
+ padding: 20px 0 10px;
+ text-align: left;
+ -webkit-box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.07);
+ box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.07);
+}
+.el-dialog__title {
+ line-height: 20px;
+ font-size: 15px;
+ margin-left: 10px;
+ color: #303133;
+}
+.el-dialog__body {
+ padding: 30px 20px 20px 20px;
+ color: #606266;
+ font-size: 14px;
+ word-break: break-all;
+}
+.dialog-footer {
+ text-align: center;
+}
+.comfirm-class-sure {
+ background: #f53d3d;
+ border-radius: 2px;
+ outline: none;
+ color: #fff;
+ background-color: #f53d3d;
+ border-color: #f53d3d;
+ font-family: PingFangSC-Regular;
+ font-size: 13px;
+ color: #ffffff;
+ text-align: center;
+}
+.comfirm-class-cancle {
+ background: #eaeaea;
+ border-radius: 2px;
+ outline: none;
+ color: #fff;
+ background-color: #eaeaea;
+ border-color: #eaeaea;
+ font-family: PingFangSC-Regular;
+ font-size: 13px;
+ color: #222222;
+ text-align: center;
+}
+
+.el-table .cell {
+ padding-left: 8px !important;
+ padding-right: 0px !important;
+}
+.addToBase1 {
+ width: 98%;
+ height: 350px;
+ position: relative;
+ .topLabel {
+ margin-top: 20px;
+ height: 40px;
+ border-bottom: 1px solid #eee;
+ font-family: PingFangSC-Medium;
+ font-size: 20px;
+ font-weight: 600;
+ line-height: 1rem;
+ color: #222222;
+ text-align: left;
+ margin-left: 15px;
+ }
+ .items {
+ width: 100%;
+ height: auto;
+ max-height: 35%;
+ overflow-y: auto;
+ margin: 20px 0px;
+ .lable {
+ width: 15%;
+ margin-top: 10px;
+ float: left;
+ //font-family: PingFangSC-Medium;
+ font-size: 14px;
+ font-weight: 600;
+ }
+ .baseList {
+ width: 85%;
+ height: 100%;
+ float: left;
+ .base {
+ width: calc(33% - 10px);
+ padding: 0px 5px;
+ line-height: 30px;
+ float: left;
+ text-align: left;
+ font-size: 12px !important;
+ .el-checkbox {
+ width: 100%;
+ display: block;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ .el-checkbox__label {
+ display: inline !important;
+ }
+ }
+ }
+ }
+ }
+}
+.copy,
+.move {
+ .el-dialog__body {
+ padding: 0px !important;
+ }
+}
+
+.avatar-uploader {
+ max-width: 150px;
+ min-width: 150px;
+ min-height: 152px;
+ border: 1px solid #eee;
+}
+
+.inputWidth {
+ width: 270px !important;
+}
+.rightInputWidth {
+ max-width: 270px;
+}
+
+.el-drawer.ltr,
+.el-drawer.rtl {
+ min-width: 450px;
+ width: 25% !important;
+ height: 90%;
+ min-height: 1100px;
+ top: 9%;
+ .el-drawer__header {
+ border-bottom: 2px solid #eee;
+ padding-bottom: 10px;
+ font-size: 16px;
+ margin-bottom: 0px;
+ :focus {
+ outline: 0;
+ }
+ }
+}
+
+.drawerSpace {
+ height: 900px;
+ margin-bottom: 30px;
+ overflow-y: scroll;
+ .uploadLine {
+ height: 280px;
+
+ .car-picture {
+ float: left;
+ margin: 15px;
+ border: 1px solid #eee;
+ width: 280px;
+ height: 260px;
+ overflow: hidden;
+ .el-upload--picture-card {
+ margin: 10px;
+ width: 110px;
+ height: 110px;
+ line-height: 35px;
+ }
+ .el-upload-list--picture-card {
+ .el-upload-list__item {
+ margin: 10px;
+ width: 110px;
+ height: 110px;
+ img {
+ object-fit: contain;
+ }
+ }
+ .el-progress--circle {
+ width: 30px !important;
+ }
+ }
+ }
+ .person-picture {
+ float: left;
+ margin-top: 15px;
+ width: 120px;
+ height: 120px;
+ overflow: hidden;
+ .el-upload--picture-card {
+ width: 110px;
+ height: 110px;
+ line-height: 35px;
+ }
+ .el-upload-list__item {
+ margin: 10px;
+ width: 110px;
+ height: 110px;
+ img {
+ object-fit: contain;
+ }
+ }
+ }
+ }
+ .plateAttach {
+ width: calc(100% -40px);
+ height: calc(100% -40px);
+ padding: 20px;
+ p {
+ margin-top: 20px;
+ width: 400px;
+ line-height: 20px;
+ }
+ }
+}
+</style>
diff --git a/src/pages/library/components/personList.vue b/src/pages/library/components/personList.vue
new file mode 100644
index 0000000..4e75db3
--- /dev/null
+++ b/src/pages/library/components/personList.vue
@@ -0,0 +1,1153 @@
+<template>
+ <div class="table-parent">
+ <el-row class style="margin:20px">
+ <!-- <el-col :span="4" class="tl">
+ <b class="f14">{{this.baseObject.tableName}}</b>
+ </el-col>
+ <el-col :span="2">
+ <b class="f14">{{this.baseObject.bwType === '1'?'榛戝悕鍗�':'鐧藉悕鍗�'}}</b>
+ </el-col>
+ <el-col :span="8">
+ <b class="f14">鏈夋晥鏃堕棿锛歿{this.baseObject.startTime}}--{{this.baseObject.endTime?this.baseObject.endTime:'姘镐箙鏈夋晥'}}</b>
+ </el-col>-->
+ <div class="tl">
+ <span
+ class="f14"
+ style="color:#000000;"
+ >{{this.baseObject.tableName?this.baseObject.tableName + '/ ':''}}</span>
+ <span
+ class="f14"
+ style="color:#000000;"
+ >{{this.baseObject.bwType === '1'?'榛戝悕鍗�/ ':'鐧藉悕鍗�/ '}}</span>
+ <span
+ class="f14"
+ style="color:#000000;"
+ >鏈夋晥鏃堕棿锛歿{this.baseObject.startTime}}--{{this.baseObject.endTime?this.baseObject.endTime:'姘镐箙鏈夋晥'}}</span>
+ </div>
+ </el-row>
+ <el-row class style="margin:40px 0 40px 20px">
+ <el-col :span="6">
+ <el-input
+ placeholder="濮撳悕/鎬у埆/韬唤璇佸彿/鎵嬫満鍙�"
+ autocomplete="off"
+ width="100%"
+ size="small"
+ v-model="BaseManageData.contentValue"
+ @keyup.enter.native="handleSearch"
+ >
+ <upload-icon slot="suffix"></upload-icon>
+ </el-input>
+ </el-col>
+ <el-col :span="2">
+ <el-button size="small" type="primary" @click="handleSearch">鎼滅储</el-button>
+ </el-col>
+ <el-col :offset="11" :span="3">
+ <fTemplate authority="videoTable:edit">
+ <el-button
+ size="small"
+ class="ml10"
+ type="danger"
+ @click="deleteBatch"
+ v-if="isShow('videoTable:edit')"
+ >鎵归噺鍒犻櫎</el-button>
+ </fTemplate>
+ </el-col>
+ <el-col :span="2">
+ <div class="text-left">
+ <upload
+ limitTypes=".jpg,.png,.jpeg,.gif,.mp4"
+ limitSize
+ uploadBtntext="涓婁紶鐓х墖"
+ uploadBtnIcon
+ v-if="isShow('videoTable:edit')"
+ uploadBtnSize="small"
+ :isDrag="true"
+ @addFilesBaBackFN="changeDialog"
+ @successFN="getUploadResult"
+ :idJson="{tableId:baseObject.id}"
+ />
+ </div>
+ </el-col>
+ </el-row>
+ <div style="display:flex;" class="border-tabl ml20">
+ <el-table
+ id="multipleTable"
+ ref="multipleTable"
+ :data="BaseManageData.personList"
+ tooltip-effect="dark"
+ style="width: 100%;"
+ :fit="true"
+ :max-height="tableHeight"
+ :default-sort="{prop: 'createTime', order: 'descending'}"
+ @selection-change="handleSelectionChange"
+ :header-cell-style="{background:'#f8f8f8',color:'#222222'}"
+ >
+ <el-table-column type="selection" width="30"></el-table-column>
+ <el-table-column label="搴忓彿" width="60" sortable align="center">
+ <template slot-scope="scope">{{scope.$index+1}}</template>
+ </el-table-column>
+ <el-table-column prop="personPicUrl" label="鐓х墖" align="center" width="120">
+ <template slot-scope="scope">
+ <img
+ :src="'/httpImage/'+scope.row.personPicUrl"
+ style="width:84px;height:84px;object-fit:contain;"
+ alt
+ />
+ <p class="text-center fb f16" v-show="haveScore(scope.row)">{{scope.row.compareScore}}%</p>
+ </template>
+ </el-table-column>
+ <el-table-column
+ prop="personName"
+ label="濮撳悕"
+ min-width="90"
+ show-overflow-tooltip
+ sortable
+ align="center"
+ ></el-table-column>
+ <el-table-column prop="sex" label="鎬у埆" width="70" sortable align="center"></el-table-column>
+ <el-table-column
+ prop="idCard"
+ label="韬唤璇佸彿"
+ min-width="170"
+ show-overflow-tooltip
+ sortable
+ align="center"
+ ></el-table-column>
+ <el-table-column
+ prop="phoneNum"
+ label="鎵嬫満鍙�"
+ width="110"
+ show-overflow-tooltip
+ sortable
+ align="center"
+ ></el-table-column>
+ <el-table-column prop="monitorLevel" label="绛夌骇" align="center" width="80"></el-table-column>
+ <el-table-column
+ prop="createTime"
+ label="鍏ュ簱鏃堕棿"
+ width="140"
+ show-overflow-tooltip
+ sortable
+ align="center"
+ ></el-table-column>
+ <!-- <el-table-column prop="reserved" label="鍏朵粬" align="center"></el-table-column> -->
+ <el-table-column label="鐢熸晥鐘舵��" align="center" width="80">
+ <template slot-scope="scope">
+ <el-switch
+ v-model="scope.row.enable"
+ :active-value="1"
+ :disabled="!isShow('videoTable:edit')"
+ :inactive-value="0"
+ @change="enable(scope.row)"
+ ></el-switch>
+ </template>
+ </el-table-column>
+ <el-table-column label="鎿嶄綔" min-width="200" align="center">
+ <template slot-scope="scope">
+ <fTemplate authority="videoTable:edit">
+ <el-tooltip content="缂栬緫" placement="top" popper-class="atooltip">
+ <span
+ class="iconfont iconbianji iconStyle1"
+ style="font-size:15px;"
+ @click="handleClick(scope.row)"
+ ></span>
+ </el-tooltip>
+ </fTemplate>
+ <el-tooltip content="鏌ユ壘姝や汉" placement="top" popper-class="atooltip">
+ <span class="iconfont iconsousuoren iconStyle1" @click="tosearch(scope.row)"></span>
+ </el-tooltip>
+ <fTemplate authority="videoTable:edit">
+ <el-tooltip content="澶嶅埗" placement="top" popper-class="atooltip">
+ <span
+ class="iconfont iconfuzhi iconStyle1"
+ title="澶嶅埗"
+ @click="copyClick(scope.row)"
+ ></span>
+ </el-tooltip>
+ </fTemplate>
+ <fTemplate authority="videoTable:edit">
+ <el-tooltip content="绉诲姩" placement="top" popper-class="atooltip">
+ <span
+ class="iconfont iconyidongzhi iconStyle1"
+ style="font-size:15px;"
+ title="绉诲姩"
+ @click="moveClick(scope.row)"
+ ></span>
+ </el-tooltip>
+ </fTemplate>
+ <fTemplate authority="videoTable:edit">
+ <el-tooltip content="鍒犻櫎" placement="top" popper-class="atooltip">
+ <span
+ class="iconfont iconshanchu iconStyle1"
+ style="color:#E74C3C;"
+ @click="deleteThis(scope.row.id)"
+ title="鍒犻櫎"
+ ></span>
+ </el-tooltip>
+ </fTemplate>
+ </template>
+ </el-table-column>
+ </el-table>
+ </div>
+ <div class="pt5 pb20" style="height:40px;position:relative">
+ <el-pagination
+ @current-change="refrash"
+ :current-page="BaseManageData.page"
+ :page-size="BaseManageData.size"
+ style="position:absolute;right:10px;bottom:5px"
+ :total="BaseManageData.total"
+ ></el-pagination>
+ </div>
+ <el-dialog
+ title="淇敼淇℃伅"
+ :visible.sync="dialogFormVisible"
+ okText="淇濆瓨"
+ width="30%"
+ :before-close="handleClose"
+ cancelText="鍙栨秷"
+ >
+ <el-form ref="formForEdit" :model="form" label-width="120px" :rules="rules">
+ <div class="flex-center mb10">
+ <el-upload
+ class="avatar-uploader"
+ action
+ :http-request="updateFace"
+ accept="image/*"
+ :show-file-list="false"
+ :on-success="uploadSuccess"
+ :on-error="uploadError"
+ >
+ <div class="mask1">
+ <div slot="trigger" class="flex-center" style="position:absolute;top:120px;">
+ <p
+ style="background:rgba(0,0,0,0.35);width:150px;line-height:30px;color:#fff;font-size:13px;opacity:1;"
+ >鐐瑰嚮淇敼鐓х墖</p>
+ </div>
+ </div>
+ <img
+ v-if="`httpImage/`+form.personPicUrl"
+ :src="`/httpImage/`+form.personPicUrl"
+ style="max-height:150px;width:150px;object-fit:contain;background:rgba(0,0,0,0.35);"
+ class="avatar"
+ />
+ </el-upload>
+ </div>
+ <el-row>
+ <el-col :span="20">
+ <el-form-item label="ID" style="width:100%;margin-bottom: 10px;">
+ <el-input size="small" v-model="form.id" disabled placeholder="璇疯緭鍏�"></el-input>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="20">
+ <el-form-item label="鐓х墖鏍囪瘑" prop="picDesc" style="width:100%;margin-bottom: 10px;">
+ <el-input size="small" v-model="form.picDesc" placeholder="璇疯緭鍏�"></el-input>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="20">
+ <el-form-item label="濮撳悕" style="width:100%;margin-bottom: 10px;">
+ <el-input size="small" v-model="form.personName" placeholder="璇疯緭鍏�"></el-input>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="20">
+ <el-form-item label="鎬у埆" prop="sex" style="width:100%;margin-bottom: 10px;" class="tl">
+ <el-radio-group v-model="form.sex" class="mt10">
+ <el-radio label="鐢�"></el-radio>
+ <el-radio label="濂�"></el-radio>
+ </el-radio-group>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="20">
+ <el-form-item label="韬唤璇佸彿" style="width:100%;margin-bottom: 10px;">
+ <el-input size="small" v-model="form.idCard" placeholder="璇疯緭鍏�"></el-input>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="20">
+ <el-form-item label="鎵嬫満鍙�" style="width:100%;margin-bottom: 10px;">
+ <el-input size="small" v-model="form.phoneNum" placeholder="璇疯緭鍏�"></el-input>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="20">
+ <el-form-item label="浜哄憳绛夌骇" prop="monitorLevel" style="width:100%;margin-bottom: 10px;">
+ <el-select
+ size="small"
+ v-model="form.monitorLevel"
+ placeholder="璇烽�夋嫨"
+ style="width:100%"
+ >
+ <el-option
+ v-for="item in VideoPhotoData.dictionary.MONITORLEVEL"
+ :key="item.value"
+ :label="item.name"
+ :value="item.value"
+ ></el-option>
+ </el-select>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="20">
+ <el-form-item label="鍏ュ簱浣嶇疆" style="width:100%;margin-bottom: 10px;">
+ <el-input size="small" v-model="form.fromServerId" disabled placeholder="璇疯緭鍏�"></el-input>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="20">
+ <el-form-item label="鍏ュ簱鏃堕棿" style="width:100%;margin-bottom: 10px;">
+ <el-input size="small" v-model="form.createTime" disabled placeholder="璇疯緭鍏�"></el-input>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="20">
+ <el-form-item label="鍏朵粬" style="width:100%;margin-bottom: 10px;">
+ <el-input size="small" v-model="form.reserved" placeholder="璇疯緭鍏�"></el-input>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ </el-form>
+ <div slot="footer" class="dialog-footer">
+ <el-button size="small" @click="handleClose" type="info">鍙� 娑�</el-button>
+ <el-button size="small" type="primary" @click="submit()">纭� 瀹�</el-button>
+ </div>
+ </el-dialog>
+ <el-dialog title="鎻愮ず" :visible.sync="dialogVisible" :close="getPersonList" width="30%">
+ <div>
+ <div class="tl">
+ <span>涓婁紶鎴愬姛鐨勬暟閲忥細{{uploadResult.successList.length}}</span>
+ </div>
+ <div class="flex-box mt10">
+ <span>涓婁紶澶辫触鐨勬暟閲忥細{{uploadResult.failList.length}}</span>
+ <div class="ml20" v-for="(i,index) in uploadResult.failList" :key="index">{{i}}</div>
+ </div>
+ <div class="flex-box mt10">
+ <span>鍖呭惈澶氬紶浜鸿劯鐨勫浘鐗囨暟閲忥細{{uploadResult.multiFaceList.length}}</span>
+ <div class="ml20" v-for="(i,index) in uploadResult.multiFaceList" :key="index">{{i}}</div>
+ </div>
+ <div class="flex-box mt10">
+ <span>涓嶅惈浜鸿劯鐨勫浘鐗囨暟閲忥細{{uploadResult.noFaceList.length}}</span>
+ <div class="ml20" v-for="(i,index) in uploadResult.noFaceList" :key="index">{{i}}</div>
+ </div>
+ </div>
+ </el-dialog>
+
+ <el-dialog
+ title="澶嶅埗鍒�"
+ :visible.sync="copyVisiabled"
+ okText="淇濆瓨"
+ width="35%"
+ class="copy"
+ cancelText="鍙栨秷"
+ >
+ <div class="addToBase1">
+ <div class="items" v-if="baseObject.bwType === '1'">
+ <div class="lable">
+ <p>榛戝悕鍗� ></p>
+ </div>
+ <div class="baseList">
+ <el-checkbox-group v-model="BaseManageData.selectBlacks" @change="blackAngWhite">
+ <div class="base" v-for="(item, index) in BaseManageData.blackList" :key="index">
+ <el-checkbox
+ :label="item.value"
+ :title="item.title"
+ :disabled="item.disabled"
+ >{{item.title}}</el-checkbox>
+ </div>
+ </el-checkbox-group>
+ </div>
+ </div>
+ <div class="items" v-else>
+ <div class="lable">
+ <p>鐧藉悕鍗� ></p>
+ </div>
+ <div class="baseList">
+ <el-checkbox-group v-model="BaseManageData.selectWhites" @change="blackAngWhite">
+ <div class="base" v-for="(item, index) in BaseManageData.whiteList" :key="index">
+ <el-checkbox
+ :label="item.value"
+ :title="item.title"
+ :disabled="item.disabled"
+ >{{item.title}}</el-checkbox>
+ </div>
+ </el-checkbox-group>
+ </div>
+ </div>
+ </div>
+ <div slot="footer" class="dialog-footer">
+ <el-button size="small" @click="copyClose" type="info">鍙� 娑�</el-button>
+ <el-button size="small" type="primary" @click="copySubmit()">纭� 瀹�</el-button>
+ </div>
+ </el-dialog>
+
+ <el-dialog
+ title="绉诲姩鑷�"
+ :visible.sync="moveVisiabled"
+ okText="淇濆瓨"
+ class="move"
+ width="35%"
+ cancelText="鍙栨秷"
+ >
+ <div class="addToBase1">
+ <div class="items">
+ <div class="lable">
+ <p>榛戝悕鍗� ></p>
+ </div>
+ <div class="baseList">
+ <el-checkbox-group
+ v-model="BaseManageData.selectBlacks"
+ @change="blackAngWhite"
+ :max="1"
+ >
+ <div class="base" v-for="(item, index) in BaseManageData.blackList" :key="index">
+ <el-checkbox
+ :label="item.value"
+ :title="item.title"
+ :disabled="item.disabled"
+ >{{item.title}}</el-checkbox>
+ </div>
+ </el-checkbox-group>
+ </div>
+ </div>
+ <div class="items">
+ <div class="lable">
+ <p>鐧藉悕鍗� ></p>
+ </div>
+ <div class="baseList">
+ <el-checkbox-group
+ v-model="BaseManageData.selectWhites"
+ @change="blackAngWhite"
+ :max="1"
+ >
+ <div class="base" v-for="(item, index) in BaseManageData.whiteList" :key="index">
+ <el-checkbox
+ :label="item.value"
+ :title="item.title"
+ :disabled="item.disabled"
+ >{{item.title}}</el-checkbox>
+ </div>
+ </el-checkbox-group>
+ </div>
+ </div>
+ </div>
+ <div slot="footer" class="dialog-footer">
+ <el-button size="small" @click="moveClose" type="info">鍙� 娑�</el-button>
+ <el-button size="small" type="primary" @click="moveSubmit()">纭� 瀹�</el-button>
+ </div>
+ </el-dialog>
+ </div>
+</template>
+<script>
+import { updateBasePerson, deleteBasePersons } from "@/api/baseLibrary";
+import axios from "axios";
+// import { findByType } from '@/server/video.js'
+import Upload from "./upload";
+import fTemplate from "@/components/fTemplate";
+import UploadIcon from "@/components/searching/UploadIcon.vue";
+export default {
+ data() {
+ return {
+ dialogFormVisible: false,
+ copyVisiabled: false,
+ moveVisiabled: false,
+ buttonAuthority: sessionStorage.getItem("buttonAuthoritys") || [],
+ searchName: "",
+ current: 1,
+ compare: false,
+ pageSize: 10,
+ total: 0,
+ orderType: "desc",
+ orderName: "id",
+ contentValue: "",
+ visible: false,
+ selectedRowKeys: [],
+ form: {
+ id: "",
+ sex: "鐢�",
+ personName: "鍛靛懙鍛�",
+ tableId: "",
+ picDesc: "",
+ idCard: "12312938102143253",
+ phoneNum: "18712766787",
+ monitorLevel: "one",
+ faceUrl: "group2/M00/0A/D7/wKgBnFyjH0-AUE5eAAC8hSMP2Yw110.jpg",
+ enable: 0,
+ reserved: ""
+ },
+ rules: {
+ picDesc: [
+ { required: true, message: "璇疯緭鍏ョ収鐗囨爣璇�", trigger: "submit" }
+ ],
+ sex: [{ required: true, message: "璇峰嬀閫夋�у埆", trigger: "submit" }],
+ monitorLevel: [
+ { required: true, message: "璇烽�夋嫨浜哄憳绛夌骇", trigger: "submit" }
+ ]
+ },
+ tableData: [],
+ tableHeight: window.innerHeight - 320,
+ multipleSelection: [],
+ peoperLevel: [],
+ oldWidth: "",
+ oldHeight: "",
+ // 涓婁紶鍚庣殑寮规鏄剧ず
+ dialogVisible: false,
+ // 鎵归噺涓婁紶鍚庣殑杩斿洖缁撴灉
+ uploadResult: { failList: [], successList: [], multiFaceList: [], noFaceList: [] }
+ };
+ },
+ computed: {
+ isAdmin() {
+ if (
+ sessionStorage.getItem('userInfo') &&
+ sessionStorage.getItem('userInfo') !== ''
+ ) {
+ let loginName = JSON.parse(sessionStorage.getItem('userInfo')).username
+ return (
+ loginName === 'superadmin' || loginName === 'basic'
+ )
+ }
+ return false;
+ }
+ },
+ methods: {
+ isShow(authority) {
+ if (this.isAdmin) {
+ return true
+ } else if (
+ this.buttonAuthority.indexOf(',' + authority + ',') > -1
+ ) {
+ return true
+ } else {
+ return false
+ }
+ },
+ toggleSelection(rows) {
+ if (rows) {
+ rows.forEach(row => {
+ this.$refs.multipleTable.toggleRowSelection(row);
+ });
+ } else {
+ this.$refs.multipleTable.clearSelection();
+ }
+ },
+ deleteThis(id) {
+ let token =
+ sessionStorage.getItem("loginedInfo") &&
+ JSON.parse(sessionStorage.getItem("loginedInfo")).access_token;
+ this.$confirm("鎻愮ず锛氱‘瀹氬垹闄よ搴曞簱浜哄憳锛�", {
+ center: true,
+ cancelButtonClass: "comfirm-class-cancle",
+ confirmButtonClass: "comfirm-class-sure"
+ })
+ .then(_ => {
+ fetch(`/data/api-v/dbperson/deleteDbPersonById/${id}`, {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json",
+ Authorization: token
+ }
+ })
+ .then(res => {
+ return res.json();
+ })
+ .then(data => {
+ // console.log(data.data);
+ if (data.success) {
+ this.$notify({
+ type: "success",
+ message: "璇ヤ汉鍛樺垹闄ゆ垚鍔燂紒"
+ });
+ }
+ this.getPersonList();
+ })
+ .catch(err => {
+ console.log(err);
+ });
+ })
+ .catch(_ => { });
+ },
+ sayHello() {
+ console.log("hello");
+ },
+ getUploadResult(result) {
+ console.log(result, "涓婁紶鐨勮繑鍥�");
+ this.uploadResult = result.data;
+ this.dialogVisible = true;
+ this.getPersonList();
+ },
+ async getPersonList() {
+ // console.log("鎵ц浜嗗埛鏂板嚱鏁�", this.BaseManageData.syncTables[0]);
+ if (this.baseObject.id && this.baseObject.id !== undefined) {
+ // console.log("搴曞簱id", this.baseObject.id);
+ this.BaseManageData.tableId = this.baseObject.id;
+ // this.BaseManageData.queryPersonList();
+ this.setLoadSearch(this.BaseManageData.queryPersonList())
+ }
+ },
+ changeDialog(data) {
+ data.erFileList.map((item, index) => {
+ this.$notify({
+ type: "error",
+ message: item.errorMsg.message
+ });
+ });
+ },
+ handleClose() {
+ //this.getPersonList();
+ this.dialogFormVisible = false;
+ },
+ handleSelectionChange(val) {
+ this.selectedRowKeys = val;
+ },
+ refrash(current, pageSize) {
+ this.current = current;
+ this.BaseManageData.page = current;
+ this.getPersonList();
+ },
+ handleClick(row) {
+ this.form = row;
+ this.dialogFormVisible = true;
+ },
+ async submit() {
+ this.$refs["formForEdit"].validate(async valid => {
+ // console.log("閫氳繃楠岃瘉", valid);
+ if (valid) {
+ let { ...json } = this.form;
+ delete (json["compareScore"])
+ // console.log("淇敼鐨勫弬鏁帮細", json);
+ let res = await updateBasePerson(json);
+ // console.log("淇濆瓨浜�", res);
+ if (res.success) {
+ this.$notify({
+ type: "success",
+ message: "浜哄憳淇敼鎴愬姛锛�"
+ });
+ this.dialogFormVisible = false;
+ } else {
+ this.$notify({
+ type: "error",
+ message: "浜哄憳淇敼澶辫触锛岃閲嶈瘯锛侊紒"
+ });
+ }
+ } else {
+ return false;
+ }
+ });
+ },
+ confirm() {
+ this.$confirm({
+ title: "Confirm",
+ content: "Bla bla ...",
+ okText: "纭",
+ cancelText: "鍙栨秷"
+ });
+ },
+ async enable(item) {
+ let res = await updateBasePerson({
+ id: item.id,
+ enable: item.enable,
+ sex: item.sex,
+ personName: item.personName,
+ picDesc: item.picDesc,
+ idCard: item.idCard,
+ phoneNum: item.phoneNum,
+ monitorLevel: item.monitorLevel,
+ personPicUrl: item.personPicUrl,
+ reserved: item.reserved
+ });
+ if (res.success === true) {
+ this.$notify({
+ type: "success",
+ message: "搴曞簱浜哄憳鎴愬姛鍙樻洿鐢熸晥鐘舵�侊紒"
+ });
+ } else {
+ this.$notify({
+ type: "error",
+ message: "搴曞簱浜哄憳鍙樻洿鐢熸晥鐘舵�佸け璐ワ紒"
+ });
+ }
+ },
+ handleSearch() {
+ this.getPersonList();
+ },
+ searchImg() {
+ this.$refs.uploadDrag && this.$refs.uploadDrag.uploadStart();
+ },
+ haveScore(row) {
+ if (row.compareScore && row.compareScore !== "") {
+ return true
+ } else {
+ return false
+ }
+ },
+ async searchImgList(faceUrl, threshold) {
+ // console.log("鎼滃浘鍙傛暟", faceUrl, threshold);
+ let json = {
+ tableId: this.baseObject.id,
+ page: this.current,
+ size: this.pageSize,
+ faceUrl: faceUrl,
+ threshold: threshold,
+ orderType: this.orderType,
+ orderName: this.orderName
+ };
+ let res = await getPersonByPhoto(json);
+ // console.log("鍒楄〃鏌ヨ", json);
+ this.tableData = res.data.datalist;
+ this.total = res.data.total;
+ this.compare = true;
+ },
+ updateThreshold() { },
+ async updateFace(param) {
+ const fd = new FormData();
+ fd.append("file", param.file);
+ fd.append("id", this.form.id);
+ // console.log("鎹㈣劯浜嗗悧", fd);
+ let res = await axios({
+ method: "post",
+ url: `/data/api-v/dbperson/updateFace`,
+ headers: {
+ 'Authorization': sessionStorage.getItem('loginedInfo') && JSON.parse(sessionStorage.getItem('loginedInfo')).access_token
+ },
+ data: fd
+ });
+ if (res.data.success) {
+ this.form.personPicUrl = res.data.data.personPicUrl;
+ this.form.faceFeature = res.data.data.faceFeature;
+ }
+ },
+ uploadSuccess() {
+ console.log("鎹㈣劯鎴愬姛浜�");
+ },
+ uploadError() {
+ console.log("鎹㈣劯澶辫触浜�");
+ },
+ deleteBatch() {
+ // console.log('瑕佸垹闄ょ殑', this.selectedRowKeys.length)
+ if (this.selectedRowKeys.length === 0) {
+ this.$notify({
+ type: "warning",
+ message: "璇烽�夋嫨瑕佸垹闄ょ殑浜哄憳"
+ });
+ } else {
+ this.$confirm("鎻愮ず锛氱‘瀹氬垹闄よ搴曞簱閫変腑浜哄憳锛�", {
+ center: true,
+ cancelButtonClass: "comfirm-class-cancle",
+ confirmButtonClass: "comfirm-class-sure"
+ }).then(async _ => {
+ let ids = [];
+ this.selectedRowKeys.map((item, index) => {
+ ids.push(item.id);
+ });
+ // console.log('鎵归噺鍒犻櫎鏁扮粍', ids)
+ let res = await deleteBasePersons(ids);
+ // console.log(res, '鎵归噺鍒犻櫎缁撴灉')
+ if (res.success) {
+ this.$notify({
+ type: "success",
+ message: "鍒犻櫎鎴愬姛锛�"
+ });
+ this.getPersonList();
+ } else {
+ this.$notify({
+ type: "error",
+ message: "鍒犻櫎澶辫触锛�"
+ });
+ }
+ });
+ }
+ },
+ async init() {
+ await this.BaseManageData.querySyncTables();
+ await this.BaseManageData.queryLocalTables();
+ if (this.baseObject.id && this.baseObject.id !== undefined) {
+ // console.log("one;", this.baseObject.id);
+ } else if (
+ this.BaseManageData.syncTables[0].id &&
+ this.BaseManageData.syncTables[0].id !== undefined
+ ) {
+ this.BaseManageData.tableId = this.BaseManageData.syncTables[0].id;
+ this.BaseManageData.queryPersonList();
+ } else {
+ this.BaseManageData.tableId = this.BaseManageData.localTables[0].id;
+ this.BaseManageData.queryPersonList();
+ }
+ },
+ handleRowStyle({ row, rowIndex }) {
+ // console.log(row, rowIndex, "handleRowStyle");
+ if (rowIndex === 0) {
+ return "background:#222222;";
+ }
+ },
+ blackAngWhite() {
+ if (this.BaseManageData.selectBlacks.length > 0) {
+ for (let i = 0; i < this.BaseManageData.whiteList.length; i++) {
+ //this.VideoPhotoData.whiteList[i].disabled = true
+ this.$set(this.BaseManageData.whiteList[i], 'disabled', true)
+ }
+ }
+ if (this.BaseManageData.selectBlacks.length == 0) {
+ for (let i = 0; i < this.BaseManageData.whiteList.length; i++) {
+ //this.VideoPhotoData.whiteList[i].disabled = false
+ this.$set(this.BaseManageData.whiteList[i], 'disabled', false)
+ }
+ }
+ if (this.BaseManageData.selectWhites.length > 0) {
+ for (let i = 0; i < this.BaseManageData.blackList.length; i++) {
+ // this.VideoPhotoData.blackList[i].disabled = true
+ this.$set(this.BaseManageData.blackList[i], 'disabled', true)
+ }
+ }
+ if (this.BaseManageData.selectWhites.length == 0) {
+ for (let i = 0; i < this.BaseManageData.blackList.length; i++) {
+ //this.VideoPhotoData.blackList[i].disabled = false
+ this.$set(this.BaseManageData.blackList[i], 'disabled', false)
+ }
+ }
+ },
+ tosearch(item) {
+ // console.log("璺宠浆鍦板潃", item)
+ var curWwwPath = window.document.location.href;
+ var pathname = window.document.location.pathname;
+ var pos = curWwwPath.indexOf(pathname);
+ var localhostPath = curWwwPath.substring(0, pos); //ip+port
+ var href = localhostPath + "/Layout/Searching"
+ let captureId = item.id == "" ? item.personId : item.id
+ var url = item.personPicUrl ? item.personPicUrl : item.personPicUrl
+ // console.log("璺宠浆鍦板潃",href,"url",url)
+ var compType = 0
+ window.open(href + '?showType=findByPic&targetId=' + captureId + '&picSmUrl=' + url + '&compType=' + compType)
+ },
+ copyClick(row) {
+ this.BaseManageData.personId = row.id
+ this.copyVisiabled = true
+ },
+ moveClick(row) {
+ this.BaseManageData.personId = row.id
+ this.moveVisiabled = true
+ },
+ copyClose() {
+ this.copyVisiabled = false
+ this.BaseManageData.personId = ""
+ this.BaseManageData.selectBlacks = []
+ this.BaseManageData.selectWhites = []
+ },
+ moveClose() {
+ this.moveVisiabled = false
+ this.BaseManageData.personId = ""
+ this.BaseManageData.selectBlacks = []
+ this.BaseManageData.selectWhites = []
+ },
+ copySubmit() {
+ if (this.BaseManageData.selectBlacks.length === 0 && this.BaseManageData.selectWhites.length === 0) {
+ this.$notify({
+ title: "娉ㄦ剰",
+ message: "璇烽�夋嫨瑕佸鍒跺埌鐨勫簱",
+ type: "warning"
+ })
+ return
+ }
+ var resp = this.BaseManageData.copyTo()
+ resp.then(data => {
+ if (data.success) {
+ this.$notify({
+ title: "鎴愬姛",
+ message: data.data,
+ type: "success"
+ })
+ } else {
+ this.$notify({
+ title: "澶辫触",
+ message: data.data,
+ type: "error"
+ })
+ }
+ })
+ this.copyVisiabled = false
+ this.BaseManageData.personId = ""
+ this.BaseManageData.selectBlacks = []
+ this.BaseManageData.selectWhites = []
+ },
+ moveSubmit() {
+ if (this.BaseManageData.selectBlacks.length === 0 && this.BaseManageData.selectWhites.length === 0) {
+ this.$notify({
+ title: "娉ㄦ剰",
+ message: "璇烽�夋嫨瑕佺Щ鍔ㄥ埌鐨勫簱",
+ type: "warning"
+ })
+ return
+ }
+ var resp = this.BaseManageData.moveTo()
+ resp.then(data => {
+ if (data.success) {
+ this.$notify({
+ title: "鎴愬姛",
+ message: data.data,
+ type: "success"
+ })
+ } else {
+ this.$notify({
+ title: "澶辫触",
+ message: data.data,
+ type: "error"
+ })
+ }
+ this.moveVisiabled = false
+ this.BaseManageData.personId = ""
+ this.BaseManageData.selectBlacks = []
+ this.BaseManageData.selectWhites = []
+ this.BaseManageData.queryPersonList()
+ })
+ },
+ setLoadSearch(fn) {
+ this.AuthData.setLoading("multipleTable", this);
+ fn.then(_ => {
+ this.AuthData.closeLoad();
+ })
+ }
+ },
+ mounted() {
+ this.getPersonList();
+ this.VideoPhotoData.queryDictionary();
+ this.BaseManageData.queryTagList();
+ this.oldWidth = document.body.clientWidth;
+ this.oldHeight = document.body.clientHeight;
+ this.blackAngWhite();
+ window.onresize = () => {
+ let width = document.body.clientWidth;
+ let height = document.body.clientHeight;
+ // console.log(width, height, "绐楀彛鍙樺寲瀵规瘮", this.oldWidth, this.oldHeight);
+ if (width !== this.oldWidth && width < 1750) {
+ }
+ this.$nextTick(() => {
+ this.$refs.multipleTable.doLayout();
+ });
+ };
+ this.$nextTick(() => {
+ this.$refs.multipleTable.doLayout();
+ });
+ },
+ beforeDestroy() {
+ window.onresize = null;
+ },
+ watch: {
+ baseObject: {
+ handler(newVal, oldVal) {
+ // console.log(newVal, "鐩戝惉baseObject");
+ this.BaseManageData.cleanData();
+ this.getPersonList();
+ },
+ deep: true
+ },
+ "BaseManageData.selectBlacks": function (value) {
+ this.blackAngWhite()
+ },
+ "BaseManageData.selectWhites": function (value) {
+ this.blackAngWhite()
+ },
+ },
+ components: {
+ // httpImg,
+ Upload,
+ fTemplate,
+ UploadIcon
+ },
+ props: {
+ baseObject: {
+ default: () => { },
+ type: Object
+ }
+ }
+};
+</script>
+<style lang="scss">
+.iconStyle1 {
+ font-size: 16px;
+ margin-left: 8px;
+ cursor: pointer;
+ color: #303133;
+}
+.activeRow {
+ background: rgb(245, 247, 250);
+}
+.cursor-pointer {
+ cursor: pointer;
+}
+.el-table {
+ position: relative;
+ overflow: hidden;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+ -webkit-box-flex: 1;
+ -ms-flex: 1;
+ flex: 1;
+ width: auto;
+ max-width: none;
+ font-size: 14px;
+ color: #606266;
+ thead {
+ background: green !important;
+ }
+}
+.avatar-uploader:hover {
+ .mask1 {
+ display: block;
+ }
+}
+.mask1 {
+ position: absolute;
+ width: 150px;
+ height: 150px;
+ background: rgba(0, 0, 0, 0.35);
+ backdrop-filter: blur(1px) brightness(100%);
+ text-align: center;
+ z-index: 1;
+ border-radius: 3px;
+ display: none;
+}
+.table-parent {
+ // position: relative;
+ height: 90%;
+ overflow: visible !important;
+}
+
+.text-left {
+ .el-upload-list {
+ display: none;
+ }
+}
+.border-tabl {
+ border: 1px solid #ebeef5;
+ border-bottom: none;
+ // border-bottom: none;
+}
+.el-dialog__header {
+ padding: 20px 0 10px;
+ text-align: left;
+ -webkit-box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.07);
+ box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.07);
+}
+.el-dialog__title {
+ line-height: 20px;
+ font-size: 15px;
+ margin-left: 10px;
+ color: #303133;
+}
+.el-dialog__body {
+ padding: 30px 20px 20px 20px;
+ color: #606266;
+ font-size: 14px;
+ word-break: break-all;
+}
+.dialog-footer {
+ text-align: center;
+}
+.comfirm-class-sure {
+ background: #f53d3d;
+ border-radius: 2px;
+ outline: none;
+ color: #fff;
+ background-color: #f53d3d;
+ border-color: #f53d3d;
+ font-family: PingFangSC-Regular;
+ font-size: 13px;
+ color: #ffffff;
+ text-align: center;
+}
+.comfirm-class-cancle {
+ background: #eaeaea;
+ border-radius: 2px;
+ outline: none;
+ color: #fff;
+ background-color: #eaeaea;
+ border-color: #eaeaea;
+ font-family: PingFangSC-Regular;
+ font-size: 13px;
+ color: #222222;
+ text-align: center;
+}
+
+.el-table .cell {
+ padding-left: 8px !important;
+ padding-right: 0px !important;
+}
+.addToBase1 {
+ width: 98%;
+ height: 350px;
+ position: relative;
+ .topLabel {
+ margin-top: 20px;
+ height: 40px;
+ border-bottom: 1px solid #eee;
+ font-family: PingFangSC-Medium;
+ font-size: 20px;
+ font-weight: 600;
+ line-height: 1rem;
+ color: #222222;
+ text-align: left;
+ margin-left: 15px;
+ }
+ .items {
+ width: 100%;
+ height: auto;
+ max-height: 35%;
+ overflow-y: auto;
+ margin: 20px 0px;
+ .lable {
+ width: 15%;
+ margin-top: 10px;
+ float: left;
+ //font-family: PingFangSC-Medium;
+ font-size: 14px;
+ font-weight: 600;
+ }
+ .baseList {
+ width: 85%;
+ height: 100%;
+ float: left;
+ .base {
+ width: calc(33% - 10px);
+ padding: 0px 5px;
+ line-height: 30px;
+ float: left;
+ text-align: left;
+ font-size: 12px !important;
+ .el-checkbox {
+ width: 100%;
+ display: block;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ .el-checkbox__label {
+ display: inline !important;
+ }
+ }
+ }
+ }
+ }
+}
+.copy,
+.move {
+ .el-dialog__body {
+ padding: 0px !important;
+ }
+}
+
+.avatar-uploader {
+ max-width: 150px;
+ min-width: 150px;
+ min-height: 152px;
+ border: 1px solid #eee;
+}
+</style>
diff --git a/src/pages/library/components/upload.vue b/src/pages/library/components/upload.vue
new file mode 100644
index 0000000..37e34e2
--- /dev/null
+++ b/src/pages/library/components/upload.vue
@@ -0,0 +1,483 @@
+<template>
+ <span class="upload-content pr">
+ <el-button
+ type="primary"
+ :loading="upLoadLoading"
+ :size="uploadBtnSize"
+ data-style="slide-down"
+ @click.native="uploadStart"
+ >
+ <i :class="uploadBtnIcon"></i>
+ {{uploadBtntext}}
+ </el-button>
+ <div class="upload-progress" v-if="isShowProgress">
+ <b-progress
+ variant="warning"
+ striped
+ :style="`opacity: ${isShowProgress&&showProgress?1:0}`"
+ :value="progressValue"
+ height="5px"
+ />
+ </div>
+ <input type="file" ref="fileInput" multiple @change="clickUpLoad" />
+ <div class="drag-area py-4 px-4" v-show="isShowBox">
+ <div
+ ref="drag_area"
+ :class="['text-center files-area py-4 px-4',drag_class]"
+ @click="uploadStart('fileInput')"
+ @dragover="dragover($event)"
+ @drop="drop($event)"
+ @dragenter="dragenter($event)"
+ @dragleave="dragleave($event)"
+ >
+ <i class="el-icon-upload text-primary" style="color:rgb(61, 104, 225)"></i>
+ <div class="el-upload__text" style="color:#babbbc!important">
+ 灏嗘枃浠舵嫋鍒版澶勶紝鎴�
+ <em class="text-primary cursor-pointer">鐐瑰嚮涓婁紶</em>
+ </div>
+ <div
+ class="el-upload__tip text-light"
+ style="color:#babbbc!important"
+ >{{limitTypes?`鍙兘涓婁紶${limitTypes}鏂囦欢`:''}}{{limitSize?` 鏂囦欢澶у皬涓嶈秴杩�${limitSize}`:''}}</div>
+ </div>
+ </div>
+ <div class="upload-model" v-show="isShowBox" @click="isShowBox=false"></div>
+ </span>
+</template>
+<script>
+import axios from 'axios'
+import { guid } from './util.js'
+
+export default {
+ name: 'upload',
+ props: {
+ /* 涓婁紶鎺т欢鍒楄〃鏄惁鍒犻櫎鍔熻兘 */
+ isDelFile: {
+ default: true,
+ type: Boolean
+ },
+ /* 绫诲瀷闄愬埗锛堝悗缂�鍚�,鍒嗛殧锛� 浼犲叆绀轰緥'.png,.jpg' 涓嶉檺鍒朵负 '' */
+ limitTypes: {
+ default: '',
+ type: String
+ },
+ /* 鏂囦欢澶у皬闄愬埗 浼犲叆绀轰緥'1M' 鍗曚綅鏀寔G銆丮銆並銆丅 鏃犲崟浣嶆寜B璁＄畻 涓嶉檺鍒朵负 '' */
+ limitSize: {
+ default: '5M',
+ type: String
+ },
+ /* 涓婁紶鎸夐挳鏂囧瓧 */
+ uploadBtntext: {
+ default: '涓婁紶',
+ type: String
+ },
+ /* 涓婁紶鎸夐挳icon */
+ uploadBtnIcon: {
+ default: 'ion ion-md-cloud-upload',
+ type: String
+ },
+ uploadBtnSize: {
+ default: '',
+ type: String
+ },
+ uploadBtnStyle: {
+ default: '',
+ type: String
+ },
+ uploadBtnClass: {
+ default: 'btn btn-primary',
+ type: String
+ },
+ isShowProgress: {
+ default: false,
+ type: Boolean
+ },
+ isDrag: {
+ default: false,
+ type: Boolean
+ },
+ idJson: {
+ default: null,
+ type: Object
+ }
+ /**
+ * 涓婁紶缁勪欢鍥炲�兼柟娉�
+ * @description 涓婁紶缁勪欢鍥炲�兼柟娉�
+ * @return { function } addFilesBaBackFN 娣诲姞涓婁紶鎴愬姛鍚庤繑鍥� {fileIds,fileList}
+ */
+ },
+ data() {
+ return {
+ isShowBox: false,
+ drag_class: '',
+ fileList: [],
+ erFileList: [],
+ suFileList: [],
+ fileIds: [],
+ upLoadLoading: false,
+ showProgress: false,
+ progressValue: 0
+ }
+ },
+ computed: {},
+ methods: {
+ islimitTypes(fileObj) {
+ if (this.limitTypes === '') {
+ return 'success'
+ }
+ if (
+ this.limitTypes.indexOf(
+ fileObj.name.toLowerCase().replace(/^.+\./, '')
+ ) === -1
+ ) {
+ const msg = {
+ type: 'error',
+ errorType: '涓婁紶绫诲瀷閿欒',
+ message:
+ /* ${fileObj && fileObj.name ? '鈥�' + fileObj.name + '鈥�' : ''} */
+ `涓婁紶鏂囦欢蹇呴』鏄�${this.limitTypes},璇锋偍鏍告煡`
+ }
+ // this.$notify(msg)
+ return msg
+ }
+ return 'success'
+ },
+ islimitSize(fileObj) {
+ if (this.limitSize === '') {
+ return 'success'
+ }
+ let size = 0
+ if (this.limitSize.indexOf('G') !== -1) {
+ size = this.limitSize.replace('G', '') * 1024 * 1024 * 1024
+ } else if (this.limitSize.indexOf('M') !== -1) {
+ size = this.limitSize.replace('M', '') * 1024 * 1024
+ } else if (this.limitSize.indexOf('K') !== -1) {
+ size = this.limitSize.replace('K', '') * 1024
+ } else if (this.limitSize.indexOf('B') !== -1) {
+ size = this.limitSize.replace('B', '')
+ } else {
+ size = this.limitSize
+ }
+ if (size < fileObj.size) {
+ const msg = {
+ type: 'error',
+ errorType: '涓婁紶澶у皬閿欒',
+ message:
+ `${
+ fileObj && fileObj.name ? '鈥�' + fileObj.name + '鈥�' : ''
+ }蹇呴』灏忎簬` + this.limitSize
+ }
+ // this.$notify(msg)
+ return msg
+ }
+ return 'success'
+ },
+ uploadStart(type) {
+ this.$refs.fileInput.value = ''
+ this.fileList = []
+ this.erFileList = []
+ this.suFileList = []
+ if (this.isDrag && type !== 'fileInput') {
+ this.isShowBox = !this.isShowBox
+ } else {
+ this.$refs.fileInput.click()
+ }
+ },
+ /* 鐐瑰嚮涓婁紶 */
+ clickUpLoad(e) {
+ if (e.target && e.target.files) {
+ this.handleUpLoad(e.target.files)
+ }
+ },
+ // 涓婁紶闄勪欢
+ handleUpLoad(files) {
+ // 鍒ゆ柇鏄惁閫夋嫨搴曞簱
+ // console.log(this.idJson, 'upload this.idJson')
+ if (this.idJson.tableId === undefined || this.idJson.tableId === '') {
+ this.$notify({
+ type: 'error',
+ message: '璇峰厛閫夋嫨涓�涓簳搴�!'
+ })
+ return
+ }
+ /* 鎷垮埌涓婁紶鏂囦欢 */
+ if (files.length === 0) {
+ return false
+ }
+ this.fileList = [...files]
+ /* 閲嶇疆杩涘害鏉� */
+ this.showProgress = true
+ this.progressValue = 0
+ /* 寮�鍚笂浼犳寜閽甽oding */
+ this.upLoadLoading = true
+ /* 鍒涘缓FormData鏂囦欢瀵硅薄 */
+ const fd = new FormData()
+ this.fileList.map((file, index) => {
+ /* 鏂囦欢鏍￠獙 start */
+ const islimitTypes = this.islimitTypes(file)
+ const islimitSize = this.islimitSize(file)
+ if (islimitTypes !== 'success') {
+ this.erFileList.push({
+ uuId: guid(),
+ file: file,
+ errorMsg: islimitTypes
+ })
+ return false
+ }
+ if (islimitSize !== 'success') {
+ this.erFileList.push({
+ uuId: guid(),
+ file: file,
+ errorMsg: islimitSize
+ })
+ return false
+ }
+ this.suFileList.push(file)
+ /* 鏂囦欢鏍￠獙 end */
+ // fd.append('files' + index, file)
+ fd.append('files', file)
+ })
+ // fd.append('files', this.suFileList)
+ /* 娣诲姞tableId start */
+ if (this.idJson && this.idJson.tableId) {
+ console.log(this.idJson, 'upload this.idJson')
+ fd.append('tableId', this.idJson.tableId)
+ }
+ /* 娣诲姞orgId officeId end */
+ // fd.append('fileSource', 'FDFS')
+ if (this.fileList.length > this.erFileList.length) {
+ this.uploadServer(fd)
+ } else {
+ /* 鍥炶皟浼犲�� */
+ this.$emit('addFilesBaBackFN', {
+ suFileList: this.suFileList,
+ erFileList: this.erFileList,
+ fileList: this.fileList,
+ result: null
+ })
+ /* 缁撴潫涓婁紶鎸夐挳loding */
+ this.upLoadLoading = false
+ /* 闅愯棌鎷栨嫿妗� */
+ this.isShowBox = false
+ }
+ },
+ async uploadServer(fd) {
+ // this.$store.commit('HANDLE_LOADING_OPEN')
+ const token = JSON.parse(
+ sessionStorage.getItem('loginedInfo')
+ ).access_token
+ try {
+ let res = await axios({
+ method: 'post',
+ url: `/data/api-v/dbperson/moreFileUpload`,//?access_token=${token}
+ data: fd,
+ name: 'files',
+ headers: {
+ Authorization: token
+ },
+ onUploadProgress: progressEvent => {
+ if (
+ this.isShowProgress &&
+ progressEvent.loaded &&
+ progressEvent.total
+ ) {
+ this.progressValue =
+ (progressEvent.loaded / progressEvent.total) * 100
+ }
+ }
+ })
+ if (res && res.data) {
+ const result = res.data
+ // this.$notify({
+ // type: result && result.success ? 'success' : 'error',
+ // message: result.msg
+ // })
+ this.progressValue = 0
+ this.showProgress = false
+ this.$emit('successFN', result)
+ // let errorArr = []
+ // // 鏍规嵁涓庡悗鍙扮害瀹歞ata鏁扮粍杩斿洖鐨勯兘鏄瓨鍦ㄤ笟鍔℃剰涔夐敊璇殑瀵硅薄
+ // if (result.data && result.data.length) {
+ // errorArr = result.data.map(file => {
+ // // 閬嶅巻鍓嶅彴鎶涚粰鍚庡彴鐨刦ileList 杩涜姣斿璧嬪�糵ile鏂囦欢鍙妋essage
+ // for (var i = 0; i < this.suFileList.length; i++) {
+ // const iteam = this.suFileList[i]
+ // if (
+ // file.upload.fileName &&
+ // iteam.name === file.upload.fileName
+ // ) {
+ // return {
+ // uuId: guid(),
+ // file: iteam,
+ // photos: file.upload.path,
+ // baseList: file.baseList ? file.baseList : null,
+ // errorMsg: {
+ // type: 'error',
+ // errorType: '涓婁紶寮傚父',
+ // message: file.reason ? file.reason : result.msg
+ // }
+ // }
+ // }
+ // }
+ // })
+ // }
+ /* 鍥炶皟浼犲�� */
+ // 澶勭悊閿欒鏂囦欢鍒楄〃 濡傛灉涓�0璇存槑鍏ㄩ儴鎴愬姛锛岋紙閫氳繃鏍￠獙锛屽苟鍦ㄥ悗鍙版垚鍔熷畬鎴愭敞鍐屾坊鍔狅級
+ // let erFileList =
+ // result && result.success
+ // ? this.erFileList
+ // : [...this.erFileList, ...errorArr]
+ // // 鍏ㄩ儴鎴愬姛鏃犻渶鎵撳紑涓氬姟寮圭獥
+ // if (erFileList.length > 0) {
+ // this.$emit('addFilesBaBackFN', {
+ // suFileList: result && result.success ? this.suFileList : [],
+ // erFileList: erFileList,
+ // fileList: this.fileList,
+ // result: res
+ // })
+ // }
+ // if (erFileList.length === 0) {
+ // this.$emit('successFN')
+ // }
+ }
+ } catch (error) {
+ // this.$notify({
+ // type: 'error',
+ // message: '鏈嶅姟鍣ㄩ敊璇紒璇疯仈绯荤鐞嗗憳' // + error.message
+ // })
+ this.progressValue = 0
+ this.showProgress = false
+ console.log('catch---', error)
+ const errorArr = this.suFileList.map(file => {
+ return {
+ uuId: guid(),
+ file: file,
+ errorMsg: {
+ type: 'error',
+ errorType: '涓婁紶鏈嶅姟鍣ㄩ敊璇�',
+ message: '鍥剧墖涓嶆槸鍗曚汉鑴哥収鐗囷紝璇烽噸鏂颁笂浼�'
+ }
+ }
+ })
+ this.erFileList = [...this.erFileList, ...errorArr]
+ /* 鍥炶皟浼犲�� */
+ this.$emit('addFilesBaBackFN', {
+ suFileList: [],
+ erFileList: this.erFileList,
+ fileList: this.fileList,
+ result: error
+ })
+ }
+ //this.$store.commit('HANDLE_LOADING_CLOSE')
+ /* 缁撴潫涓婁紶鎸夐挳loding */
+ this.upLoadLoading = false
+ /* 闅愯棌鎷栨嫿妗� */
+ this.isShowBox = false
+ },
+ /* 鎷栨嫿鍑芥暟 start */
+ dragleave(el) {
+ this.drag_class = ''
+ el.stopPropagation()
+ el.preventDefault()
+ },
+ dragenter(el) {
+ this.drag_class = 'active'
+ el.stopPropagation()
+ el.preventDefault()
+ },
+ dragover(el) {
+ this.drag_class = 'active'
+ el.stopPropagation()
+ el.preventDefault()
+ },
+ drop(el) {
+ el.stopPropagation()
+ el.preventDefault()
+ if (el.dataTransfer && el.dataTransfer.files) {
+ this.handleUpLoad(el.dataTransfer.files)
+ }
+ }
+ /* 鎷栨嫿鍑芥暟 end */
+ },
+ created() { },
+ watch: {
+ progressValue(newVal, oldVal) {
+ if (newVal !== oldVal && newVal >= 100) {
+ setTimeout(() => {
+ this.showProgress = false
+ this.progressValue = 0
+ }, 1500)
+ }
+ }
+ },
+ components: {
+ //LaddaBtn
+ }
+}
+</script>
+
+<style lang="scss" scoped>
+.upload-img-icon {
+ width: 60px;
+ background-size: 100%;
+ background-repeat: no-repeat;
+ background-position: center;
+}
+.upload-progress {
+ width: 96%;
+ position: absolute;
+ left: 2px;
+ bottom: 2px;
+ opacity: 1;
+ transition: all 0.5s;
+}
+.upload-content {
+ position: relative;
+ input[type="file"] {
+ position: absolute;
+ opacity: 0;
+ width: 82px;
+ height: 38px;
+ left: 0;
+ display: none;
+ }
+}
+.drag-area {
+ position: absolute;
+ z-index: 100 !important;
+ width: 320px;
+ height: 160px;
+ padding: 20px;
+ right: 0;
+ top: 35px;
+ z-index: 5;
+ background: #f1f1f1;
+ border-radius: 5px;
+ .files-area {
+ width: 100%;
+ height: 100%;
+ background: #fff;
+ border: 1px dashed #d9d9d9;
+ border-radius: 5px;
+ }
+ .files-area.active {
+ border: 2px dashed #35bde7;
+ }
+ .files-area:hover {
+ border: 1px dashed #35bde7;
+ }
+ .el-icon-upload {
+ font-size: 80px;
+ margin-top: 20px;
+ }
+}
+.upload-model {
+ position: fixed;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ z-index: 99;
+ background: rgba(0, 0, 0, 0.2);
+}
+</style>
diff --git a/src/pages/library/components/util.js b/src/pages/library/components/util.js
new file mode 100644
index 0000000..19cd19d
--- /dev/null
+++ b/src/pages/library/components/util.js
@@ -0,0 +1,268 @@
+// 鐢ㄤ簬鐢熸垚uuid
+const S4 = () => {
+ return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1)
+}
+const guid = () => {
+ return (S4() + S4() + '-' + S4() + '-' + S4() + '-' + S4() + '-' + S4() + S4() + S4())
+}
+/* http 浼犲弬鏂规硶json2url, json2path, json2formData, */
+const json2url = (json) => {
+ if (!json) {
+ return false
+ }
+ var arr = []
+ for (var name in json) {
+ arr.push(name + '=' + json[name])
+ }
+ var str = arr.join('&')
+ return str
+}
+const json2path = (json) => {
+ if (!json) {
+ return false
+ }
+ var arr = []
+ for (var name in json) {
+ arr.push(json[name])
+ }
+ var str = arr.join('/')
+ return str
+}
+const json2formData = (json) => { // Content-Type: multipart/form-data;boundary=${bound} //浠ｈ〃鍒嗗壊绗﹀彿
+ if (!json) {
+ return false
+ }
+ const _opts = new FormData()
+ for (var name in json) {
+ _opts.append(name, json[name])
+ }
+ return _opts
+}
+
+const findRouersFn = (rouers, path) => {
+ if (rouers) {
+ for (let iteam of rouers) {
+ if (iteam.url === path) {
+ return iteam
+ }
+ }
+ }
+ return false
+}
+/* 鑾峰彇褰撳墠璺敱淇℃伅 */
+const thisRouterObjFn = (routesArr) => {
+ if (!routesArr && !Array.isArray(routesArr)) {
+ return false
+ }
+ let pathArr = []
+ let MenuInfo = sessionStorage.getItem('fSDoorwayManagementMenuInfo') && JSON.parse(sessionStorage.getItem('fSDoorwayManagementMenuInfo'))
+ if (MenuInfo) {
+ for (let i = 0; i < routesArr.length; i++) {
+ const element = routesArr[i]
+ const result = findRouersFn(MenuInfo, element.path)
+ if (result) {
+ pathArr.push(result)
+ if (result.child) {
+ MenuInfo = result.child
+ }
+ }
+ }
+ return pathArr
+ }
+ return false
+}
+
+// 鍒ゆ柇鍥剧墖鏄惁瀛樺湪
+const isHasImg = (pathImg) => {
+ var ImgObj = new Image()
+ ImgObj.src = pathImg
+ if (ImgObj.fileSize > 0 || (ImgObj.width > 0 && ImgObj.height > 0)) {
+ return true
+ } else {
+ return false
+ }
+}
+// 閫掑綊鑾峰彇鑿滃崟锛岃幏鍙栧叏閮ㄦ潈闄�
+/***
+ * arr 鑿滃崟鏁扮粍
+ * fn 鍥炶皟蹇呯敤
+ ***/
+
+const findButtonAuthoritys = (arr, fn) => {
+ fn = fn || function () {}
+ if (Array.isArray(arr)) {
+ for (let iteam of arr) {
+ if (iteam.type === 2 && iteam.permission !== '') {
+ fn(iteam.permission)
+ }
+ if (iteam.child) {
+ findButtonAuthoritys(iteam.child, fn)
+ }
+ }
+ }
+}
+// 鏁扮粍鍘婚噸-1鏍囪瘑鏈壘鍒�
+const findInArr = (n, arr) => {
+ for (let i = 0; i < arr.length; i++) {
+ if (arr[i] === n) {
+ return i
+ }
+ }
+ return -1
+}
+const findInArrJson = (n, arr, name) => {
+ for (let i = 0; i < arr.length; i++) {
+ if (arr[i][name] === n) {
+ return i
+ }
+ }
+ return -1
+}
+const removeArrByValue = (val, arr) => {
+ for (let i = 0; i < arr.length; i++) {
+ if (arr[i] === val) {
+ arr.splice(i, 1)
+ }
+ }
+ return arr
+}
+
+const removeArrJsonByValue = (n, arr, name) => {
+ for (let i = 0; i < arr.length; i++) {
+ if (arr[i][name] === n) {
+ arr.splice(i, 1)
+ }
+ }
+ return arr
+}
+// json 鏄惁涓虹┖
+const isJsonNull = (jsonStr) => {
+ if (typeof jsonStr === 'object' && jsonStr != null) {
+ for (let key in jsonStr) {
+ if (jsonStr[key]) {
+ return key
+ }
+ }
+ }
+ return false
+}
+const cloneDeep = (node) => {
+ if (!node) return node
+ var newNode = {}
+ Object.keys(node).forEach(function (key) {
+ if (key[0] === '_') return
+ var val = node[key]
+
+ if (val) {
+ if (val.type) {
+ val = cloneDeep(val)
+ } else if (Array.isArray(val)) {
+ val = val.map(cloneDeep)
+ }
+ }
+
+ newNode[key] = val
+ })
+ return newNode
+}
+var Week = (function () {
+ var ONE_DAY = 24 * 3600 * 1000
+ var ONE_WEEK = 7 * ONE_DAY
+
+ function formatNumber(num) {
+ return (num > 9 ? '' : '0') + num
+ }
+
+ function formatDate(date, num) {
+ var year = date.getFullYear()
+ var month = formatNumber(date.getMonth() + 1)
+ var day = formatNumber(date.getDate())
+ var nextWeek = new Date(+date + ONE_WEEK)
+ var nextWeekYear = nextWeek.getFullYear()
+ var nextWeekMonth = formatNumber(nextWeek.getMonth() + 1)
+ var nextWeekday = formatNumber(nextWeek.getDate() - 1)
+ /* 鍙埅鍙栧綋鍓嶅勾浠芥椂闂� */
+ if (year === nextWeekYear) {
+ return year + '-' + month + '-' + day + '~' + nextWeekYear + '-' + nextWeekMonth + '-' + nextWeekday
+ } else {
+ return year + '-' + month + '-' + day + '~' + year + '-' + month + '-31'
+ }
+
+ /* return year + '骞寸' + formatNumber(num + 1) + '鍛�' + month + '鏈�' + day + '鍙�-' + nextWeekYear + '骞�' +
+ nextWeekMonth +
+ '鏈�' + nextWeekday + '鍙�'; */
+ }
+
+ function Week(year) {
+ this.year = new Date(year, 0, 1)
+ this.nextYear = new Date(year + 1, 0, 1)
+ this.days = 0
+ this.weeks = 0
+ }
+ Week.prototype.getDays = function () {
+ this.days = Math.ceil((this.nextYear - this.year) / ONE_DAY)
+ return Math.ceil((this.nextYear - this.year) / ONE_DAY)
+ }
+ Week.prototype.getWeeks = function () {
+ this.weeks = Math.ceil(this.days || this.getDays() / 7)
+ return Math.ceil(this.days || this.getDays() / 7)
+ }
+ Week.prototype.getSomeWeek = function (num) {
+ return formatDate(new Date(+this.year + ONE_WEEK * num), num)
+ }
+ Week.prototype.showWeek = function (num) {
+ num = parseInt(num - 1) || 0
+ if (!this.weeks) {
+ this.getWeeks()
+ }
+ if (num > this.weeks) {
+ num = 0
+ }
+ if (num || num === 0) {
+ return this.getSomeWeek(num)
+ } else {
+ var arr = []
+ while (num <
+ this.weeks) {
+ arr.push(this.getSomeWeek(num))
+ num++
+ }
+ return arr
+ }
+ }
+ return Week
+})()
+
+const getYearWeek = (y, index) => {
+ return new Week(y).showWeek(index)
+}
+
+const getContainerRect = event => {
+ const _rect = event.getBoundingClientRect()
+ return {
+ left: _rect.left,
+ right: _rect.right,
+ top: _rect.top,
+ bottom: _rect.bottom,
+ width: _rect.width,
+ height: _rect.height
+ }
+}
+
+export {
+ thisRouterObjFn,
+ json2url,
+ json2path,
+ json2formData,
+ isHasImg,
+ findInArr,
+ findInArrJson,
+ isJsonNull,
+ removeArrByValue,
+ removeArrJsonByValue,
+ findButtonAuthoritys,
+ guid,
+ cloneDeep,
+ getYearWeek,
+ getContainerRect
+}
diff --git a/src/pages/library/index/App.vue b/src/pages/library/index/App.vue
new file mode 100644
index 0000000..e7f7ab2
--- /dev/null
+++ b/src/pages/library/index/App.vue
@@ -0,0 +1,172 @@
+<template>
+ <div class="s-base-manage">
+ <div class="flex-box base-overflow" style="margin-top: 10px;height: calc(100% - 20px);">
+ <div class="pl20 data-left-box">
+ <base-list
+ ref="baseSync"
+ :listWidth="`100%`"
+ :title="`鍚屾搴揱"
+ type="sync"
+ :isSelected="isSelected"
+ @getList="getPersonList"
+ @changeShow="changeToAdd"
+ ></base-list>
+ </div>
+ <div class="bg-white ml20 data-right-box">
+ <div v-show="showList">
+ <person-list ref="personList" :baseObject="baseObject" v-show="showType == 'person'"></person-list>
+ <car-list ref="carList" :baseObject="baseObject" v-show="showType == 'car'"></car-list>
+ </div>
+ <add-base
+ ref="addBase"
+ :baseObject="baseForEdit"
+ :type="syncType"
+ v-show="!showList"
+ @refresh="findBaseSync"
+ @closeAdd="closeAdd"
+ ></add-base>
+ </div>
+ </div>
+ </div>
+</template>
+<script>
+import baseList from '../components/baseList'
+import addBase from '../components/addBase'
+import personList from '../components/personList'
+import carList from '../components/carList'
+export default {
+ data() {
+ return {
+ isSelected: false,
+ showList: true,
+ showType: 'person',
+ syncType: 'sync',
+ syncTables: [],
+ localTables: [],
+ baseObject: {},
+ baseForEdit: {}, // 缁欑紪杈戦〉闈紶鐨�
+ breeadCrumb: [
+ {
+ name: '搴曞簱绠＄悊',
+ path: '/baseManage',
+ params: {}
+ },
+ {
+ name: '搴曞簱璇︽儏',
+ path: '/baseManage',
+ params: {}
+ }
+ ]
+ }
+ },
+ methods: {
+ clearSelect1() {
+ this.$refs.baseLocal.categoryIndex = -1
+ },
+ clearSelect2() {
+ this.$refs.baseSync.categoryIndex = -1
+ },
+ getPersonList(item) {
+ console.log('浼犵粰鐖剁粍浠剁殑鍊�', item)
+ this.baseObject = item
+ // 鐩存帴璋冪敤瀛愮粍浠跺埛鏂板垪琛ㄧ殑鏂规硶
+ // 鍒ゆ柇杩欐槸浜哄憳搴撹繕鏄溅杈嗗簱锛屽喅瀹歴howList鐨勫��
+ if (item.tableType == "person") {
+ console.log("person搴�")
+ this.showType = 'person'
+ this.$refs.personList.getPersonList()
+ } else if (item.tableType == "car") {
+ console.log("car搴�")
+ this.showType = "car"
+ this.$refs.carList.getCarList()
+ }
+ //this.showList = '1'
+ this.breeadCrumb[1].name = '搴曞簱璇︽儏'
+ },
+ changeToAdd(item, type) {
+ if (item !== null) {
+ this.baseForEdit = item
+ this.breeadCrumb[1].name = '搴曞簱淇℃伅'
+ } else {
+ this.baseForEdit = {}
+ this.breeadCrumb[1].name = '娣诲姞搴曞簱'
+ }
+ this.syncType = type
+ this.showList = false
+ },
+ // 鏌ヨ鍚屾搴撳垪琛ㄦ暟鎹甛鏌ヨ鏈湴搴撳垪琛ㄦ暟鎹�
+ findBaseSync() {
+ this.BaseManageData.querySyncTables()
+ this.BaseManageData.queryLocalTables()
+ },
+ closeAdd() {
+ console.log('closeAdd')
+ this.showList = true
+ }
+ },
+ props: {
+ cameraId: {
+ default: '',
+ type: String
+ }
+ },
+ components: {
+ baseList,
+ addBase,
+ personList,
+ carList
+ },
+ mounted() {
+ //this.TreeDataPool.showTreeBox = false
+ }
+}
+</script>
+<style lang="scss" scoped>
+.s-base-manage {
+ width: 100% !important;
+ box-sizing: border-box;
+ padding: 5px;
+ background-color: #e9ebf2;
+}
+.base-overflow {
+ overflow: visible !important;
+ background-color: #ffffff;
+ box-sizing: border-box;
+ // padding: 20px 10px 0 10px;
+}
+.s-data-manage-breadcrumb {
+ margin: 0 3px;
+ height: 5%;
+ -webkit-box-sizing: border-box;
+ border: 1px solid #e4e7ed;
+ -webkit-box-shadow: #e4e7ed 0px 0px 9px inset;
+ box-shadow: #e4e7ed 0px 0px 9px inset;
+ border-radius: 5px;
+}
+.data-left-box {
+ @media screen and (max-width: 1440px) {
+ width: 23%;
+ }
+ @media screen and (min-width: 1440px) and (max-width: 1640px) {
+ width: 21%;
+ }
+ @media screen and (min-width: 1640px) {
+ width: 20%;
+ }
+ box-sizing: border-box;
+ border-right: 1px solid #e0e0e0;
+}
+.data-right-box {
+ @media screen and (max-width: 1440px) {
+ width: 77%;
+ }
+ @media screen and (min-width: 1440px) and (max-width: 1640px) {
+ width: 79%;
+ }
+ @media screen and (min-width: 1640px) {
+ width: 80%;
+ }
+ padding: 5px 20px 5px 5px;
+ box-sizing: border-box;
+}
+</style>
diff --git a/src/pages/library/index/main.ts b/src/pages/library/index/main.ts
new file mode 100644
index 0000000..9e1e887
--- /dev/null
+++ b/src/pages/library/index/main.ts
@@ -0,0 +1,32 @@
+import Vue from 'vue';
+import ElementUI from 'element-ui';
+import 'element-ui/lib/theme-chalk/index.css';
+import "@/assets/css/element-variables.scss";
+import "../../../assets/css/common.scss"
+import "../../../assets/css/overried.scss"
+
+import "../../../assets/icons/alibaba/iconfont.css";
+import "../../../assets/icons/basic/iconfont.css";
+import "../../../assets/icons/iconfont.css";
+import "../../../assets/icons/symbol.js";
+
+
+import App from './App.vue'
+import moment from "moment";
+Vue.prototype.$moment = moment;
+
+import Mixin from "./mixins";
+Vue.mixin(Mixin);
+
+Vue.use(ElementUI)
+
+Vue.filter('moment', function (value, formatString) {
+ formatString = formatString || 'YYYY-MM-DD HH:mm:ss';
+ return moment(value).format(formatString);
+
+});
+
+new Vue({
+ el: '#app',
+ render: h => h(App)
+})
diff --git a/src/pages/library/index/mixins.ts b/src/pages/library/index/mixins.ts
new file mode 100644
index 0000000..65395d9
--- /dev/null
+++ b/src/pages/library/index/mixins.ts
@@ -0,0 +1,19 @@
+import BaseManageData from "@/Pool/BaseManageData";
+import VideoPhotoData from "@/Pool/VideoPhotoData";
+import AuthData from '@/Pool/AuthData';
+
+/* eslint-disable */
+const onlyBaseManage = new BaseManageData
+const onlyVideoPhotoData = new VideoPhotoData
+const onlyAuthData = new AuthData
+
+const mixin = {
+ data() {
+ return {
+ BaseManageData: onlyBaseManage,
+ VideoPhotoData: onlyVideoPhotoData,
+ AuthData: onlyAuthData,
+ };
+ },
+};
+export default mixin;
\ No newline at end of file
--
Gitblit v1.8.0