| | |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <div style="background: #fff; height: 100%"> |
| | | <el-card class="trackClass"> |
| | | <el-card class="trackClass" style="overflow-y: auto"> |
| | | <div |
| | | style="margin-top: 20px" |
| | | role="tab" |
| | |
| | | </el-col> |
| | | <el-col span="12"> |
| | | <el-form-item label="历史视频"> |
| | | <el-button type="primary" @click.stop="oldVideoSatart = true" |
| | | <el-button type="primary" @click.stop="oldOpenVideo" |
| | | >视频播放 |
| | | </el-button> |
| | | </el-form-item> |
| | |
| | | class="el-collapse-item__header focusing is-active" |
| | | > |
| | | <div class="avue-group__header avue-group"> |
| | | <i class="el-icon-phone avue-group__icon"></i> |
| | | <h1 class="avue-group__title">对讲信息</h1> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | |
| | | <el-card class="audios-box"> |
| | | <m-audio |
| | | :block="false" |
| | | v-for="(item, index) in audios" |
| | | :key="index" |
| | | :src="item.address" |
| | | ></m-audio> |
| | | </el-card> |
| | | |
| | | <div |
| | | style="margin-top: 20px" |
| | | role="tab" |
| | | aria-expanded="true" |
| | | aria-controls="el-collapse-content-823" |
| | | aria-describedby="el-collapse-content-823" |
| | | > |
| | | <div |
| | | role="button" |
| | | tabindex="0" |
| | | class="el-collapse-item__header focusing is-active" |
| | | > |
| | | <div class="avue-group__header avue-group"> |
| | | <i class="el-icon-s-custom avue-group__icon"></i> |
| | | <h1 class="avue-group__title">保安信息</h1> |
| | | </div> |
| | |
| | | </el-row> |
| | | <el-row> |
| | | <el-col span="12"> |
| | | <el-form-item label="性别"> |
| | | <el-input |
| | | disabled="true" |
| | | v-model="security.sex" |
| | | autocomplete="off" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col span="12"> |
| | | <el-form-item label="年龄"> |
| | | <el-input |
| | | disabled="true" |
| | | v-model="security.age" |
| | | autocomplete="off" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col span="12"> |
| | | <el-form-item label="联系电话"> |
| | | <el-input |
| | | disabled="true" |
| | | v-model="security.phone" |
| | | autocomplete="off" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col span="12"> |
| | | <el-form-item label="家庭住址"> |
| | | <el-input |
| | | disabled="true" |
| | | v-model="security.address" |
| | | autocomplete="off" |
| | | ></el-input> |
| | | </el-form-item> |
| | |
| | | <el-input |
| | | disabled="true" |
| | | type="textarea" |
| | | v-model="security.snumber" |
| | | v-model="security.describe" |
| | | autocomplete="off" |
| | | ></el-input> |
| | | |
| | |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div> |
| | | <el-card class="scene-image-box"> |
| | | <el-image |
| | | :src="src" |
| | | v-for="(item, index) in imgSrc" |
| | | :key="index" |
| | | :src="item" |
| | | :preview-src-list="srcList" |
| | | style="width: 150px; margin-left: 5px" |
| | | v-show="imgSrc.length > 0" |
| | | ></el-image> |
| | | <el-image |
| | | :src="src" |
| | | :preview-src-list="srcList" |
| | | style="width: 150px; margin-left: 5px" |
| | | ></el-image> |
| | | <el-image |
| | | :src="src" |
| | | :preview-src-list="srcList" |
| | | style="width: 150px; margin-left: 5px" |
| | | ></el-image> |
| | | </div> |
| | | <span v-show="imgSrc.length == 0">暂无现场图片</span> |
| | | </el-card> |
| | | </div> |
| | | <div class="block"> |
| | | <div |
| | |
| | | </div> |
| | | </div> |
| | | <div> |
| | | <el-image :src="src" style="width: 150px; margin-left: 5px"> |
| | | <div slot="placeholder" class="image-slot"> |
| | | 加载中<span class="dot">...</span> |
| | | </div> |
| | | </el-image> |
| | | <video |
| | | :src="feedbackVideo" |
| | | style="width: 100%; height: 100%; object-fit: fill" |
| | | controls |
| | | v-show="feedbackVideo != ''" |
| | | ></video> |
| | | <span v-show="feedbackVideo == ''">暂无现场视频</span> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | id="old_video" |
| | | style="width: 100%; height: 100%; object-fit: fill" |
| | | controls |
| | | v-show="vaddress != ''" |
| | | ></video> |
| | | <span v-show="vaddress == ''">暂无历史视频</span> |
| | | </el-dialog> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | |
| | | <script> |
| | | import axios from "axios"; |
| | | |
| | | import { getclient } from "@/api/real/real"; |
| | | export default { |
| | | inject: ["reload"], |
| | | data() { |
| | |
| | | flag: true, |
| | | selectOptions: [], |
| | | receivingList: [], |
| | | security: { |
| | | snumber: 20018, |
| | | sname: "金同涛", |
| | | sex: "男", |
| | | age: 23, |
| | | phone: 1387975426, |
| | | address: "江西省南昌市西湖区", |
| | | }, |
| | | src: |
| | | "https://cube.elemecdn.com/6/94/4d3ea53c084bad6931a56d5158a48jpeg.jpeg", |
| | | srcList: [ |
| | | "https://cube.elemecdn.com/6/94/4d3ea53c084bad6931a56d5158a48jpeg.jpeg", |
| | | "https://cube.elemecdn.com/6/94/4d3ea53c084bad6931a56d5158a48jpeg.jpeg", |
| | | "https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg", |
| | | ], |
| | | security: {}, |
| | | imgSrc: [], |
| | | srcList: [], |
| | | form: {}, |
| | | itemOption: { |
| | | menuBtn: false, |
| | |
| | | baseUrl: "", |
| | | oldVideoSatart: false, |
| | | vaddress: null, |
| | | audios: [], |
| | | feedbackVideo: "", |
| | | }; |
| | | }, |
| | | created() { |
| | |
| | | }, |
| | | mounted() { |
| | | this.getList(); |
| | | |
| | | this.getAudios(); |
| | | this.getImgAndVideo(); |
| | | this.$refs.mapDiv.onload = () => { |
| | | window.frames[0].init("AlertSecurity", { |
| | | x: this.form.jd, |
| | |
| | | getList() { |
| | | var that = this; |
| | | axios |
| | | .get(`/api/blade-user/pages?current=1&size=9999&work_status=&deptId=${that.form.deptId}`) |
| | | .get( |
| | | `/api/blade-user/pages?current=1&size=9999&work_status=&deptId=${that.form.deptId}` |
| | | ) |
| | | .then(function (res) { |
| | | that.tableData = []; |
| | | var i = 0; |
| | |
| | | }); |
| | | } |
| | | }); |
| | | |
| | | console.log(that.tableData, 789, 10) |
| | | }); |
| | | }, |
| | | |
| | |
| | | this.$refs.multipleTable.clearSelection(); |
| | | } |
| | | }, |
| | | |
| | | getAudios() { |
| | | axios({ |
| | | method: "get", |
| | | url: "/api/blade-jfpts/avideo/list", |
| | | params: { |
| | | jid: this.form.id, |
| | | }, |
| | | }).then((resdata) => { |
| | | if (resdata.data.data.records.length > 0) |
| | | this.audios = resdata.data.data.records; |
| | | }); |
| | | }, |
| | | |
| | | getImgAndVideo() { |
| | | axios({ |
| | | method: "post", |
| | | url: "/api/blade-jfpts/feedback/feedback/selectFeedEdit", |
| | | params: { |
| | | jid: this.form.id, |
| | | }, |
| | | }).then((resdata) => { |
| | | if (resdata.data.data[0].List.length > 0) |
| | | this.security = resdata.data.data[0].List[0]; |
| | | if (resdata.data.data[0].tp.length > 0) { |
| | | this.imgSrc = resdata.data.data[0].tp; |
| | | this.srcList = resdata.data.data[0].tp; |
| | | } |
| | | if (resdata.data.data[0].sp.length > 0) { |
| | | this.feedbackVideo = resdata.data.data[0].sp[0]; |
| | | } |
| | | }); |
| | | }, |
| | | |
| | | oldOpenVideo() { |
| | | getclient(this.form.id).then((res) => { |
| | | if (res.data.data.vaddress != "") { |
| | | this.vaddress = res.data.data.vaddress; |
| | | } |
| | | this.oldVideoSatart = true; |
| | | console.log(this.oldVideoSatart); |
| | | }); |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | | |
| | | <style lang="scss"> |
| | | <style scoped lang="scss"> |
| | | .el-col { |
| | | height: 95%; |
| | | height: calc(100% - 5px); |
| | | } |
| | | |
| | | .trackClass { |
| | |
| | | padding: 0 10px !important; |
| | | } |
| | | } |
| | | |
| | | .audios-box, |
| | | .scene-image-box { |
| | | line-height: 32px !important; |
| | | height: auto; |
| | | max-height: 200px; |
| | | overflow-y: auto; |
| | | .el-card__body { |
| | | display: flex; |
| | | padding: 0 10px !important; |
| | | flex-wrap: wrap; |
| | | justify-content: center; |
| | | align-items: center; |
| | | .x-audio-wrap.inline { |
| | | margin: 10px; |
| | | } |
| | | .el-image { |
| | | margin: 10px; |
| | | width: 160px; |
| | | height: 80px; |
| | | } |
| | | } |
| | | } |
| | | </style> |