Merge branch 'bianww' into test-new

src/pages/main/departWorkLists/dialog.vue

@@ -0,0 +1,66 @@
+<template>
+  <el-dialog
+    :modal="modal"
+    :title="title"
+    :visible.sync="visible"
+    :fullscreen="fullscreen"
+    :key="reload"
+    :before-close="handleCancel"
+    :modal-append-to-body="false"
+    :width="width"
+    :show-close="false"
+    :destroy-on-close="destroy"
+  >
+    <!-- 表格主体部分 -->
+    <slot></slot>
+  </el-dialog>
+</template>
+
+<script>
+export default {
+  props: {
+    visible: {
+      type: Boolean,
+      default: false,
+    },
+    title: {
+      type: String,
+      default: "",
+    },
+    reload: {
+      type: Number,
+      default: 0,
+    },
+    width: {
+      type: String,
+      default: "500px",
+    },
+    fullscreen: {
+      type: Boolean,
+      default: false,
+    },
+    modal: {
+      type: Boolean,
+      default: true,
+    },
+    destroy: {
+      type: Boolean,
+      default: false
+    }
+  },
+  mounted() {
+  },
+  methods: {
+    //   确定的回调
+    handleConfirm() {
+      this.$emit("confirm", false);
+    },
+    //   取消的回调
+    handleCancel() {
+      this.$emit("cancel", false);
+    },
+  },
+};
+</script>
+
+<style></style>

src/pages/main/departWorkLists/export.js

