提交 85cd384e authored 作者: zs's avatar zs

edit

上级 d405e5ed
<template>
<view class="desc-dialog">
<view class="desc-content">
<view class="title">设备上架操作说明</view>
<view class="tips">请参考下图进行拍摄设备上架照片</view>
<view class="flex">
<view class="text-center">
<image src="@/static/img/add-img/desc1.png" class="image" style="margin-bottom:6.4px"></image>
设备所在机柜正面照片
</view>
<view class="text-center">
<image src="@/static/img/add-img/desc2.png" class="image" style="margin: 0 6.4px 6.4px 6.4px;"></image>
设备所在机柜背面照片
</view>
<view class="text-center">
<image src="@/static/img/add-img/desc3.png" class="image" style="margin-bottom:6.4px"></image>
设备大图(含资产标识)
</view>
</view>
<view class="subtitle">操作说明:</view>
<view class="subitem">
<view>1、设备完成上架后,请按下列示例图要求对上架没备进行拍照操作;</view>
<view>2、拍照完成后,将PAD连接至专网电脑,进行照片同步;</view>
<view>3、进入专网侧进行设备上架执行,选择本次上架的设备申请单,将照片与设备进行关联。";</view>
</view>
<view class="row-item bottom-row">
<button class="button" :loading="loading" @click="close('photo')">
设备上架拍照
</button>
</view>
<!-- 关闭按钮 -->
<div class="close-button">
<text class="iconfont icon-shibai1" @click="close('close')"></text>
</div>
</view>
</view>
</template>
<script>
import {
SYNCHRONIZE_DATA_PAD,
checkAndCreateDirectory,
createFileWithPlusIO,
setSm2,
USER_FILE_NAME,
getUserList,
} from "@/utils/systemCofig";
import {
copyDirectory,
deleteAllFilesInDirectory,
addLog,
getLogContent,
LOG_TYPE_ENUM,
writeDeviceData,
copyImagesToFolder,
} from "@/utils/IoReadingAndWriting.js";
import moment from "moment";
import {
Base64
} from "js-base64";
export default {
props: {
},
components: {},
data() {
return {
loading: false,
};
},
mounted() {},
watch: {
},
methods: {
close(key) {
this.$emit("close",key);
},
getDetails() {
this.$emit("getDetails");
},
/**
* 1.生成两个文件. 机房文件 和 井道文件
* 2. 更新巡检数据状态 synchronization 置为 1
* 3. 写入数据
* 读取上一次打包的文件, 复制到 [ history ] 文件夹中
*/
clickHandle() {
if (this.loading) return;
this.coverData();
},
// 保存图片到指定地址
copyImages(imagePaths, userName) {
const targetPath = `${SYNCHRONIZE_DATA_PAD}/设备上架照片/${userName}`;
console.log("imagePath打包", imagePaths);
//请空文件夹
deleteAllFilesInDirectory(targetPath).then(() => {
// 复制
copyImagesToFolder(imagePaths, targetPath).then((res) => {
uni.showToast({
title: "打包成功",
icon: "none",
duration: 1000,
});
setTimeout(() => {
this.loading = false;
this.close();
uni.navigateTo({
url: "/pages/listingManagement/index?backValue=home",
});
}, 1000);
});
});
},
// 处理数据
coverData() {
const userName = this.$store.state.now_user.user;
let syncedData = this.list;
let imagePaths = this.list.map((user) => user.imgPath);
// 保存照片
let timeStr = moment().format("yyyy_MM_DD_hh_mm_ss");
syncedData.forEach((item) => {
item.synchronization = true;
item.selected = false;
item.status = "已同步";
});
console.log("syncedData", syncedData);
this.loading = true;
let SBSJ_DATA_FILE_NAME = `${userName}_SBSJ_${timeStr}.txt`;
const tmepList = this.packedData(syncedData, SBSJ_DATA_FILE_NAME);
let arr = this.photos.map((item) => {
// 查找 B 数组中是否有对应的对象
const updatedItem = syncedData.find((bItem) => bItem.id === item.id);
// 如果有,则返回 B 数组中的对象,否则返回原对象
return updatedItem ? updatedItem : item;
});
// writeDeviceData(tmepList, userName)
// .then((res) => {
// console.log("tmepList", tmepList);
this.$store.commit("SET_DEVICEDATA", arr);
setTimeout(
() => {
let length = arr.length;
// 生成日志
const logContent = getLogContent(
LOG_TYPE_ENUM.sys,
`${length}张照同步`,
"同步"
);
this.$logApi.addlog(logContent)
const log_list = this.$store.state.log_list;
log_list.push(logContent);
this.$store.commit("SET_LOG_LIST", log_list);
addLog(log_list).then(() => {});
// 更新同步时间
this.updateSysTime();
this.copyImages(imagePaths, userName);
// this.getDetails();
},
2 * 1000
// uni.navigateTo({
// url: "/pages/listingManagement/index?backValue=home",
// })
);
// })
// .catch((error) => {
// this.loading = false;
// uni.showToast({
// title: error,
// icon: "none",
// duration: 2000,
// });
// })
// .catch(() => {
// setTimeout(() => {
// uni.showToast({
// title: "打包失败",
// icon: "none",
// duration: 2000,
// });
// this.loading = false;
// }, 2 * 1000);
// });
},
// 打包文件
packedData(content, fileName) {
const fileContent = setSm2(content);
return createFileWithPlusIO(
`${SYNCHRONIZE_DATA_PAD}/发送数据`,
fileName,
fileContent
);
},
// 更新最近一次同步时间
updateSysTime() {
getUserList().then((personList) => {
const now_user = this.$store.state.now_user;
const key = personList.findIndex(
(item) => item.userId == now_user.userId
);
// 更新用户同步时间
const userInfo = personList[key];
const LastSynchronizationTime = moment().format("yyyy-MM-DD HH:mm");
personList[key].LastSynchronizationTime = LastSynchronizationTime;
userInfo.LastSynchronizationTime = LastSynchronizationTime;
this.$store.commit("SET_USER", userInfo);
uni.setStorageSync("last_time", userInfo.LastSynchronizationTime || "");
// 更新用户数据
const fileContent = JSON.stringify(
Base64.encode(JSON.stringify(personList))
);
uni.setStorage({
key: "user_data",
data: JSON.stringify(personList),
fail: (error) => {
console.log("APP.vue 存储数据失败", error);
},
});
createFileWithPlusIO(SYNCHRONIZE_DATA_PAD, USER_FILE_NAME, fileContent)
.then(() => {
console.log("---用户数据更新成功");
})
.catch((error) => {
console.log("---用户数据更新失败", error);
});
});
},
},
};
</script>
<style scoped lang="less">
.desc-dialog {
position: fixed;
z-index: 999;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.5);
display: flex;
align-items: center;
justify-content: center;
.desc-content {
padding: 3% 20px 32px 24px;
width: 674px;
min-height: 515px;
box-sizing: border-box;
background-image: linear-gradient(-6deg,
#f9ffe7 0%,
#ffffff 12%,
#fcfeff 73%,
#ccf1ff 100%);
border: 0.4px solid rgba(224, 224, 224, 1);
border-radius: 12px;
position: relative;
.image {
width: 202px;
height: 186px;
}
.title {
font-family: PingFangSC-Medium;
font-size: 14.4px;
color: #000000;
text-align: center;
line-height: 26px;
font-weight: bold;
}
.tips {
font-family: PingFangSC-Regular;
font-size: 12.8px;
color: #4A4A4A;
text-align: center;
line-height: 19.2px;
font-weight: 400;
margin: 12.8px 0 9.6px
}
.subtitle{
font-family: PingFangSC-Medium;
font-size: 16px;
color: #4A4A4A;
line-height: 24px;
font-weight: 500;
margin:26px 0 9.6px
}
.subitem{
font-family: PingFangSC-Regular;
font-size: 11.2px;
color: #7C7C7C;
line-height: 22px;
font-weight: 400;
}
// 打包按钮
.bottom-row {
position: absolute;
bottom: 24px;
left: 50%;
transform: translateX(-50%);
.button {
display: flex;
align-items: center;
justify-content: center;
background-image: linear-gradient(180deg, #3773f6 0%, #2c57f6 99%);
box-shadow: 0px 10px 24px 0px rgba(51, 104, 246, 0.24);
border-radius: 27px;
width: 160px;
height: 40px;
color: #fff;
}
}
// 关闭按钮
.close-button {
position: absolute;
bottom: -40px;
left: 50%;
transform: translateX(-50%);
.iconfont {
font-size: 24px;
}
}
}
}
.flex {
display: flex;
align-items: center;
}
.text-center {
text-align: center;
}
</style>
\ No newline at end of file
<template> <template>
<view class="container"> <view class="container">
<uni-nav-bar <uni-nav-bar v-if="!selectedCount" :fixed="true" background-color="rgba(214, 240, 255, 0.0)" status-bar
v-if="!selectedCount" rightWidth="300">
:fixed="true"
background-color="rgba(214, 240, 255, 0.0)"
status-bar
rightWidth="300"
>
<block slot="left"> <block slot="left">
<view @click="back"> <view @click="back">
<text class="iconfont icon-fanhui"></text> <text class="iconfont icon-fanhui"></text>
</view> </view>
</block> </block>
<block slot="right" class="nav-right"> <block slot="right" class="nav-right">
<view class="header-buttons"> <view class="header-buttons" @click="showDescDialog = true">
<text class="iconfont icon-shuoming"></text> <text class="iconfont icon-shuoming"></text>
</view> </view>
</block> </block>
</uni-nav-bar> </uni-nav-bar>
<uni-nav-bar <uni-nav-bar v-else :fixed="true" background-color="#FFF" status-bar leftWidth="300" rightWidth="300">
v-else
:fixed="true"
background-color="#FFF"
status-bar
leftWidth="300"
rightWidth="300"
>
<block slot="left"> <block slot="left">
<view class="header-left" @click="headerClose"> <view class="header-left" @click="headerClose">
<text class="close">X</text <text class="close">X</text>
><view class="selected-count"> 已选择{{ selectedCount }}张图片</view> <view class="selected-count"> 已选择{{ selectedCount }}张图片</view>
</view> </view>
</block> </block>
<block slot="right" class="nav-right"> <block slot="right" class="nav-right">
...@@ -38,59 +26,33 @@ ...@@ -38,59 +26,33 @@
class="iconfont icon-quanxuan" class="iconfont icon-quanxuan"
@click.stop="toggleSelectAll" @click.stop="toggleSelectAll"
></text> --> ></text> -->
<text class="iconfont icon-shanchu" @click.stop="deletePhotos" <text class="iconfont icon-shanchu" @click.stop="deletePhotos">删除</text>
>删除</text
>
</view> </view>
</block> </block>
</uni-nav-bar> </uni-nav-bar>
<view class="photo-box"> <view class="photo-box">
<view class="photo-list"> <view class="photo-list">
<view <view v-for="(group, date) in photoGroups" :key="date" class="photo-group">
v-for="(group, date) in photoGroups"
:key="date"
class="photo-group"
>
<view class="group-header"> <view class="group-header">
<view <view class="circle-button" :class="{ active: isDateAllSelected(group, date) }"
class="circle-button" @click.stop="toggleSelectDate(date)">
:class="{ active: isDateAllSelected(group, date) }" <text v-if="isDateAllSelected(group, date)" class="iconfont icon-wancheng"></text>
@click.stop="toggleSelectDate(date)"
>
<text
v-if="isDateAllSelected(group, date)"
class="iconfont icon-wancheng"
></text>
</view> </view>
<text class="date">{{ date }}</text> <text class="date">{{ date }}</text>
</view> </view>
<view class="card-list"> <view class="card-list">
<view <view v-for="(photo, index) in group" :key="index" class="card"
v-for="(photo, index) in group" @click="previewPhoto(photo, index)">
:key="index" <image :src="photo.imgPath" mode="aspectFill" class="photo"></image>
class="card"
@click="previewPhoto(photo, index)"
>
<image
:src="photo.imgPath"
mode="aspectFill"
class="photo"
></image>
<view class="photo-mask"> <view class="photo-mask">
<view>照片编号:{{photo.id}}</view> <view>照片编号:{{photo.id}}</view>
<view>拍摄时间:{{photo.time}}</view> <view>拍摄时间:{{photo.time}}</view>
<view>数据同步:{{ photo.synchronization ? "已同步" : "待同步"}}</view> <view>数据同步:{{ photo.synchronization ? "已同步" : "待同步"}}</view>
</view> </view>
<view <view class="check-icon" :class="{ active: photo.selected }"
class="check-icon" @click.stop="toggleSelect(photo)">
:class="{ active: photo.selected }" <text v-if="photo.selected" class="iconfont icon-wancheng"></text>
@click.stop="toggleSelect(photo)"
>
<text
v-if="photo.selected"
class="iconfont icon-wancheng"
></text>
</view> </view>
<!-- <text <!-- <text
class="delete-icon iconfont icon-shanchu" class="delete-icon iconfont icon-shanchu"
...@@ -108,46 +70,41 @@ ...@@ -108,46 +70,41 @@
</view> </view>
</view> </view>
<view <view v-if="selectedCount" class="inspection-button" @click="showSyncDialog = true">数据同步</view>
v-if="selectedCount"
class="inspection-button"
@click="showSyncDialog = true"
>数据同步</view
>
<view v-else class="inspection-button" @click="takePhoto">设备拍照</view> <view v-else class="inspection-button" @click="takePhoto">设备拍照</view>
<Dialog <Dialog v-show="showSyncDialog" ref="Dialog" :list="selectedPhotos" :photos="photos"
v-show="showSyncDialog" @close="showSyncDialog = false" @getDetails="getDetails"></Dialog>
ref="Dialog" <desc-Dialog v-show="showDescDialog" ref="descDialog" @close="close"></desc-Dialog>
:list="selectedPhotos"
:photos="photos"
@close="showSyncDialog = false"
@getDetails="getDetails"
></Dialog>
</view> </view>
</template> </template>
<script> <script>
import moment from "moment"; import moment from "moment";
import Dialog from "./dialog.vue"; import Dialog from "./dialog.vue";
import { import descDialog from "./descdialog.vue";
import {
addLog, addLog,
getLogContent, getLogContent,
LOG_TYPE_ENUM, LOG_TYPE_ENUM,
writeDeviceData, writeDeviceData,
} from "@/utils/IoReadingAndWriting.js"; } from "@/utils/IoReadingAndWriting.js";
import { getDeviceDataDetails } from "@/request/index.js"; import {
getDeviceDataDetails
} from "@/request/index.js";
export default { export default {
components: { components: {
Dialog, Dialog,
descDialog
}, },
data() { data() {
return { return {
showSyncDialog: false, showSyncDialog: false,
photos: [], photos: [],
selectedPhotos: [], selectedPhotos: [],
showDescDialog: false
}; };
}, },
computed: { computed: {
...@@ -173,6 +130,13 @@ export default { ...@@ -173,6 +130,13 @@ export default {
this.getDetails(); this.getDetails();
}, },
methods: { methods: {
close(key) {
this.showDescDialog = false
if (key == 'photo') this.takePhoto()
},
showDesc() {
this.showDesc = true
},
back() { back() {
uni.navigateTo({ uni.navigateTo({
url: "/pages/home/home", url: "/pages/home/home",
...@@ -195,7 +159,10 @@ export default { ...@@ -195,7 +159,10 @@ export default {
uni.hideLoading(); uni.hideLoading();
}) })
.catch((error) => { .catch((error) => {
uni.showToast({ title: error.msg, icon: "none" }); uni.showToast({
title: error.msg,
icon: "none"
});
uni.hideLoading(); uni.hideLoading();
}); });
}, },
...@@ -203,7 +170,10 @@ export default { ...@@ -203,7 +170,10 @@ export default {
// 拍照功能 // 拍照功能
async takePhoto() { async takePhoto() {
try { try {
const res = await uni.chooseImage({ count: 1, sourceType: ["camera"] }); const res = await uni.chooseImage({
count: 1,
sourceType: ["camera"]
});
const tempFilePath = res.tempFilePaths[0]; const tempFilePath = res.tempFilePaths[0];
const saveRes = await uni.saveImageToPhotosAlbum({ const saveRes = await uni.saveImageToPhotosAlbum({
filePath: tempFilePath, filePath: tempFilePath,
...@@ -295,7 +265,10 @@ export default { ...@@ -295,7 +265,10 @@ export default {
); );
this.clearSelection(); this.clearSelection();
this.addPhotos(this.photos, "批量删除照片", "删除"); this.addPhotos(this.photos, "批量删除照片", "删除");
uni.showToast({ title: "删除成功", icon: "success" }); uni.showToast({
title: "删除成功",
icon: "success"
});
} }
}, },
}); });
...@@ -351,17 +324,17 @@ export default { ...@@ -351,17 +324,17 @@ export default {
addLog(log_list); addLog(log_list);
}, },
}, },
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
/* 保持原有的样式不变 */ /* 保持原有的样式不变 */
.container { .container {
background-image: linear-gradient(115deg, #e8f0fb 0%, #e1ebfa 100%); background-image: linear-gradient(115deg, #e8f0fb 0%, #e1ebfa 100%);
height: 100%; height: 100%;
} }
.uni-nav-bar-text { .uni-nav-bar-text {
height: 28.8px; height: 28.8px;
width: 28.8px; width: 28.8px;
background: #ffffff; background: #ffffff;
...@@ -372,18 +345,21 @@ export default { ...@@ -372,18 +345,21 @@ export default {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
text-align: center; text-align: center;
.iconfont { .iconfont {
font-size: 16px; font-size: 16px;
line-height: 28.8px; line-height: 28.8px;
} }
} }
.header-left { .header-left {
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
.close { .close {
font-size: 20px; font-size: 20px;
} }
.selected-count { .selected-count {
font-size: 14.4px; font-size: 14.4px;
line-height: 27px; line-height: 27px;
...@@ -391,14 +367,17 @@ export default { ...@@ -391,14 +367,17 @@ export default {
font-weight: 500; font-weight: 500;
margin-left: 6.4px; margin-left: 6.4px;
} }
} }
.nav-right {
.nav-right {
width: 192px; width: 192px;
} }
::v-deep .uni-navbar__header-btns-left {
::v-deep .uni-navbar__header-btns-left {
width: 300px !important; width: 300px !important;
} }
.header-buttons {
.header-buttons {
display: flex; display: flex;
align-items: center; align-items: center;
margin-left: auto; margin-left: auto;
...@@ -406,22 +385,25 @@ export default { ...@@ -406,22 +385,25 @@ export default {
height: 28.8px; height: 28.8px;
border-radius: 50%; border-radius: 50%;
background: #fff; background: #fff;
.iconfont { .iconfont {
margin: 0 auto; margin: 0 auto;
&.icon-shuoming {
&.icon-shuoming {}
} }
} }
}
.header-right { .header-right {
.iconfont { .iconfont {
margin: 0 auto; margin: 0 auto;
&.icon-quanxuan { &.icon-quanxuan {
margin-right: 19.2px; margin-right: 19.2px;
} }
} }
} }
.photo-box { .photo-box {
width: 100%; width: 100%;
height: 100%; height: 100%;
overflow: hidden; overflow: hidden;
...@@ -440,6 +422,7 @@ export default { ...@@ -440,6 +422,7 @@ export default {
margin-bottom: 6.4px; margin-bottom: 6.4px;
padding: 0 25.6px; padding: 0 25.6px;
position: relative; position: relative;
.circle-button { .circle-button {
width: 14.4px; width: 14.4px;
height: 14.4px; height: 14.4px;
...@@ -455,6 +438,7 @@ export default { ...@@ -455,6 +438,7 @@ export default {
text-align: center; text-align: center;
position: absolute; position: absolute;
bottom: 4px; bottom: 4px;
.icon-wancheng { .icon-wancheng {
color: #3774f6; color: #3774f6;
font-size: 16px; font-size: 16px;
...@@ -463,6 +447,7 @@ export default { ...@@ -463,6 +447,7 @@ export default {
border-radius: 50%; border-radius: 50%;
} }
} }
.date { .date {
font-size: 20.8px; font-size: 20.8px;
color: #000000; color: #000000;
...@@ -502,6 +487,7 @@ export default { ...@@ -502,6 +487,7 @@ export default {
justify-content: center; justify-content: center;
align-items: center; align-items: center;
line-height: 20px; line-height: 20px;
.icon-wancheng { .icon-wancheng {
color: #3774f6; color: #3774f6;
font-size: 20px; font-size: 20px;
...@@ -539,7 +525,8 @@ export default { ...@@ -539,7 +525,8 @@ export default {
right: 10.8px; right: 10.8px;
top: 6.4px; top: 6.4px;
} }
.photo-mask{
.photo-mask {
background: rgba(0, 0, 0, 0.5); background: rgba(0, 0, 0, 0.5);
color: #ffffff; color: #ffffff;
position: absolute; position: absolute;
...@@ -548,13 +535,14 @@ export default { ...@@ -548,13 +535,14 @@ export default {
left: 0; left: 0;
right: 0; right: 0;
border-radius: 4.8px; border-radius: 4.8px;
margin:0 auto; margin: 0 auto;
padding:4.8px; padding: 4.8px;
font-size: 9.6px; font-size: 9.6px;
color: #ffffff; color: #ffffff;
line-height: 16px; line-height: 16px;
text-shadow: 0 0 2px rgba(0,0,0,0.30); text-shadow: 0 0 2px rgba(0, 0, 0, 0.30);
} }
.photo-info { .photo-info {
text-align: center; text-align: center;
font-family: PingFangSC-Regular; font-family: PingFangSC-Regular;
...@@ -567,9 +555,9 @@ export default { ...@@ -567,9 +555,9 @@ export default {
} }
} }
} }
} }
.inspection-button { .inspection-button {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
...@@ -588,5 +576,5 @@ export default { ...@@ -588,5 +576,5 @@ export default {
color: #ffffff; color: #ffffff;
text-align: center; text-align: center;
font-weight: 400; font-weight: 400;
} }
</style> </style>
\ No newline at end of file
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论