From f877ea29a3363133b7dc30d8adc477544a1eaf7f Mon Sep 17 00:00:00 2001
From: cqf <2252655793@qq.com>
Date: 星期四, 26 五月 2022 14:21:58 +0800
Subject: [PATCH] 文件名称如果不以a62b结尾,补上a62b

---
 src/views/hiddenDangerTroubleshootingList/index.vue |  262 +++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 259 insertions(+), 3 deletions(-)

diff --git a/src/views/hiddenDangerTroubleshootingList/index.vue b/src/views/hiddenDangerTroubleshootingList/index.vue
index 34cd1a0..3208d2d 100644
--- a/src/views/hiddenDangerTroubleshootingList/index.vue
+++ b/src/views/hiddenDangerTroubleshootingList/index.vue
@@ -1,13 +1,269 @@
-<template>
-
+<template xmlns="http://www.w3.org/1999/html">
+    <div class="whole"  v-loading="fullscreenLoading">
+        <div class="left-tree">
+            <el-tree
+                :data="data"
+                node-key="id"
+                default-expand-all
+                @node-click="clickType"
+                @node-drag-start="handleDragStart"
+                @node-drag-enter="handleDragEnter"
+                @node-drag-leave="handleDragLeave"
+                @node-drag-over="handleDragOver"
+                @node-drag-end="handleDragEnd"
+                @node-drop="handleDrop"
+                draggable
+                :allow-drop="allowDrop"
+                :allow-drag="allowDrag">
+                 <span slot-scope="{ node, data }" class="slot-t-node">
+              <template>
+                <i
+                    v-if="data.ChildItems&&data.ChildItems.length"
+                    :class="{
+                    'el-icon-folder': !node.expanded, // 节点收缩时的图标
+                    'el-icon-folder-opened': node.expanded, // 节点展开时的图标
+                  }"
+                    style="color: #409eff;"
+                />
+                <i v-else class="el-icon-folder-add" style="color: #EC933A;"/>
+                <span>{{ node.label }}</span>
+              </template>
+            </span>
+            </el-tree>
+        </div>
+        <div class="right-table" v-show="templateName!=null && templateName !=''">
+            <table border="1" style="background: #FFFFFF;width: 100%;">
+                <tr>
+                    <td class="table_td" style="text-align: right;">模板名称:</td>
+                    <td>
+                        <input class="input" style="line-height: 24px;height: 24px;"
+                               v-model="templateName">
+                    </td>
+                </tr>
+                <tr>
+                    <td class="table_td" style="text-align: right;">模板导入:</td>
+                    <td style="line-height: 24px;height: 24px;">
+                        <input class="input" type="file" @change="changeFile" accept=".xlsx,.xls" style="color: red;">
+                        <button class="btn" style="margin-left: 120px;" @click="importData"
+                                >导入
+                        </button>
+                        <button class="btn" @click="downTemplate">下载模板</button>
+                    </td>
+                </tr>
+                <tr class="table_tr">
+                    <td colspan="4" align="center">
+                        <button class="btn" @click="preview">预览</button>
+                    </td>
+                </tr>
+            </table>
+        </div>
+    </div>
 </template>
 
 <script>