@@ -0,0 +1,364 @@
+// import { createCellPos } from './translateNumToLetter'
+const Excel = require("exceljs");
+import FileSaver from "file-saver";
+export var exportExcel = function (luckysheet, value) {
+    // 参数为luckysheet.getluckysheetfile()获取的对象
+    // 1.创建工作簿，可以为工作簿添加属性
+    const workbook = new Excel.Workbook();
+    // 2.创建表格，第二个参数可以配置创建什么样的工作表
+    if (Object.prototype.toString.call(luckysheet) === "[object Object]") {
+        luckysheet = [luckysheet];
+    }
+    luckysheet.forEach(function (table) {
+        if (table.data.length === 0) return true;
+        // ws.getCell('B2').fill = fills.
+        const worksheet = workbook.addWorksheet(table.name);
+        const merge = (table.config && table.config.merge) || {};
+        const borderInfo = (table.config && table.config.borderInfo) || {};
+        // 3.设置单元格合并,设置单元格边框,设置单元格样式,设置值
+        setStyleAndValue(table.data, worksheet, table);
+        setMerge(merge, worksheet);
+        setBorder(borderInfo, worksheet);
+        return true;
+    });
+
+    // return
+    // 4.写入 buffer
+    const buffer = workbook.xlsx.writeBuffer().then((data) => {
+        // console.log('data', data)
+        const blob = new Blob([data], {
+            type: "application/vnd.ms-excel;charset=utf-8",
+        });
+        console.log("导出成功！2");
+        FileSaver.saveAs(blob, `${value}.xlsx`);
+    });
+    return buffer;
+};
+
+var setMerge = function (luckyMerge = {}, worksheet) {
+    const mergearr = Object.values(luckyMerge);
+    mergearr.forEach(function (elem) {
+        // elem格式：{r: 0, c: 0, rs: 1, cs: 2}
+        // 按开始行，开始列，结束行，结束列合并（相当于 K10:M12）
+        worksheet.mergeCells(
+            elem.r + 1,
+            elem.c + 1,
+            elem.r + elem.rs,
+            elem.c + elem.cs
+        );
+    });
+};
+
+var setBorder = function (luckyBorderInfo, worksheet) {
+    if (!Array.isArray(luckyBorderInfo)) return;
+    // console.log('luckyBorderInfo', luckyBorderInfo)
+    luckyBorderInfo.forEach(function (elem) {
+        // 现在只兼容到borderType 为range的情况
+        // console.log('ele', elem)
+        if (elem.rangeType === "range") {
+            let border = borderConvert(elem.borderType, elem.style, elem.color);
+            let rang = elem.range[0];
+            // console.log('range', rang)
+            let row = rang.row;
+            let column = rang.column;
+            for (let i = row[0] + 1; i < row[1] + 2; i++) {
+                for (let y = column[0] + 1; y < column[1] + 2; y++) {
+                    worksheet.getCell(i, y).border = border;
+                }
+            }
+        }
+        if (elem.rangeType === "cell") {
+            // col_index: 2
+            // row_index: 1
+            // b: {
+            //   color: '#d0d4e3'
+            //   style: 1
+            // }
+            const { col_index, row_index } = elem.value;
+            const borderData = Object.assign({}, elem.value);
+            delete borderData.col_index;
+            delete borderData.row_index;
+            let border = addborderToCell(borderData, row_index, col_index);
+            // console.log('bordre', border, borderData)
+            worksheet.getCell(row_index + 1, col_index + 1).border = border;
+        }
+        // console.log(rang.column_focus + 1, rang.row_focus + 1)
+        // worksheet.getCell(rang.row_focus + 1, rang.column_focus + 1).border = border
+    });
+};
+var setStyleAndValue = function (cellArr, worksheet, table) {
+    if (!Array.isArray(cellArr)) return;
+    cellArr.forEach(function (row, rowid) {
+        row.every(function (cell, columnid) {
+            if (!cell) return true;
+            let fill = fillConvert(cell.bg);
+
+            let font = fontConvert(
+                cell.ff,
+                cell.fc,
+                cell.bl,
+                cell.it,
+                cell.fs,
+                cell.cl,
+                cell.ul
+            );
+            let alignment = alignmentConvert(
+                cell.vt,
+                cell.ht,
+                cell.tb,
+                cell.tr
+            );
+            let value = "";
+
+            if (cell.f) {
+                value = { formula: cell.f, result: cell.v };
+            } else if (!cell.v && cell.ct && cell.ct.s) {
+                // xls转为xlsx之后，内部存在不同的格式，都会进到富文本里，即值不存在与cell.v，而是存在于cell.ct.s之后
+                // value = cell.ct.s[0].v
+                cell.ct.s.forEach((arr) => {
+                    value += (arr.m ? arr.m : arr.v);
+                });
+            } else {
+                value = cell.m ? cell.m : cell.v;
+            }
+            //  style 填入到_value中可以实现填充色
+            let letter = createCellPos(columnid);
+            let target = worksheet.getCell(letter + (rowid + 1));
+            // console.log('1233', letter + (rowid + 1))
+            // eslint-disable-next-line no-unused-vars
+            for (const key in fill) {
+                target.fill = fill;
+                break;
+            }
+            target.font = font;
+            target.alignment = alignment;
+            target.value = value;
+            return true;
+        });
+
+    });
+    let columnWidth = table.visibledatacolumn;
+    let rowHeight = table.visibledatarow;
+    for (let i = 0; i < cellArr.length; i++) {
+        let row1 = worksheet.getRow(i+1);
+        row1.height = i > 0 ? rowHeight[i] - rowHeight[i-1] : rowHeight[i]
+    }
+    for (let i = 0; i < cellArr[0].length; i++) {
+        let dobCol = worksheet.getColumn(createCellPos(i));
+        dobCol.width = i > 0 ? (columnWidth[i] - columnWidth[i - 1]) / 6.5 : columnWidth[i] / 6.5
+    }
+
+};
+
+var fillConvert = function (bg) {
+    if (!bg) {
+        return {};
+    }
+    // const bgc = bg.replace('#', '')
+    let fill = {
+        type: "pattern",
+        pattern: "solid",
+        fgColor: { argb: bg.replace("#", "") },
+    };
+    return fill;
+};
+
+var fontConvert = function (
+    ff = 0,
+    fc = "#000000",
+    bl = 0,
+    it = 0,
+    fs = 10,
+    cl = 0,
+    ul = 0
+) {
+    // luckysheet：ff(样式), fc(颜色), bl(粗体), it(斜体), fs(大小), cl(删除线), ul(下划线)
+    const luckyToExcel = {
+        0: "微软雅黑",
+        1: "宋体（Song）",
+        2: "黑体（ST Heiti）",
+        3: "楷体（ST Kaiti）",
+        4: "仿宋（ST FangSong）",
+        5: "新宋体（ST Song）",
+        6: "华文新魏",
+        7: "华文行楷",
+        8: "华文隶书",
+        9: "Arial",
+        10: "Times New Roman ",
+        11: "Tahoma ",
+        12: "Verdana",
+        num2bl: function (num) {
+            return num === 0 ? false : true;
+        },
+    };
+    // 出现Bug，导入的时候ff为luckyToExcel的val
+
+    let font = {
+        name: typeof ff === "number" ? luckyToExcel[ff] : ff,
+        family: 1,
+        size: fs,
+        color: { argb: fc.replace("#", "") },
+        bold: luckyToExcel.num2bl(bl),
+        italic: luckyToExcel.num2bl(it),
+        underline: luckyToExcel.num2bl(ul),
+        strike: luckyToExcel.num2bl(cl),
+    };
+
+    return font;
+};
+
+var alignmentConvert = function (
+    vt = "default",
+    ht = "default",
+    tb = "default",
+    tr = "default"
+) {
+    // luckysheet:vt(垂直), ht(水平), tb(换行), tr(旋转)
+    const luckyToExcel = {
+        vertical: {
+            0: "middle",
+            1: "top",
+            2: "bottom",
+            default: "top",
+        },
+        horizontal: {
+            0: "center",
+            1: "left",
+            2: "right",
+            default: "left",
+        },
+        wrapText: {
+            0: false,
+            1: false,
+            2: true,
+            default: false,
+        },
+        textRotation: {
+            0: 0,
+            1: 45,
+            2: -45,
+            3: "vertical",
+            4: 90,
+            5: -90,
+            default: 0,
+        },
+    };
+
+    let alignment = {
+        vertical: luckyToExcel.vertical[vt],
+        horizontal: luckyToExcel.horizontal[ht],
+        wrapText: luckyToExcel.wrapText[tb],
+        textRotation: luckyToExcel.textRotation[tr],
+    };
+    return alignment;
+};
+
+var borderConvert = function (borderType, style = 1, color = "#000") {
+    // 对应luckysheet的config中borderinfo的的参数
+    if (!borderType) {
+        return {};
+    }
+    const luckyToExcel = {
+        type: {
+            "border-all": "all",
+            "border-top": "top",
+            "border-right": "right",
+            "border-bottom": "bottom",
+            "border-left": "left",
+        },
+        style: {
+            0: "none",
+            1: "thin",
+            2: "hair",
+            3: "dotted",
+            4: "dashDot", // 'Dashed',
+            5: "dashDot",
+            6: "dashDotDot",
+            7: "double",
+            8: "medium",
+            9: "mediumDashed",
+            10: "mediumDashDot",
+            11: "mediumDashDotDot",
+            12: "slantDashDot",
+            13: "thick",
+        },
+    };
+    let template = {
+        style: luckyToExcel.style[style],
+        color: { argb: color.replace("#", "") },
+    };
+    let border = {};
+    if (luckyToExcel.type[borderType] === "all") {
+        border["top"] = template;
+        border["right"] = template;
+        border["bottom"] = template;
+        border["left"] = template;
+    } else {
+        border[luckyToExcel.type[borderType]] = template;
+    }
+    // console.log('border', border)
+    return border;
+};
+
+function addborderToCell(borders) {
+    let border = {};
+    const luckyExcel = {
+        type: {
+            l: "left",
+            r: "right",
+            b: "bottom",
+            t: "top",
+        },
+        style: {
+            0: "none",
+            1: "thin",
+            2: "hair",
+            3: "dotted",
+            4: "dashDot", // 'Dashed',
+            5: "dashDot",
+            6: "dashDotDot",
+            7: "double",
+            8: "medium",
+            9: "mediumDashed",
+            10: "mediumDashDot",
+            11: "mediumDashDotDot",
+            12: "slantDashDot",
+            13: "thick",
+        },
+    };
+    for (const bor in borders) {
+        if (borders[bor]) {
+            if (borders[bor].color.indexOf("rgb") === -1) {
+                border[luckyExcel.type[bor]] = {
+                    style: luckyExcel.style[borders[bor].style],
+                    color: { argb: borders[bor].color.replace("#", "") },
+                };
+            } else {
+                border[luckyExcel.type[bor]] = {
+                    style: luckyExcel.style[borders[bor].style],
+                    color: { argb: borders[bor].color },
+                };
+            }
+        } else {
+            border[luckyExcel.type[bor]] = {
+                color: "#000000",
+                style: 1,
+            };
+        }
+    }
+    return border;
+}
+
+function createCellPos(n) {
+    let ordA = "A".charCodeAt(0);
+
+    let ordZ = "Z".charCodeAt(0);
+    let len = ordZ - ordA + 1;
+    let s = "";
+    while (n >= 0) {
+        s = String.fromCharCode((n % len) + ordA) + s;
+
+        n = Math.floor(n / len) - 1;
+    }
+    return s;
+}

src/pages/main/departWorkLists/index.vue

