Forráskód Böngészése

部门工作清单权限校验

liuhh 2 éve
szülő
commit
e3592e2948

+ 5 - 7
src/pages/main/departWorkLists/index.vue

@@ -77,7 +77,7 @@
                         </el-tree>
                     </div>
                 </div>
-                <div  class="inner-right" v-if="addOnlineWordFlag" >
+                <div  class="inner-right" v-if="addOnlineWordFlag" fullscreen>
                     <simple-sheet :type="type" @save="handleSave()" :id="tmpId" :mkdirId="params.mkdirId" :isCreater="isCreater"/>
                 </div>
 
@@ -90,7 +90,7 @@
                             v-if="checkedNode && checkedNode.length === 2"
                             type="primary"
                             size="mini"
-                            @click="addFile('addFile',{delFlag:'1'})"
+                            @click="addFile('add',{delFlag:'1'})"
                                     style="width: 80px"
                         >
                             新建
@@ -110,7 +110,6 @@
                         >
                             <el-table-column
                                 prop="templateName"
-                                width="150"
                                 show-overflow-tooltip
                                 label="名称"
                                 align="center"
@@ -127,7 +126,6 @@
                                 prop="createCity"
                                 show-overflow-tooltip
                                 label="创建科室"
-                                width="160"
                                 align="center"
                               >
                             </el-table-column>
@@ -135,7 +133,7 @@
                                 prop="createBy"
                                 show-overflow-tooltip
                                 label="创建人"
-                                width="100"
+                                width="150"
                                 align="center"
                             >
                             </el-table-column>
@@ -143,7 +141,7 @@
                                 prop="stateNm"
                                 show-overflow-tooltip
                                 label="状态"
-                                width="100"
+                                width="150"
                                 align="center"
                             >
                             </el-table-column>
