123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144 |
- <template>
- <el-dialog id="checkGraphy" title="添加平面图" :visible.sync="checkGraphyVisible" width="900px" @close="handleClose">
- <div class="bodys">
- <el-cascader :options="options" :show-all-levels="false" @change="handleChange" @active-item-change='handleItemChange' clearable
- placeholder="请选择模型文件" v-model="casVal"></el-cascader>
- <div>
- 或
- <el-button type="text">上传图片</el-button>
- </div>
- <!-- 展示框 -->
- <div class="showBox">
- <drawFloor ref="drawFloorDialog" :showTools="false" :id="0" :dialog="true"></drawFloor>
- </div>
- </div>
- <span slot="footer" class="dialog-footer">
- <el-button @click="handleClose">取 消</el-button>
- <el-button type="primary" @click="bindGraphy">确 定</el-button>
- </span>
- </el-dialog>
- </template>
- <script>
- import drawFloor from "./drawFloor";
- import { mapGetters, mapActions } from "vuex";
- import request from "@/api/model/file.js";
- import { bindFloorModel } from "@/api/model/file";
- export default {
- components: {
- drawFloor
- },
- computed: {
- ...mapGetters("layout", ["projectId"])
- },
- data() {
- return {
- casVal: [],
- jsonKey: "", //map.josn
- checkGraphyVisible: false,
- options: [],
- floor: {}, // 当前选中的楼层数据
- modelIdToFloorId: {}
- };
- },
- methods: {
- // 弹窗显示
- showDialog(floor) {
- this.floor = floor;
- this.checkGraphyVisible = true;
- },
- // 关闭弹窗
- handleClose() {
- this.checkGraphyVisible = false;
- this.casVal = []
- this.$refs.drawFloorDialog.clearGraphy()
- },
- // 更新楼层 平面图文件
- bindGraphy() {
- if (!this.jsonKey) {
- this.$message.warning("请选择模型文件");
- return
- }
- let pa = {
- FloorId: this.floor.FloorID,
- Id: this.modelIdToFloorId[this.jsonKey],
- BuildingId: this.floor.BuildID
- };
- bindFloorModel(pa, res => {
- this.$message.success("更新成功");
- this.handleClose()
- this.$emit('refresh', this.jsonKey)
- });
- },
- // 点击多级联动
- handleChange(val) {
- this.$refs.drawFloorDialog.initGraphy(val[1], 1)
- this.jsonKey = val[1]
- },
- // 通过id查询文件夹下模型文件
- handleItemChange(val) {
- let data = {
- FolderId: val[0],
- Status: '3, 31, 4',
- ProjectId: this.projectId
- };
- request.queryFloorList(data, res => {
- let tempArr = res.Content.map(t => {
- this.modelIdToFloorId[t.CurrentModelId] = t.Id;
- return {
- value: t.CurrentModelId,
- label: t.FloorName
- }
- })
- this.pushChild(this.options, tempArr, val[0])
- })
- },
- // 将模型文件list填到相应的文件夹下
- pushChild(options, arr, Code) {
- options.map(option => {
- if (option.value == Code) {
- option.children = arr;
- } else {
- if (option.children) {
- this.pushChild(option.children, arr, Code)
- }
- }
- }) },
- init() {
- this.getDirectory()
- },
- // 获取文件夹
- getDirectory() {
- request.queryModel("", res => {
- this.options = res.Content.map(t => {
- return {
- value: t.Id,
- label: t.Name,
- children: []
- }
- })
- });
- },
- },
- created() {
- this.init()
- },
- watch: {
- projectId() {
- this.init()
- }
- }
- };
- </script>
- <style lang="less">
- #checkGraphy {
- .bodys {
- .showBox {
- box-sizing: border-box;
- width: 100%;
- height: 300px;
- border: 1px #ccc solid;
- padding: 10px;
- }
- }
- }
- </style>
|