@@ -0,0 +1,916 @@
+<template>
+    <div class="container">
+        <div class="main-box" :key="simpleSheetKey">
+            <div class="inner-left" style="overflow: hidden">
+                <div class="button-list">
+                    <el-button size="mini" type="" @click="addMenu('root')"  :disabled="!authData" >
+                        添加根目录</el-button
+                    >
+                    <el-button size="mini" type="" @click="addMenu('detail')" :disabled="!authData">
+                        添加清单目录</el-button
+                    >
+                    <el-button size="medium" type="" @click="delMenu" :disabled="!authData"> 删除 </el-button>
+                </div>
+                <el-alert type="warning" :closable="false">
+                    <template slot="title">
+                        {{
+                        checkedNode && checkedNode.length > 0
+                        ? "当前选择节点名称：" + checkedNode[0].name
+                        : "当前无选择节点"
+                        }}
+                    </template>
+                </el-alert>
+                <div style="margin: 10px 0">
+                    <el-input
+                        size="medium"
+                        placeholder="请输入内容"
+                        v-model="filterText"
+                        class="input-with-select"
+                        clearable
+                        @change="
+                                () => {
+                                  if (!filterText) {
+                                    searchMenu();
+                                  }
+                                }
+                            "
+                    >
+                        <el-button
+                            slot="append"
+                            @click="searchMenu"
+                            icon="el-icon-search"
+                        ></el-button>
+                    </el-input>
+                </div>
+                <div
+                    style="
+                          height: calc(100% - 160px);
+                          overflow-y: auto;
+                          margin-top: 20px;
+                        "
+                >
+                    <el-tree
+                        ref="catalogTree"
+                        :expand-on-click-node="true"
+                        :auto-expand-parent="true"
+                        :default-expand-all="true"
+                        :props="defaultProps"
+                        @node-click="nodeClick"
+                        :filter-node-method="filterNode"
+                        :data="menuList"
+                        node-key="id"
+                    >
+                            <span class="custom-tree-node" slot-scope="{ node }">
+                                <span>
+                                  <span style="color: #009cff" class=""></span>
+                                  <span
+                                      :style="
+                                      node.data.parentCode===0
+                                        ? 'font-size:14px;padding-left:5px'
+                                        : 'font-size:12px;padding-left:5px'
+                                    "
+                                  >{{ node.data.name }}</span>
+                                </span>
+                            </span>
+                    </el-tree>
+                </div>
+            </div>
+            <div  class="inner-right" v-if="addOnlineWordFlag">
+                <simple-dialog
+                    v-if="fullscreen"
+                    :fullscreen="fullscreen"
+                    :visible="addOnlineWordFlag"
+                    width="1200px"
+                >
+                    <simple-sheet ref="simpleSheet" :type="type"
+                                  :fullscreen="fullscreen"
+                                  @saveData="handleSaveData"
+                                  @handleFullscreen="handleFullscreen"
+                                  @save="handleSave"
+                                  :workName="workName"
+                                  :work-data="workData"
+                                  :id="tmpId" :mkdirId="params.mkdirId" :isCreater="isCreater"/>
+                </simple-dialog>
+                <simple-sheet v-else :type="type"
+                              :fullscreen="fullscreen"
+                              @saveData="handleSaveData"
+                              @handleFullscreen="handleFullscreen"
+                              :workName="workName"
+                              :work-data="workData"
+                              @save="handleSave"
+                              :id="tmpId" :mkdirId="params.mkdirId" :isCreater="isCreater"/>
+            </div>
+
+            <div class="inner-right" v-if="workListFlag">
+                <div class="search">
+                    <span>{{ catalogueName }}</span>
+                </div>
+                <div style="margin-bottom: 10px;margin-top: 10px;">
+                    <el-button
+                        v-if="checkedNode && checkedNode.length === 2"
+                        type="primary"
+                        size="mini"
+                        @click="addFile('add',{delFlag:'1'})"
+                        style="width: 80px"
+                    >
+                        新建
+                    </el-button>
+                </div>
+                <div class="tabBoxClass">
+                    <el-table
+                        height="calc(100% )"
+                        class="com-table"
+                        ref="multipleTable"
+                        :data="tableData"
+                        tooltip-effect="dark"
+                        border
+                        size="small"
+                        style="width: 100%"
+                        v-loading="loading"
+                    >
+                        <el-table-column
+                            prop="templateName"
+                            show-overflow-tooltip
+                            label="名称"
+                            align="center"
+                        >
+                        </el-table-column>
+                        <el-table-column
+                            prop="createTime"
+                            show-overflow-tooltip
+                            label="创建时间"
+                            width="150"
+                            align="center"
+                        />
+                        <el-table-column
+                            prop="createCity"
+                            show-overflow-tooltip
+                            label="创建科室"
+                            align="center"
+                        >
+                        </el-table-column>
+                        <el-table-column
+                            prop="createBy"
+                            show-overflow-tooltip
+                            label="创建人"
+                            width="150"
+                            align="center"
+                        >
+                        </el-table-column>
+                        <el-table-column
+                            prop="stateNm"
+                            show-overflow-tooltip
+                            label="状态"
+                            width="150"
+                            align="center"
+                        >
+                        </el-table-column>
+                        <el-table-column label="操作" align="center" width="150">
+                            <template slot-scope="scope">
+                                <el-button
+                                    :disabled="scope.row.editFlag=='1'?false:true"
+                                    class="font-btn"
+                                    size="mini"
+                                    type="text"
+                                    plain
+                                    @click="addFile('edit',scope.row)"
+                                >编辑
+                                </el-button>
+                                <el-button
+                                    class="font-btn"
+                                    size="mini"
+                                    type="text"
+                                    plain
+                                    @click="addFile('view',scope.row)"
+                                >查看
+                                </el-button>
+                                <el-button
+                                    v-show="scope.row.delFlag=='1'?true:false"
+                                    class="font-btn"
+                                    size="mini"
+                                    type="text"
+                                    plain
+                                    @click="deleteOne(scope.row)"
+                                >删除
+                                </el-button>
+                            </template>
+                        </el-table-column>
+                    </el-table>
+                    <!--                        <el-pagination-->
+                    <!--                            class="pageBox"-->
+                    <!--                            @current-change="currchange"-->
+                    <!--                            layout="prev, pager, next"-->
+                    <!--                            background-->
+                    <!--                            :total="total"-->
+                    <!--                        >-->
+                    <!--                        </el-pagination>-->
+                </div>
+            </div>
+        </div>
+        <el-dialog
+            class="p-new-box"
+            size="50%"
+            title="新增目录"
+            :append-to-body="true"
+            :visible.sync="addDialogStatus"
+            :close-on-click-modal="false"
+        >
+            <el-form
+                :model="formData"
+                :rules="rules"
+                ref="ruleForm"
+                label-width="100px"
+                class="demo-ruleForm"
+                style="width: 90%; margin: 30px auto"
+            >
+                <el-form-item label="目录名称:" prop="name">
+                    <el-input
+                        v-model="formData.name"
+                        placeholder="请输入目录名称"
+                    ></el-input>
+                </el-form-item>
+                <el-form-item
+                    label="父级目录:"
+                    prop="parentName"
+                >
+                    <el-input
+                        disabled
+                        v-model="formData.parentName"
+                        placeholder="请输入父级名称"
+                    ></el-input>
+                </el-form-item>
+                <el-form-item label="操作人:" prop="createName">
+                    <el-input
+                        v-model="formData.createId"
+                        disabled
+                    ></el-input>
+                </el-form-item>
+                <div class="drawer-footer" style="text-align: right">
+                    <el-button
+                        type="primary"
+                        size="medium"
+                        @click="submitForm('ruleForm')"
+                    >确认</el-button
+                    >
+                    <el-button
+                        style="margin-right: 40px"
+                        size="medium"
+                        @click="resetForm('ruleForm')"
+                    >取消</el-button
+                    >
+                </div>
+            </el-form>
+        </el-dialog>
+    </div>
+</template>
+<script>
+import Vue from 'vue';
+import simpleSheet from "./sheet.vue";
+import simpleDialog from "./dialog.vue";
+export default {
+    components: {
+        simpleSheet,
+        simpleDialog
+    },
+    data() {
+        return {
+            catalogueName:"部门工作清单",
+            isCreater:"0",//1：创建者 0：非创建者
+            addDialogStatus: false,
+            tooltit: "部门工作清单",
+            filterText: "", // tree搜索value
+            menuList: [], // tree数据源
+            checkedNode: [], // 选中节点信息
+            authData: false, //是否有权限 false无全权限
+            fullscreen: false,
+            formData: {
+                name: "",
+                parentCode: "",
+                parentName: "",
+                createId: JSON.parse(sessionStorage.userInfo).loginNo,
+            },
+            defaultProps: {
+                children: "children",
+                label: "name",
+            },
+            rules: {
+                name: [
+                    {
+                        required: true,
+                        message: "请输入目录名称",
+                        trigger: "change",
+                    },
+                ],
+            },
+
+            tmpId:'',
+            rowData:{},
+            type:'add',
+            workListFlag:true,
+            addOnlineWordFlag:false,
+            loading: false,
+            tableData: [
+                // {
+                //     templateName:"测试",
+                //     createTime:"2022-6-12",
+                //     createCity:"规划开发室",
+                //     createBy:"范岩",
+                //     state:"开",
+                //     delFlag:"1",//1:代表创建人有删除权限 0:不显示
+                //     editFlag:"0"//1:不置灰（状态state字段为开时）；0：置灰（状态state字段为关时且不是创建人时）
+                // }
+            ], // 表格数据源
+            infolist: {
+                isFile: "1",
+                title: "", // 材料名称
+                meeting: "", // 会议名称
+                titleBg: "", // 材料背景
+                auth: "1", // 查看权限
+                mkFileShareAttachList: [], // 附件数据
+                parentId: "",
+            }, // 提交表单数据源
+            filerules: {
+                title: [
+                    {
+                        required: true,
+                        message: "请输入材料名称",
+                        trigger: "change",
+                    },
+                ],
+                meeting: [
+                    {
+                        required: true,
+                        message: "请输入会议名称",
+                        trigger: "change",
+                    },
+                ],
+                titleBg: [
+                    {
+                        required: true,
+                        message: "请输入材料背景",
+                        trigger: "change",
+                    },
+                ],
+            },
+            subType: "",
+            total: 0,
+            pageSize: 1,
+            params: {
+                id: "",
+                mkdirId:"3"
+            },
+            paramsSearch: {
+                isFile: "1",
+                id: "",
+            },
+            fileInfo: {
+                type: "bt1n",
+                typename: "上传文件",
+                limit: 5,
+                url: "/market/cmkFileShareNet/upload",
+                fileList: [],
+            },
+            titname: "新增",
+            dialogStatus: false,
+            attList: [],
+            simpleSheetKey:0,
+            workName:'',
+            workData:null,
+        };
+    },
+    methods: {
+        handleSaveData(workName, workData){
+            this.workName = workName;
+            this.workData = workData;
+        },
+        handleFullscreen(fullscreen){
+            if (fullscreen){
+                Vue.set(this, 'fullscreen', fullscreen)
+                /*this.$nextTick(()=>{
+                    this.$refs.simpleSheet.handleFullscreenOption()
+                })*/
+            }else {
+                this.$nextTick(()=>{
+                    this.$refs.simpleSheet.handleFullscreenOption()
+                })
+                Vue.set(this, 'fullscreen', fullscreen)
+            }
+
+        },
+        saveData(workName, workData){
+            this.workName = workName;
+            this.workData = workData;
+        },
+        // 搜索按钮事件
+        searchMenu() {
+            this.$refs.catalogTree.filter(this.filterText);
+        },
+        // 新增目录-表单提交
+        async submitForm(formName) {
+            let valid = await this.$refs[formName].validate().catch((err) => err);
+            if (valid) {
+                this.$http({
+                    url:"/market/mkWorkListCatalogue/add",
+                    method: "post",
+                    headers: {
+                        "Content-Type": "application/json",
+                    },
+                    data: this.formData,
+                }).then((res) => {
+                    if (res.data.result === 0) {
+                        this.$message({
+                            type: "success",
+                            message: res.data.desc,
+                        });
+                        this.checkedNode = [];
+                        this.getData();
+                        this.$refs[formName].resetFields();
+                        this.addDialogStatus = false;
+                    }else {
+                        this.$message({
+                            type: "error",
+                            message: res.data.desc,
+                        });
+                    }
+                });
+            }
+        },
+        // 取消新增目录
+        resetForm(formName) {
+            this.$refs[formName].resetFields();
+            this.addDialogStatus = false;
+        },
+        // 新增目录
+        addMenu(flag) {
+            if (flag === 'detail'){
+                if (!this.checkedNode || this.checkedNode.length !== 1){
+                    this.$message({
+                        type: "warning",
+                        message: "请先选择根目录",
+                    });
+                    return;
+                }
+                this.formData.parentCode = this.checkedNode[0].id
+                this.formData.parentName = this.checkedNode[0].name
+            }else if (flag === 'root'){
+                this.formData.parentCode = 0;
+                this.formData.parentName = ''
+            }
+            this.addDialogStatus = true
+        },
+        // 删除目录
+        delMenu() {
+            if (!this.checkedNode || this.checkedNode.length !== 2) {
+                this.$message("请先选中要删除的目录");
+            } else {
+                this.$confirm("即将删除此条数据, 是否删除?", "提示", {
+                    confirmButtonText: "确定",
+                    cancelButtonText: "取消",
+                    type: "warning",
+                })
+                    .then(() => {
+                        this.$http({
+                            url: "/market/mkWorkListCatalogue/del",
+                            method: "post",
+                            headers: {
+                                "Content-Type": "application/json",
+                            },
+                            data: {
+                                id: this.checkedNode[0].id,
+                            },
+                        }).then((res) => {
+                            if (res.data.result === 0) {
+                                this.$notify({
+                                    title: "成功",
+                                    message: res.data.desc,
+                                    type: "success",
+                                });
+                                this.checkedNode = [];
+                                this.getData();
+                            }else if(res.data.result === 1) {
+                                this.$notify({
+                                    title: "失败",
+                                    message: res.data.desc,
+                                    type: "error",
+                                });
+                            }
+                        });
+                    })
+                    .catch(() => {});
+            }
+        },
+        // tree过滤方法
+        filterNode(value, data) {
+            if (!value) return true;
+            return data.name.indexOf(value) !== -1;
+        },
+        // 点击树节点事件
+        nodeClick(data, node) {
+            this.formData.parentCode = data.parentCode;
+            let clickNode = []
+            this.getParent(node, clickNode)
+            this.checkedNode = clickNode
+            if (clickNode.length === 2){
+                this.catalogueName = clickNode[1].name + '-' + clickNode[0].name
+                this.params.mkdirId = clickNode[0].id + ''
+                this.getList(this.params, this.pageSize);
+            }else if(clickNode.length === 1){
+                //父目录，则显示新建按钮只显示表头
+                this.catalogueName =data.name
+                this.params.mkdirId=data.id;
+                this.getList(this.params, this.pageSize);
+            }
+            //返回列表页面
+            this.addOnlineWordFlag=false;
+            this.workListFlag=true;
+        },
+        getParent(node, list){
+            if (node.level > 0){
+                list.push(node.data)
+                this.getParent(node.parent, list);
+            }
+        },
+        // 获取目录
+        getData() {
+            this.$http({
+                url: "/market/mkWorkListCatalogue/queryList",
+                method: "post",
+                headers: {
+                    "Content-Type": "application/json",
+                },
+                data: { isFile: "0" },
+            }).then((res) => {
+                if (res.data.result === 0) {
+                    this.menuList = res.data.body;
+                }else {
+                    this.$message({
+                        message: res.data.desc,
+                        type: "error",
+                    });
+                }
+            });
+        },
+        // 获取权限
+        getAuthData() {
+            /*let menus = JSON.parse(window.sessionStorage.childrenMenus);
+            for(let n=0;n<menus.length;n++){
+                if (menus[n].jspUrl === "/workListCatalogueAuth") {
+                   this.authData = true
+                }
+            }*/
+            this.authData = true
+        },
+
+
+        handleSave() {
+            // switch (type) {
+            //     case "add":
+            console.log("************")
+            this.addOnlineWordFlag=false;
+            this.workListFlag=true;
+                //     break;
+                // case "edit":
+                //     this.handleVisible("edit");
+                //     break;
+            // }
+            //调用list列表接口根据目录ID
+            // this.handleInit();
+            this.getList(this.params, this.pageSize);
+        },
+        //搜索数据
+        searchInfo(v) {
+            this.paramsSearch = {};
+            v[0] ? this.paramsSearch.title = v[0] : '';
+            this.paramsSearch.isFile = "1";
+            // this.paramsSearch.parentId = this.infolist.parentId;
+            this.pageSize = 1;//重置分页
+            this.getList(this.paramsSearch, this.pageSize);
+        },
+        // 新增在线文档
+        addFile(type,data) {
+            // this.titname = "新增";
+            this.workName = ""
+            this.workData = null
+            this.workListFlag = false;
+            this.addOnlineWordFlag = true;
+            this.type=type;
+            this.isCreater = data.delFlag;
+            this.tmpId=data.id
+            // switch (type) {
+            //     case "add":
+            //         break;
+            //     case "edit":
+            //
+            //         this.rowData=data;
+            //         break;
+            //     case "view":
+            //         this.rowData=data;
+            //         break;
+            // }
+        },
+        // 上传回调
+        uploadBack(v) {
+            this.attList = v;
+        },
+        deleteOne(val) {
+            this.$confirm("即将删除此条数据, 是否删除?", "提示", {
+                confirmButtonText: "确定",
+                cancelButtonText: "取消",
+                type: "warning",
+            })
+                .then(() => {
+                    this.pageSize = 1;
+                    this.$http({
+                        url: "/market/workLists/del",
+                        method: "post",
+                        headers: {
+                            "Content-Type": "application/json",
+                        },
+                        data: {
+                            id: val.id,
+                        },
+                    }).then((res) => {
+                        if (res.data.result == 0) {
+                            this.$message({
+                                message: "删除成功",
+                                type: "success",
+                            });
+                            this.getList(this.params, this.pageSize);
+                        }else if(res.data.result == 1) {
+                            this.$message({
+                                message: res.data.body,
+                                type: "error",
+                            });
+                        }
+                    });
+                })
+                .catch(() => {});
+        },
+        //功能栏
+        iconCli(v) {
+            if (v === 1) {
+                this.getList(this.params, this.pageSize);
+            }
+            if (v === 2) {
+                this.fullscreen = !this.fullscreen;
+            }
+        },
+        // 分页
+        currchange(v) {
+            this.pageSize = v;
+            this.getList(this.params, this.pageSize);
+        },
+        //获取列表
+        getList(v, n) {
+            this.pageSize = n;
+            this.loading = true;
+            this.tableData = [];
+            this.$http({
+                url: "/market/workLists/list",
+                method: "post",
+                headers: {
+                    "Content-Type": "application/json",
+                    page: '{"pageNo":"' + n + '","pageSize":"10"}',
+                },
+                data: v,
+            }).then((res) => {
+                if(res.data.result==0){
+                    this.tableData=res.data.body
+                    this.tableData.forEach(item=>{
+                        item.stateNm=item.state=='1'?'开启':'关闭';
+                    });
+                }else{
+                    this.$message({
+                        message: "获取失败",
+                        type: "error",
+                    });
+                }
+                // this.total = res.data.totalRecord;
+                this.loading = false;
+            });
+        },
+    },
+    mounted() {
+        this.getData();
+        this.getAuthData();
+    },
+};
+</script>
+<style scoped lang="scss">
+.radviv div {
+    width: 80% !important;
+}
+.pageBox {
+    text-align: right;
+    margin-top: 10px;
+}
+
+.info-line {
+    width: 100%;
+    display: block;
+    // padding-left: 20px;
+
+    div {
+        width: 50%;
+        display: inline-block;
+    }
+
+    span {
+        width: 100px;
+        display: inline-block;
+        text-align: right;
+        font-weight: bold;
+        font-size: 14px;
+        padding-right: 15px;
+
+        i {
+            color: red;
+            display: inline-block;
+            padding-right: 5px;
+        }
+    }
+
+    .el-select,
+    .el-input {
+        width: calc(100% - 100px);
+    }
+
+    .tree {
+        width: calc(100% - 100px);
+    }
+}
+
+.online {
+    width: 100%;
+
+    .el-select {
+        width: calc(100% - 100px);
+    }
+
+    span {
+        vertical-align: top;
+    }
+
+    .el-textarea {
+        width: calc(100% - 100px);
+    }
+}
+</style>
+
+<style lang="scss" scoped>
+.titbox {
+    div {
+        float: right;
+
+        i {
+            font-size: 22px;
+            margin-left: 20px;
+            cursor: pointer;
+        }
+    }
+}
+.container {
+    background-color: #f0f2f5;
+    .clearStyle {
+        cursor: pointer;
+        color: #0b82ff;
+    }
+    .el-col {
+        background-color: white;
+        padding: 0 20px;
+    }
+
+    .container-box {
+        padding: 0;
+        margin-top: 0;
+        height: 100%;
+        background-color: white;
+        padding: 20px;
+    }
+
+    .main-box {
+        overflow: hidden;
+        display: flex;
+        background-color: white;
+        padding: 20px 0;
+
+        > div {
+            background-color: white;
+        }
+
+        .inner-left {
+            width: 22%;
+            padding: 0 20px;
+            border: 1px solid #ddd;
+            border-radius: 5px;
+            height: calc(100vh - 220px);
+
+             .canel-style {
+             	color: #1890ff;
+             	cursor: pointer;
+             	padding-left: 10px;
+             }
+        }
+
+        .inner-right {
+            width: 76%;
+            margin-left: 2%;
+            overflow-y: auto;
+            //   border-left: 1px solid #ddd;
+            height: calc(100vh - 220px);
+            .tabBoxClass {
+                height: calc(100% - 85px);
+            }
+        }
+    }
+}
+
+.button-list {
+    padding: 30px 0 10px 0;
+    display: flex;
+    //   justify-content: space-between;
+}
+
+.choice-style {
+    background: rgb(255, 255, 255);
+}
+
+.tree-action {
+    bottom: 0;
+    width: 100%;
+    // border-top: 1px solid #e8e8e8;
+    padding: 10px 16px;
+    text-align: left;
+    left: 0;
+    background: #fff;
+    border-radius: 0 0 2px 2px;
+}
+
+.tree-line {
+    // .el-tree-node__content {
+    //   padding-left: 0 !important;
+    // }
+
+    .el-tree-node__expand-icon.is-leaf {
+        display: none !important;
+    }
+
+    .el-tree-node {
+        position: relative;
+        padding-left: 16px; // 缩进量
+    }
+
+    .el-tree-node__children {
+        padding-left: 16px; // 缩进量
+    }
+
+    // 竖线
+    .el-tree-node::before {
+        content: "";
+        height: 100%;
+        width: 1px;
+        position: absolute;
+        left: -3px;
+        top: -17px;
+        border-width: 1px;
+        border-left: 1px dashed #52627c;
+    }
+
+    // 当前层最后一个节点的竖线高度固定
+    .el-tree-node:last-child::before {
+        height: 38px; // 可以自己调节到合适数值
+    }
+
+    // 横线
+    .el-tree-node::after {
+        content: "";
+        width: 24px;
+        height: 20px;
+        position: absolute;
+        left: -3px;
+        top: 20px;
+        border-width: 1px;
+        border-top: 1px dashed #52627c;
+    }
+
+    // 去掉最顶层的虚线，放最下面样式才不会被上面的覆盖了
+    & > .el-tree-node::after {
+        border-top: none;
+    }
+
+    & > .el-tree-node::before {
+        border-left: none;
+    }
+
+    // 展开关闭的icon
+    .el-tree-node__expand-icon {
+        font-size: 16px;
+
+        // 叶子节点（无子节点）
+        &.is-leaf {
+            color: transparent;
+            // display: none; // 也可以去掉
+        }
+    }
+}
+</style>