+
+
+import {standard_template, standard_import_do,stand_list} from "@/api/sgyhpczl/hiddenDangerTroubleshootingList";
+
+
 export default {
-    name: "index"
+    name: "index",
+    data() {
+        return {
+            data: [{
+                id: 1,
+                label: '隐患排查清单',
+                icon: 'el-icon-folder',
+                click: true,
+                children: [{
+                    id: 4,
+                    label: '现场管理清单',
+                    icon: 'el-icon-folder',
+                    click: true
+                },
+                    {
+                        id: 5,
+                        label: '基础管理清单',
+                        icon: 'el-icon-success',
+                        click: true
+                    }]
+            }],
+            defaultProps: {
+                children: 'children',
+                label: 'label'
+            },
+            templateName: "",
+            file: null,
+            fullscreenLoading:false
+        };
+    },
+    mounted() {
+        this.getAllColumns()
+    },
+    methods: {
+        handleDragStart(node, ev) {
+            console.log('drag start', node);
+        },
+        handleDragEnter(draggingNode, dropNode, ev) {
+            console.log('tree drag enter: ', dropNode.label);
+        },
+        handleDragLeave(draggingNode, dropNode, ev) {
+            console.log('tree drag leave: ', dropNode.label);
+        },
+        handleDragOver(draggingNode, dropNode, ev) {
+            console.log('tree drag over: ', dropNode.label);
+        },
+        handleDragEnd(draggingNode, dropNode, dropType, ev) {
+            console.log('tree drag end: ', dropNode && dropNode.label, dropType);
+        },
+        handleDrop(draggingNode, dropNode, dropType, ev) {
+            console.log('tree drop: ', dropNode.label, dropType);
+        },
+        allowDrop(draggingNode, dropNode, type) {
+            if (dropNode.data.label === '二级 3-1') {
+                return type !== 'inner';
+            } else {
+                return true;
+            }
+        },
+        allowDrag(draggingNode) {
+            return draggingNode.data.label.indexOf('三级 3-2-2') === -1;
+        },
+        // 获取表格数据进行渲染
+        getAllColumns() {
+            var data = this.$route.query
+        },
+        handleChange(file, fileList) {
+            this.fileList = fileList.slice(-3);
+        },
+        clickType(item) {
+            if (item.click) {
+                this.templateName = item.label;
+            }
+        },
+        downTemplate() {
+            //删除分页参数
+            standard_template().then(res => {
+                var blob = new Blob([res.data])
+                var downloadElement = document.createElement('a')
+                var href = window.URL.createObjectURL(blob) //创建下载的链接
+                downloadElement.href = href
+                downloadElement.download = '隐患排查标准清单模板.xlsx' //下载后文件名
+                document.body.appendChild(downloadElement)
+                downloadElement.click() //点击下载
+                document.body.removeChild(downloadElement) //下载完成移除元素
+                window.URL.revokeObjectURL(href) //释放掉blob对象
+            }).catch(err => {
+                console.log(err)
+            })
+        },
+        importData() {
+            if (this.file == null) {
+                this.$message({type: 'warning', message: "请添加Excel附件", duration: 3000})
+                return;
+            }
+            console.log(this.file)
+            this.fullscreenLoading = true;
+            this.uploadByJsqd(this.file);
+        },
+        changeFile(file) {
+            this.file = event.target.files[0]
+        },
+        //文件发生改变就会触发的事件 导入
+        uploadByJsqd(file) {
+            //判断是否符合beforeAvatarUpload方法中的条件
+            var formdata = new FormData()
+            formdata.append('file', file)
+            formdata.append('standardType', this.templateName);
+
+            //importDevice:请求接口 formdata:传递参数
+            standard_import_do(formdata).then((res) => {
+                this.fullscreenLoading = false;
+                if (res.data.ok) {
+                    this.$message({type: 'success', message: res.data.msg, duration: 3000})
+                    this.getPageList()//调用表格方法,刷新页面
+                } else {
+                    this.$message({type: 'error', message: res.data.msg, duration: 3000})
+                }
+            })
+        },
+        preview(){
+            this.$router.push({
+                path: "/preview",
+                query:{"templateName":this.templateName}
+            })
+        }
+    }
 }
 </script>
 
 <style scoped>
+.whole {
+    display: flex;
+}
 
+.left-tree {
+    width: 15%;
+}
+
+.left-tree .el-tree {
+    background: #f0f6e4;
+    height: 400px;
+    overflow-y: scroll;
+    border: 1px solid #000;
+}
+
+/deep/ .is-leaf {
+    background: transparent !important;
+    width: 5px;
+    height: 5px;
+    background-size: 100%;
+    margin-right: 5px;
+}
+
+/deep/ .el-icon-caret-right:before {
+    content: '';
+}
+
+.right-table {
+    width: 85%;
+}
+
+table, table tr th, table tr td {
+    border: 1px solid #ccc;
+}
+
+.table_td {
+    background: #e4edf4;
+}
+
+.table_tr {
+    background: #e4edf4;
+    line-height: 40px;
+    height: 40px;
+}
+
+table {
+    width: 100%;
+    border-collapse: collapse;
+    font-size: 14px;
+}
+
+.input {
+    background: #f9f9f9;
+    border-width: 1px;
+    margin: 5px 0;
+}
+
+.btn {
+    background: url(../../assets/btn.gif) no-repeat;
+    width: 76px;
+    height: 26px;
+    line-height: 26px;
+    font-size: 14px;
+    border: none;
+    color: #fff;
+    cursor: pointer;
+    overflow: visible;
+}
 </style>

--
Gitblit v1.9.2