@@ -337,7 +335,7 @@ export default {
             pageSize: 1,
             params: {
                 id: "",
-                mkdirId:"1"
+                mkdirId:"3"
             },
             paramsSearch: {
                 isFile: "1",

+ 432 - 436
src/pages/main/departWorkLists/sheet1.vue

@@ -6,24 +6,24 @@
  * @FilePath     : \spfm-market-front\src\pages\main\performance\components\sheet.vue
 -->
 <template>
-    <fullscreen :fullscreen.sync="fullscreen" class="containerClass" style=" background-color: #ffffff">
-    <div class="sheet-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-->
-            <!--      >-->
+    <fullscreen :fullscreen.sync="fullscreen" class="container" 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);
@@ -40,21 +40,21 @@
                     </el-upload>
                     <span style="font-size: 12px;margin-right: 5px;line-height: 2">{{ fileListName }}</span>
                 </div>
-            <el-button
-                type="danger"
-                @click="handleResave"
-                size="mini"
-                :disabled="this.type=='view'?true:false"
-            >保存</el-button
-            >
-<!--            :disabled="handleForbid()"-->
+                <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>
+                <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" ></div>
         </div>
-        <div id="luckysheet" class="sheet-container-block_class" ></div>
-    </div>
     </fullscreen>
 </template>
 
@@ -62,389 +62,398 @@
 import luckyexcel from "luckyexcel";
 import { exportExcel } from "../performance/common/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,
+    components: {
     },
-    // 接收人
-    receiver: {
-      type: String,
-      default: "",
-    },
-    // 模板状态按钮判断
-    status: { type: String, default: "" },
-      mkdirId:{
-          type: String,
-          default:'',
-      }
-  },
-  data() {
-    return {
-        fullscreen: false,
-        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;
+    props: {
+        isCreater: {
+            type: String,
+            default: "",
         },
-      },
-      pickWrite: {
-        disabledDate(time) {
-          return time.getTime() < new Date().getTime() - 8.64e7;
+        type: {
+            type: String,
+            default: "view", // view 查看 edit 编辑
         },
-      },
-      // 可提交标志
-      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: "按行",
+        attribute: {
+            type: String,
+            default: "template", // template 模板 order 工单 file 文件
         },
-        // {
-        //     value: 2,
-        //     label: "按列",
-        // },
-      ],
-        fileListName:'未选择任何文件'
-    };
-  },
-  methods: {
-      request(){},
-    handleInit() {
-        console.log("-----id",this.id)
-
-        if (this.id) {
-
-          this.handleQuery();
-      } else {
-        this.handleCreate();
-      }
+        id: {
+            default: null,
+        },
+        // 接收人
+        receiver: {
+            type: String,
+            default: "",
+        },
+        // 模板状态按钮判断
+        status: { type: String, default: "" },
+        mkdirId:{
+            type: String,
+            default:'',
+        }
     },
-      returnList(){
-          this.$emit("save");
-      },
-      handleAllow() {
-          //查看无法编辑
-          return this.type=="view"?false:true;
-      },
-    async handleQuery() {
-        debugger
-        const {
-            data: {
-                templateContent,
-                templateName,
-                state,
+    data() {
+        return {
+            fullscreen: false,
+            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: "", // 截止时间
             },
-        } = await this.$http({
-            url: "/market/workLists/getWorkById",
-            method: "post",
-            headers: {
-                "Content-Type": "application/json",
+            originSuperviseForm: {},
+            pickOptions: {
+                disabledDate(time) {
+                    return time.getTime() < new Date().getTime() - 8.64e7;
+                },
             },
-            data: {id:this.id},
-        });
-console.log("&&&&&&&&&&&&&sss:",state,templateName)
-        this.state=state;
-      this.handleCreate({
-        json: templateContent ? JSON.parse(templateContent) : {},
-        name: templateName,
-        type: "json",
-      });
+            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:'未选择任何文件'
+        };
     },
-    async handleCreate({ file, json, type, name } = {}) {
-      let that = this;
-      const options = {
-        container: "luckysheet",
-        lang: "zh",
-        showsheetbar: false,
-          plugins:['chart'],
-        hook: {
-          cellEditBefore: function ([
-            { row_focus: row, column_focus: column },
-          ]) {
-            if (!that.handleAllow({ row, column })) {
-              that.$message.error("查看无法编辑");
+    methods: {
+        request(){},
+        handleInit() {
+            if (this.id) {
+                this.handleQuery();
+            } else {
+                this.handleCreate();
             }
-          },
-          // cellUpdated: function (row, column) {
-          //   that.rowList.push(row);
-          // },
-          cellUpdateBefore: function (row, column) {
-            console.log(row, column);
-            if (!that.handleAllow({ row, column })) {
-              return false;
+        },
+        returnList(){
+            this.$emit("save");
+        },
+        handleAllow() {
+            //查看无法编辑
+            return this.type=="view"?false:true;
+        },
+        async handleQuery() {
+            debugger
+            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,
+                    userInfo:undefined
+                })
             }
-          },
-          cellRenderAfter: function (cell, position) {
-            const { r: row, c: column } = position;
-            console.log();
-            if (cell) {
-              if (!that.handleAllow({ row, column })) {
-                cell.bg = "#d5d5d5";
-              } else {
-                cell.bg = "#ffffff";
-              }
+            switch (type) {
+                case "file":
+                    if (file) {
+                        window.luckysheet.destroy();
+                        await new Promise((resolve) => {
+                            luckyexcel.transformExcelToLucky(file, (export_json) => {
+                                window.luckysheet.create({
+                                    container: "luckysheet",
+                                    lang: "zh",
+                                    showsheetbar: false,
+                                    data:export_json.sheets,
+                                    title:export_json.info.name,
+                                    userInfo:export_json.info.name.creater
+
+                                })
+                                resolve();
+                            });
+                        });
+                    }
+                    break;
+                case "json":
+                    if (json) {
+                        window.luckysheet.destroy();
+                        let data=[];
+                        data[0]=json;
+                        // options.data = data;
+                        // options.title = name;
+                        // options.userInfo=name.creater;
+                        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;
+                                        }
+                                    },
+                                    cellRenderAfter: function (cell, position) {
+                                        const { r: row, c: column } = position;
+                                        console.log();
+                                        if (cell) {
+                                            if (!that.handleAllow({ row, column })) {
+                                                cell.bg = "#d5d5d5";
+                                            } else {
+                                                cell.bg = "#ffffff";
+                                            }
+                                        }
+                                    },
+                                    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
+                            });
+                        }
+                    }
+                    break;
             }
-          },
-          rangePasteBefore: function ([
-            { row_focus: row, column_focus: column },
-          ]) {
-            if (!that.handleAllow({ row, column })) {
-              that.$message.error("查看无法编辑");
-              return false;
+        },
+        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) {
+                let flag = 0;
+                if (data.length) {
+                    data.forEach((el) => {
+                        if (el instanceof Object) {
+                            flag = flag + 1;
+                        }
+                    });
+                    if (flag) {
+                        return true;
+                    } else {
+                        return false;
+                    }
+                } else {
+                    return false;
+                }
+            } else {
+                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);
-          },
         },
-      };
-      switch (type) {
-        case "file":
-          if (file) {
-            await new Promise((resolve) => {
-              luckyexcel.transformExcelToLucky(file, (export_json) => {
-                options.data = [
-                  ...export_json.sheets.map((element) => ({
-                    ...element,
-                    zoomRatio:0.75,
-                  })),
-                ];
-                options.title = export_json.info.name;
-                resolve();
-              });
-            });
-          }
-          break;
-        case "json":
-          if (json) {
-            options.data = [
-              {
-                ...json,
-                zoomRatio: 0.75,
-              },
-            ];
-            options.title = name;
-          }
-          break;
-      }
-      window.luckysheet.create(options);
+        // 通用方法用于转化全局
+        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() {
+            this.fullscreen = !this.fullscreen
 
-      let clock = setInterval(() => {
-        if (window.luckysheet) {
-          window.luckysheet.refresh();
-          clearInterval(clock);
-        }
-      }, 1000);
-    },
-    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) {
-        let flag = 0;
-        if (data.length) {
-          data.forEach((el) => {
-            if (el instanceof Object) {
-              flag = flag + 1;
+            //   const element = document.getElementById("full-container");
+            // const is_fullscreen =
+            //   document.fullScreen ||
+            //   document.mozFullScreen ||
+            //   document.webkitIsFullScreen;
+            // if (!is_fullscreen) {
+            //   //进入全屏,多重短路表达式
+            //   (element.requestFullscreen && element.requestFullscreen()) ||
+            //     (element.mozRequestFullScreen && element.mozRequestFullScreen()) ||
+            //     (element.webkitRequestFullscreen &&
+            //       element.webkitRequestFullscreen()) ||
+            //     (element.msRequestFullscreen && element.msRequestFullscreen());
+            // } else {
+            //   //退出全屏,三目运算符
+            //   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 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;
             }
-          });
-          if (flag) {
-            return true;
-          } else {
-            return false;
-          }
-        } else {
-          return false;
-        }
-      } else {
-        return false;
-      }
+            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,
+                    });
+                }
+                this.$emit("save");
+            });
+        },
     },