src/pages/main/departWorkLists/sheet.vue

@@ -0,0 +1,603 @@
+<!--
+ * @Author       : yuanrunwei
+ * @Date         : 2021-12-04 14:23:58
+ * @LastEditors: daiqisheng
+ * @LastEditTime: 2022-05-10 11:24:05
+ * @FilePath     : \spfm-market-front\src\pages\main\performance\components\sheet.vue
+-->
+<template>
+    <fullscreen id="containerClass" :fullscreen.sync="fullscreen" class="containerClass" style=" background-color: #ffffff">
+        <div class="sheet-container" id="full-container">
+            <div style="    margin-top: 20px; margin-left: 30px;" >
+                <span style="  font-size: small;margin-right: 10px;">控制权限</span>
+                <el-select v-model="state" placeholder="请选择" :disabled="this.type=='view'|| (this.type=='edit' && this.isCreater !='1') ?true:false " size="mini">
+                    <el-option
+                        v-for="item in options"
+                        :key="item.value"
+                        :label="item.label"
+                        :value="item.value">
+                    </el-option>
+                </el-select>
+            </div>
+            <div class="flex-justify-align-end margin-bottom-20">
+                <!--      <span-->
+                <!--        v-if="['template'].includes(attribute)"-->
+                <!--        ><span class="sheet-container-require">*</span>模板类型:</span-->
+                <!--      >-->
+                <div style="display: flex;
+                        margin-right: 20px;
+                        background: rgb(2, 135, 251);
+                        padding: 2px;
+                        border-radius: 4px;">
+                    <el-upload
+                        action
+                        :http-request="request"
+                        :on-change="handleChange"
+                        :show-file-list="false"
+                        :disabled="this.type=='view'?true:false"
+                    >
+                        <el-button :disabled="this.type=='view'?true:false" size="mini">选择文件</el-button>
+                    </el-upload>
+                    <span style="font-size: 12px;margin-right: 5px;line-height: 2;color: white;">{{ fileListName }}</span>
+                </div>
+                <el-button
+                    type="danger"
+                    @click="handleResave"
+                    size="mini"
+                    :disabled="this.type=='view'?true:false"
+                >保存</el-button
+                >
+                <!--            :disabled="handleForbid()"-->
+
+                <el-button  size="mini" type="danger" @click="handleDownload">导出</el-button>
+                <el-button size="mini" type="primary" @click="returnList">返回</el-button>
+                <el-button size="mini" type="primary" @click="handleFullscreen">全屏显示</el-button>
+            </div>
+            <div id="luckysheet" class="sheet-container-block_class" ></div>
+        </div>
+    </fullscreen>
+</template>
+
+<script>
+import luckyexcel from "luckyexcel";
+import { exportExcel } from "./export";
+export default {
+    components: {
+    },
+    props: {
+        isCreater: {
+            type: String,
+            default: "",
+        },
+        type: {
+            type: String,
+            default: "view", // view 查看 edit 编辑
+        },
+        attribute: {
+            type: String,
+            default: "template", // template 模板 order 工单 file 文件
+        },
+        id: {
+            default: null,
+        },
+        // 接收人
+        receiver: {
+            type: String,
+            default: "",
+        },
+        // 模板状态按钮判断
+        status: { type: String, default: "" },
+        mkdirId:{
+            type: String,
+            default:'',
+        },
+        fullscreen:{
+            type:Boolean,
+            default:false
+        },
+        workName:{
+            type:String
+        },
+        workData:{
+            type:Object
+        }
+    },
+    data() {
+        return {
+            options: [{
+                value: '1',
+                label: '开启'
+            },{
+                value: '0',
+                label: '关闭'
+            }],
+            state:'1',
+            form: {
+                charge: [
+                    {
+                        person: [],
+                        col_start: "",
+                        col_end: "",
+                        row_start: "",
+                        row_end: "",
+                    },
+                ],
+                array: [],
+                type: null,
+                permission_type: null,
+                col_start: "",
+                col_end: "",
+                row_start: "",
+                row_end: "",
+            },
+            approveForm: {
+                type: "",
+                comments: "",
+                list: [
+                    {
+                        label: "同意",
+                        value: "同意",
+                    },
+                    {
+                        label: "不同意",
+                        value: "不同意",
+                    },
+                    {
+                        label: "其他",
+                        value: "3",
+                    },
+                ],
+            },
+            superviserules: {
+                distribute: [
+                    { required: true, message: "请选择派发周期", trigger: "change" },
+                ],
+                write: [
+                    { required: true, message: "请选择填报周期", trigger: "change" },
+                ],
+                endTime: [
+                    { required: true, message: "请选择截止时间", trigger: "change" },
+                ],
+            },
+            superviseForm: {
+                distribute: "", // 派单周期
+                write: "", // 填写周期
+                endTime: "", // 截止时间
+            },
+            originSuperviseForm: {},
+            pickOptions: {
+                disabledDate(time) {
+                    return time.getTime() < new Date().getTime() - 8.64e7;
+                },
+            },
+            pickWrite: {
+                disabledDate(time) {
+                    return time.getTime() < new Date().getTime() - 8.64e7;
+                },
+            },
+            // 可提交标志
+            addFlag: "0",
+            // 督办标志
+            superviseFlag: null,
+            rowList: [],
+            isDisable: true,
+            issued_id: null,
+            template_id: null,
+            visible: false,
+            templateType: "",
+            // 督办
+            supervise: false,
+            manager_approve: false,
+            row_list: [],
+            column_list: [],
+            charge_list: [],
+            type_options: [
+                {
+                    value: 1,
+                    label: "按行",
+                },
+                // {
+                //     value: 2,
+                //     label: "按列",
+                // },
+            ],
+            fileListName:'未选择任何文件'
+        };
+    },
+    methods: {
+        request(){},
+        handleInit() {
+            if (this.id) {
+                if (this.workName){
+                    this.handleCreate({
+                        json: this.workData,
+                        name: this.workName,
+                        type: "json",
+                    });
+                }else {
+                    this.handleQuery();
+                }
+            } else {
+                if (this.workName){
+                    this.handleCreate({
+                        json: this.workData,
+                        name: this.workName,
+                        type: "json",
+                    });
+                }else {
+                    this.handleCreate();
+                }
+            }
+            if (this.fullscreen){
+                this.$nextTick(()=>{
+                    this.handleFullscreenOption();
+                })
+            }
+        },
+        returnList(){
+            if (this.fullscreen){
+                this.handleFullscreenOption()
+                this.$emit("handleFullscreen", false)
+            }
+            this.$emit("save");
+        },
+        handleAllow() {
+            //查看无法编辑
+            return this.type=="view"?false:true;
+        },
+        async handleQuery() {
+            const {
+                data: {
+                    templateContent,
+                    templateName,
+                    state,
+                },
+            } = await this.$http({
+                url: "/market/workLists/getWorkById",
+                method: "post",
+                headers: {
+                    "Content-Type": "application/json",
+                },
+                data: {id:this.id},
+            });
+            this.state=state;
+            this.handleCreate({
+                json: templateContent ? JSON.parse(templateContent) : {},
+                name: templateName,
+                type: "json",
+            });
+        },
+        async handleCreate({ file, json, type, name } = {}) {
+            let that = this;
+            if('add'== this.type){
+                window.luckysheet.destroy();
+                window.luckysheet.create({
+                    container: "luckysheet",
+                    lang: "zh",
+                    showsheetbar: false,
+                    data:[{}],
+                    userInfo:undefined,
+                    title:"请输入标题"
+                })
+                if (!this.fullscreen){
+                    let interval = setInterval(()=>{
+                        let elementById = document.getElementById("luckysheet-icon-morebtn-div");
+                        if (elementById){
+                            elementById.style.width = '55%'
+                            clearInterval(interval)
+                        }
+                    },300)
+                }
+            }
+            switch (type) {
+                case "file":
+                    if (file) {
+                        await new Promise((resolve) => {
+                            luckyexcel.transformExcelToLucky(file, (export_json) => {
+                                window.luckysheet.destroy();
+                                let name = export_json.info.name;
+                                let endsWith = name.endsWith(".xlsx") || name.endsWith(".xls");
+                                if (endsWith){
+                                    let lastIndexOf = export_json.info.name.lastIndexOf('.');
+                                    name = name.substring(0, lastIndexOf);
+                                }
+                                window.luckysheet.create({
+                                    container: "luckysheet",
+                                    lang: "zh",
+                                    showsheetbar: false,
+                                    data:export_json.sheets,
+                                    title:name,
+                                    userInfo:export_json.info.name.creater
+
+                                })
+                                if (!this.fullscreen){
+                                    let interval = setInterval(()=>{
+                                        let elementById = document.getElementById("luckysheet-icon-morebtn-div");
+                                        if (elementById){
+                                            elementById.style.width = '55%'
+                                            clearInterval(interval)
+                                        }
+                                    },300)
+                                }
+                                resolve();
+                            });
+                        });
+                    }
+                    break;
+                case "json":
+                    if (json) {
+                        window.luckysheet.destroy();
+                        let data=[];
+                        data[0]=json;
+                        if('view'==this.type){
+                            window.luckysheet.create({
+                                container: "luckysheet",
+                                lang: "zh",
+                                showsheetbar: false,
+                                data:data,
+                                title:name,
+                                userInfo:name.creater,
+                                hook: {
+                                    cellEditBefore: function ([
+                                                                  { row_focus: row, column_focus: column },
+                                                              ]) {
+                                        if (!that.handleAllow({ row, column })) {
+                                            that.$message.error("当前为【查看】状态，无法编辑！");
+                                        }
+                                    },
+                                    // cellUpdated: function (row, column) {
+                                    //   that.rowList.push(row);
+                                    // },
+                                    cellUpdateBefore: function (row, column) {
+                                        console.log(row, column);
+                                        if (!that.handleAllow({ row, column })) {
+                                            return false;
+                                        }
+                                    },
+                                    rangePasteBefore: function ([
+                                                                    { row_focus: row, column_focus: column },
+                                                                ]) {
+                                        if (!that.handleAllow({ row, column })) {
+                                            that.$message.error("当前为【查看】状态，无法编辑！");
+                                            return false;
+                                        }
+                                    },
+                                    updated: function ({ range }) {
+                                        const middle = range.map((el) => {
+                                            return that.paramsArr(el.row[0], el.row[1]);
+                                        });
+                                        let changedList = middle.join(",").split(",");
+                                        that.rowList.push(...changedList);
+                                    },
+                                }
+                            });
+                        }else{
+                            window.luckysheet.create({
+                                container: "luckysheet",
+                                lang: "zh",
+                                showsheetbar: false,
+                                data:data,
+                                title:name,
+                                userInfo:name.creater
+                            });
+                            if (!this.fullscreen){
+                                let interval = setInterval(()=>{
+                                    let elementById = document.getElementById("luckysheet-icon-morebtn-div");
+                                    if (elementById){
+                                        elementById.style.width = '55%'
+                                        clearInterval(interval)
+                                    }
+                                },300)
+                            }
+                        }
+                    }
+                    break;
+            }
+        },
+        async handleChange(response, fileList) {
+            this.fileListName = fileList.slice(-1)[0].name;
+            this.handleCreate({ file: response.raw, type: "file" });
+        },
+        handleDownload() {
+            exportExcel(
+                window.luckysheet.getAllSheets(),
+                window.luckysheet.getWorkbookName()
+            );
+        },
+        // 判断数组是否有值
+        confirmArrayData(data) {
+            if (data instanceof Array) {
+                if (data.length) {
+                    for (let i = 0; i < data.length; i++) {
+                        if (data[i] instanceof  Array){
+                            for (let j = 0; j < data[i].length; j++) {
+                                if ((data[i][j] && data[i][j].v) || (data[i][j] && data[i][j].ct.s && data[i][j].ct.s.length > 0 && data[i][j].ct.s[0].v)) {
+                                    return true;
+                                }
+                            }
+                        }else {
+                            return false;
+                        }
+                    }
+                    return false;
+                } else {
+                    return false;
+                }
+            } else {
+                return false;
+            }
+        },
+        // 通用方法用于转化全局
+        paramsArr(start, end) {
+            const arr = [];
+            console.log(start, end);
+            for (let i = Number(start); i <= Number(end); i++) {
+                arr.push(i);
+            }
+            return arr.join(",");
+        },
+        handleFullscreen() {
+            const sheet_name = window.luckysheet.getSheet().name;
+            const data = window.luckysheet.getSheet(sheet_name);
+            const workbook_name = window.luckysheet.getWorkbookName();
+            this.$emit('saveData', workbook_name, data)
+            if (this.fullscreen === false){
+                this.$emit("handleFullscreen", true)
+            }
+            if (this.fullscreen === true){
+                this.$emit("handleFullscreen", false)
+            }
+        },
+        handleFullscreenOption(){
+            const element = document.body;
+            const is_fullscreen =
+                document.fullScreen ||
+                document.mozFullScreen ||
+                document.webkitIsFullScreen;
+            if (!is_fullscreen) {
+                let elementById = document.getElementById("containerClass");
+                elementById.style.height = 'calc(100vh - 100px)';
+                //进入全屏,多重短路表达式
+                (element.requestFullscreen && element.requestFullscreen()) ||
+                (element.mozRequestFullScreen && element.mozRequestFullScreen()) ||
+                (element.webkitRequestFullscreen &&
+                    element.webkitRequestFullscreen()) ||
+                (element.msRequestFullscreen && element.msRequestFullscreen());
+            }else {
+                let elementById = document.getElementById("containerClass");
+                elementById.style.height = 'calc(100vh - 220px)';
+               //退出全屏,三目运算符
+               document.exitFullscreen
+                 ? document.exitFullscreen()
+                 : document.mozCancelFullScreen
+                 ? document.mozCancelFullScreen()
+                 : document.webkitExitFullscreen
+                 ? document.webkitExitFullscreen()
+                 : "";
+            }
+        },
+        handleResave() {
+            const sheet_name = window.luckysheet.getSheet().name;
+            const data = window.luckysheet.getSheet(sheet_name);
+            const workbook_name = window.luckysheet.getWorkbookName();
+            let empty = this.confirmArrayData(data.data);
+            if (!empty){
+                this.$message({
+                    type: "error",
+                    message: '文档内容为空',
+                });
+                return;
+            }
+            if('请输入标题'== workbook_name || !workbook_name){
+                this.$message({
+                    type: "error",
+                    message: '请输入标题',
+                });
+                return;
+            }
+            let value = {
+                // templateId: this.id,
+                templateContent: JSON.stringify(data), //文件内容
+                templateName: workbook_name, //模板名称
+                templateUrl: "", //文件链接
+                state: this.state,
+                mkdirId: this.mkdirId
+            };
+            if("edit" ==this.type){
+                value.id=this.id;
+            }
+            this.$http({
+                url: "/market/workLists/saveOrUpdate",
+                method: "post",
+                headers: {
+                    "Content-Type": "application/json",
+                },
+                data: value,
+            }).then((res) => {
+                console.log("----res",res);
+                if(res.data.result==0){
+                    this.$message({
+                        type: "success",
+                        message: "保存成功",
+                    });
+                }else{
+                    this.$message({
+                        type: "error",
+                        message: res.data.body,
+                    });
+                }
+                if (this.fullscreen){
+                    this.handleFullscreenOption()
+                    this.$emit("handleFullscreen", false)
+                }
+                this.$emit("save");
+            });
+        },
+    },
+    mounted() {
+        this.handleInit();
+        // this.handleChargeList();
+    },
+    destroyed() {
+        window.luckysheet.destroy();
+    },
+};
+</script>
+
+<style lang="scss" scope>
+.sheet-container {
+    position: relative;
+    width: 100%;
+    height: 100%;
+    &-block {
+        overflow: hidden;
+        position: absolute;
+        width: 100%;
+        height: 85%;
+    }
+    &-require {
+        color: red;
+    }
+    .el-input {
+        width: 200px;
+        margin-right: 10px;
+    }
+}
+.form {
+    &-input {
+        margin-top: 5px;
+        .el-input {
+            width: 150px;
+            .el-input__inner {
+                height: 30px !important;
+                line-height: 30px !important;
+            }
+        }
+    }
+    &-content {
+        margin: 0px 10px;
+    }
+    //&-select {
+    //  .el-input {
+    //    width: 100px;
+    //    .el-input__inner {
+    //      height: 30px !important;
+    //      line-height: 30px !important;
+    //    }
+    //  }
+    //}
+}
+.containerClass{
+    background: #fff;
+    border-radius: 5px;
+    height: calc(100vh - 220px);
+    width: calc(100% - 6px);
+    float: left;
+    display: inline-block;
+    overflow: hidden;
+}
+.sheet-container-block_class{
+    height: 80%;
+    width: 100%;
+}
+</style>

src/router/index.js

@@ -22,6 +22,12 @@ const routes = [{
             component: (resolve) => require( /* webpackChunkName: "system" */['../pages/main/performance/index.vue'], resolve)
         },
         {
+            meta: { name:  '部门工作清单', keepAlive: false },
+            path: '/departWorkLists',
+            name: 'departWorkLists',
+            component: (resolve) => require( /* webpackChunkName: "system" */['../pages/main/departWorkLists/index.vue'], resolve)
+        },
+        {
             meta: { name:  '宣传稿件下发', keepAlive: false,type: 1 },
             path: '/infotechgj',
             name: 'infotechgj',