From 0759348a3064698ed79e00d2abe0748d9391d409 Mon Sep 17 00:00:00 2001
From: heyujie <516346543@qq.com>
Date: 星期一, 25 七月 2022 12:13:55 +0800
Subject: [PATCH] batch import cameer
---
src/api/camera.ts | 6 +
vue.config.js | 6
src/components/CameraLeft.vue | 208 ++++++++++++++++++++++++++++++++++++++++++++--------
3 files changed, 185 insertions(+), 35 deletions(-)
diff --git a/src/api/camera.ts b/src/api/camera.ts
index 702c3aa..1cd0040 100644
--- a/src/api/camera.ts
+++ b/src/api/camera.ts
@@ -11,6 +11,12 @@
});
};
+export const downloadFile = () => request({
+ url: '/saas/api-s/camera/downloadExcel',
+ method: 'get',
+ responseType: "blob"
+})
+
export const updateCameraInfo = (camera: any) => {
return request2({
url: "/saas/api-s/camera/update",
diff --git a/src/components/CameraLeft.vue b/src/components/CameraLeft.vue
index 49176ec..fabc429 100644
--- a/src/components/CameraLeft.vue
+++ b/src/components/CameraLeft.vue
@@ -108,8 +108,7 @@
placement="bottom"
popper-class="atooltip"
>
- <button @click="importCameras('0')">
- <!-- <i class="el-icon-video-camera"></i> -->
+ <button @click="openBatchImport">
<span class="iconfont" style="font-size: 16px"
></span
>
@@ -372,13 +371,68 @@
</div>
</transition>
</div>
+ <el-dialog
+ title="鎵归噺瀵煎叆鎽勫儚鏈�"
+ :visible.sync="showSettingBox"
+ width="30%"
+ custom-class="batch-import-dialog"
+ >
+ <div class="fuck-basic">
+ <el-input placeholder="" v-model="input2">
+ <template slot="append">
+ <span
+ class="iconfont"
+ style="font-size: 16px"
+ @click="importCameras('0')"
+ ></span
+ ></template
+ >
+ </el-input>
+ <div class="download-excel" @click="downLoadExcel">涓嬭浇妯℃澘鏂囦欢</div>
+ </div>
+ <div class="desc">
+ 鏀寔瀵煎叆鎬昏褰曟暟5涓囨潯浠ュ唴锛屾枃浠跺ぇ灏忓湪50 MB浠ュ唴鐨剎lsx銆亁ls鏍煎紡鏂囦欢
+ </div>
+ <div class="info1" v-if="progress == 'loading'">鏁版嵁鏍￠獙涓��</div>
+ <div class="info1" v-if="progress == 'unload'">
+ 閫夋嫨鏂囦欢鍚庡皢鑷姩涓婁紶骞惰繘琛屾暟鎹牎楠�
+ </div>
+ <div class="info1" v-if="progress == 'loaded'">鏍￠獙瀹屾垚</div>
+ <div class="info2" v-if="progress == 'loaded'">
+ 鍏ㄩ儴鏍￠獙閫氳繃锛屽叡 {{ succeed }} 鏉℃暟鎹�
+ </div>
+ <div class="info2">
+ <div class="line1" v-if="progress == 'loading'">
+ 宸叉牎楠屾暟鎹噺锛歿{ succeed }} 鏁版嵁鎬婚噺锛歿{ dataNum }}
+ </div>
+ <div class="line1" v-if="progress == 'loading'">
+ 宸茶姳璐规椂闂达細{{ passTime }} s 棰勮鏃堕棿锛�1 s
+ </div>
+ </div>
+ <span slot="footer" class="dialog-footer">
+ <el-button @click="showSettingBox = false">鍙栨秷</el-button>
+ <el-button type="primary" @click="importCams">瀵煎叆</el-button>
+ </span>
+ </el-dialog>
+ <!-- <div class="settingBox" v-if="showSettingBox">
+ <div class="title">閰嶇疆鎻愮ず</div>
+ <div class="control">
+ <div class="label">鍚敤绠楁硶浠撶鐞�</div>
+ <el-switch v-model="setting" active-color="#D4E3FA" :width="44">
+ </el-switch>
+ </div>
+ <div class="des">鍚敤鍚庣畻娉曠鐞嗛〉闈㈤厤缃敓鏁堬紝鍚﹀垯涓嶇敓鏁�</div>
+ <div class="btns">
+ <div class="confirm button" @click="closeSettingBox">纭畾</div>
+ </div>
+ </div> -->
</div>
</template>
<script>
import { changeEnable, deleteLocalFile, updateStatus } from "@/api/localVedio";
-import { createCamera } from "@/api/camera";
+import { createCamera, downloadFile } from "@/api/camera";
import bus from "@/plugin/bus";
// import TreeMenu from "@/components/treeMenu/index";
@@ -408,7 +462,6 @@
default: 0,
},
},
-
computed: {
showTab() {
return true;
@@ -464,6 +517,12 @@
data() {
return {
openeds: ["0"],
+ input2: "",
+ dataNum: 0,
+ passTime: 0,
+ promiseArr: [],
+ succeed: 0,
+ showSettingBox: false,
dataStack: "videoMonitor:dataStack",
buttonAuthority: sessionStorage.getItem("buttonAuthoritys") || [],
installedApps: sessionStorage.getItem("apps") || [],
@@ -494,6 +553,7 @@
menuLoading: false,
clusterName: "",
cluster: "",
+ progress: "unload",
};
},
created() {
@@ -582,6 +642,21 @@
}
}, 500);
},
+ downLoadExcel() {
+ downloadFile().then(function (res) {
+ let blobUrl = window.URL.createObjectURL(
+ new Blob([res], {
+ type: "application/vnd.ms-excel",
+ })
+ );
+ const a = document.createElement("a");
+ a.style.display = "none";
+ a.download = "鎵归噺瀵煎叆妯℃澘.xlsx";
+ a.href = blobUrl;
+ a.click();
+ document.body.removeChild(a);
+ });
+ },
handleClick(event) {
if (event.name == "dataStack") {
this.DataStackPool.fetchFiles();
@@ -665,11 +740,17 @@
},
importCameras(area) {
+ this.progress = "unload";
this.importAreaId = area;
this.$refs["import-btn"].click();
},
-
+ openBatchImport() {
+ // importCameras('0')
+ this.showSettingBox = true;
+ },
async uploadFile(params) {
+ const curSec = new Date().getTime() / 1000;
+ this.progress = "loading";
const _file = params.file;
const fileReader = new FileReader();
fileReader.onload = (ev) => {
@@ -687,10 +768,10 @@
if (sheetArray.length == 0) {
continue;
}
-
+ this.dataNum = sheetArray.length;
let succeed = 0;
let failed = 0;
- let promiseArr = [];
+ this.promiseArr = [];
for (let item in sheetArray) {
let camera = this.newCamera();
camera.areaid = this.importAreaId;
@@ -708,33 +789,37 @@
tem.camera.enable = false;
delete tem.camera.sensors;
- promiseArr.push(createCamera(tem));
+ this.promiseArr.push(createCamera(tem));
}
+ this.progress = "loaded";
let _this = this;
- Promise.allSettled(promiseArr)
- .then((res) => {
- res.forEach((item) => {
- if (item.status === "fulfilled") {
- succeed++;
- } else {
- failed++;
- }
- });
- _this.menuLoading = false;
- _this.$message({
- type: "success",
- message:
- "鎿嶄綔瀹屾垚, 瀵煎叆鎴愬姛:" +
- succeed +
- "涓� 澶辫触:" +
- failed +
- "涓�",
- });
- _this.TreeDataPool.fetchTreeData();
- })
- .catch((e) => {
- console.log(e);
- });
+ this.passTime = new Date().getTime() / 1000 - curSec;
+
+ // Promise.allSettled(promiseArr)
+ // .then((res) => {
+ // res.forEach((item) => {
+ // if (item.status === "fulfilled") {
+ // succeed++;
+ // this.succeed++;
+ // } else {
+ // failed++;
+ // }
+ // });
+ // _this.menuLoading = false;
+ // _this.$message({
+ // type: "success",
+ // message:
+ // "鎿嶄綔瀹屾垚, 瀵煎叆鎴愬姛:" +
+ // succeed +
+ // "涓� 澶辫触:" +
+ // failed +
+ // "涓�",
+ // });
+ // _this.TreeDataPool.fetchTreeData();
+ // })
+ // .catch((e) => {
+ // console.log(e);
+ // });
}
} catch (e) {
this.menuLoading = false;
@@ -742,6 +827,29 @@
}
};
fileReader.readAsBinaryString(_file);
+ },
+ importCams() {
+ Promise.allSettled(this.promiseArr)
+ .then((res) => {
+ res.forEach((item) => {
+ if (item.status === "fulfilled") {
+ succeed++;
+ this.succeed++;
+ } else {
+ failed++;
+ }
+ });
+ this.menuLoading = false;
+ this.$message({
+ type: "success",
+ message:
+ "鎿嶄綔瀹屾垚, 瀵煎叆鎴愬姛:" + succeed + "涓� 澶辫触:" + failed + "涓�",
+ });
+ this.TreeDataPool.fetchTreeData();
+ })
+ .catch((e) => {
+ console.log(e);
+ });
},
exceed() {
this.$message.error("鏈�澶氬彧鑳戒笂浼�1涓獂ls鏂囦欢");
@@ -774,6 +882,42 @@
</style>
<style lang="scss">
+.el-dialog.batch-import-dialog {
+ .fuck-basic {
+ display: flex;
+ align-items: center;
+
+ .download-excel {
+ font-size: 14px;
+ letter-spacing: 0px;
+ color: #0065ff;
+ cursor: pointer;
+ width: 115px;
+ height: 20px;
+ line-height: 20px;
+ margin-left: 12px;
+ }
+ }
+ .desc {
+ font-size: 12px;
+ line-height: 20px;
+ letter-spacing: 0px;
+ color: #999999;
+ }
+ .info1 {
+ font-size: 14px;
+ font-weight: bold;
+ line-height: 22px;
+ letter-spacing: 0px;
+ color: #666666;
+ }
+ .info2 {
+ font-size: 12px;
+ line-height: 20px;
+ letter-spacing: 0px;
+ color: #666666;
+ }
+}
.left-tree-box {
float: left;
width: 100%;
diff --git a/vue.config.js b/vue.config.js
index 8cc7dec..46f60da 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -15,7 +15,7 @@
"/api": {
// target: "http://192.168.20.10:7004",
// target: "http://192.168.20.174:7070",
- target: "http://192.168.20.235:7070",
+ target: "http://192.168.20.115:7070",
// target: "http://192.168.20.117:7080",
// secure: false,
changeOrigin: true,
@@ -26,13 +26,13 @@
// target: "http://222.128.87.51:7003",
// target: "http://192.168.20.10:7009",
// target: "http://192.168.20.189:7009",
- target: "http://192.168.20.235:7070",
+ target: "http://192.168.20.115:7070",
changeOrigin: true, //寮�鍚唬鐞�
},
"/ws": {
- target: "http://192.168.20.235:7070",
+ target: "http://192.168.20.115:7070",
// ws: true,
changeOrigin: true,
},
--
Gitblit v1.8.0