-    // 通用方法用于转化全局
-    paramsArr(start, end) {
-      const arr = [];
-      console.log(start, end);
-      for (let i = Number(start); i <= Number(end); i++) {
-        arr.push(i);
-      }
-      return arr.join(",");
+    mounted() {
+        this.handleInit();
+        // this.handleChargeList();
     },
-    handleFullscreen() {
-        this.fullscreen = !this.fullscreen
-
-        // const element = document.body;
-      // const is_fullscreen =
-      //   document.fullScreen ||
-      //   document.mozFullScreen ||
-      //   document.webkitIsFullScreen;
-      // if (!is_fullscreen) {
-      //   //进入全屏,多重短路表达式
-      //   (element.requestFullscreen && element.requestFullscreen()) ||
-      //     (element.mozRequestFullScreen && element.mozRequestFullScreen()) ||
-      //     (element.webkitRequestFullscreen &&
-      //       element.webkitRequestFullscreen()) ||
-      //     (element.msRequestFullscreen && element.msRequestFullscreen());
-      // } else {
-      //   //退出全屏,三目运算符
-      //   document.exitFullscreen
-      //     ? document.exitFullscreen()
-      //     : document.mozCancelFullScreen
-      //     ? document.mozCancelFullScreen()
-      //     : document.webkitExitFullscreen
-      //     ? document.webkitExitFullscreen()
-      //     : "";
-      // }
+    destroyed() {
+        window.luckysheet.destroy();
     },
-      handleResave() {
-          const sheet_name = window.luckysheet.getSheet().name;
-          const data = window.luckysheet.getSheet(sheet_name);
-          const workbook_name = window.luckysheet.getWorkbookName();
-
-          this.confirmArrayData(data.data)
-
-          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,
-                  });
-              }
-              this.$emit("save");
-          });
-      },
-  },
-  mounted() {
-    console.log(this.attribute, "attribute");
-    console.log(this.type, "type");
-    this.handleInit();
-  },
-  destroyed() {
-    window.luckysheet.destroy();
-  },
 };
 </script>
 
@@ -459,49 +468,36 @@ console.log("&&&&&&&&&&&&&sss:",state,templateName)
         width: 100%;
         height: 85%;
     }
-  &-require {
-    color: red;
-  }
-  .el-input {
-    width: 200px;
-    margin-right: 10px;
-  }
-}
-.form {
-  &-input {
-    margin-top: 5px;
+    &-require {
+        color: red;
+    }
     .el-input {
-      width: 150px;
-      .el-input__inner {
-        height: 30px !important;
-        line-height: 30px !important;
-      }
+        width: 200px;
+        margin-right: 10px;
     }
-  }
-  &-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;
+.form {
+    &-input {
+        margin-top: 5px;
+        .el-input {
+            width: 150px;
+            .el-input__inner {
+                height: 30px !important;
+                line-height: 30px !important;
+            }
+        }
     }
-    .sheet-container-block_class{
-        height: 80%;
-        width: 100%;
+    &-content {
+        margin: 0px 10px;
     }
+    //&-select {
+    //  .el-input {
+    //    width: 100px;
+    //    .el-input__inner {
+    //      height: 30px !important;
+    //      line-height: 30px !important;
+    //    }
+    //  }
+    //}
+}
 </style>