提交车间工时文件

fhKeeper/formulahousekeeper/timesheet-workshop/src/views/plan/orderInsert.vue

@@ -1,23 +1,801 @@
 <template>
-<div class='layout-container'>
+  <div class="layout-container">
+    <div class="layout-container-header">
+      <div class="OutSide">
+        <div class="OutSide_left">
+          <div>{{ titleText }}</div>
+          <div>{{ todayDate }}</div>
+        </div>
+        <div class="OutSide_center">
+          <div class="block" style="padding-left: 30px;">
+            <span class="demonstration">查询以往{{ titleText }}</span>
+            <el-date-picker v-model="planDate" type="date" value-format="yyyy-MM-dd" @change="getTableData(hasChooseDept)"
+              placeholder="选择日期" size="small">
+            </el-date-picker>
+          </div>
+        </div>
+        <div class="OutSide_right">
+          <el-link type="primary" :underline="false" @click="(deptSetDialog = true)">{{ "任务类型管理"
+          }}</el-link>
+          <el-link type="primary" :underline="false" @click="addPlan()">{{
+            `新增${titleText}`
+          }}</el-link>
+          <el-upload ref="upload" action="#" :limit="1" :http-request="importData" :show-file-list="false">
+            <el-link type="primary" :underline="false">{{ "导入" }}</el-link>
+          </el-upload>
+          <el-link type="primary" :underline="false" @click="exportData()"
+            :download="this.planType == 0 ? '今日计划' : this.planType == 1 ? '明日计划' : this.planType == 1 ? '插单计划' : '' + '.xlsx'">{{
+              "导出"
+            }}</el-link>
+        </div>
+      </div>
+    </div>
+    <div class="layout-container-center">
+      <!-- tab 切换 -->
+      <div class="today-tab">
+        <div v-for="(item, index) in hasSetDeptList" :key="index" :class="`${todayTabIndex === index ? 'on' : ''}`"
+          @click="tabChange(item, index)">
+          {{ item.departmentName }}
+        </div>
+      </div>
 
-</div>
-</template>
+      <!-- 各部分数据列表 -->
+      <el-table :data="tableData" style="width: 100%; flex: 1" v-loading="tableDataLoading"
+        @selection-change="handleSelectionChange">
+        <el-table-column type="selection" width="55"> </el-table-column>
+        <el-table-column prop="productSchedulingNum" label="通知号" width="180"></el-table-column>
+        <el-table-column prop="productName" label="任务名称" width="180"></el-table-column>
+        <el-table-column prop="projectCode" label="任务类型" width="180"></el-table-column>
+        <el-table-column prop="num" label="计划人数" width="180"> </el-table-column>
+        <el-table-column prop="mainProcess" label="数量" width="180"></el-table-column>
+        <el-table-column prop="stationName" label="计划工时" width="180"></el-table-column>
+        <el-table-column prop="foremanName" label="工钱" width="180"></el-table-column>
+        <el-table-column prop="startDate" label="工长" width="180"></el-table-column>
+        <el-table-column prop="endDate" label="开工时间" width="180"></el-table-column>
+        <el-table-column prop="endDate" label="完工时间" width="180"></el-table-column>
+        <el-table-column label="编辑">
+          <template slot-scope="scope">
+            <div @click="editPlan(scope.row)" class="colorText">编辑</div>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <div class="layout-container-floor">
+      <el-button type="primary" size="mini" @click="allocationPlan">下发计划</el-button>
+      <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="pageIndex"
+        :page-sizes="[10, 20, 50, 100]" :page-size="pageSize" layout="total, prev, pager, next, sizes, jumper"
+        :total="total">
+      </el-pagination>
+    </div>
+
+    <!-- 新增今日计划 -->
+    <el-dialog :title="titleName" :visible.sync="editPlanDiaLog" width="800px" top="18.5vh" :before-close="handleClose">
+      <div class="planDialog">
+        <el-form ref="todayPlanForm" :rules="todayPlanFormrules" :model="todayPlanForm" label-width="120px">
+          <el-form-item label="任务变更通知号" style="width: 100%" prop="productSchedulingNum">
+            <el-input v-model="todayPlanForm.productSchedulingNum" placeholder="请输入"></el-input>
+          </el-form-item>
+          <el-form-item label="任务名称" style="width: 100%" prop="projectCode">
+            <el-input v-model="todayPlanForm.projectCode" placeholder="请输入"></el-input>
+          </el-form-item>
+          <el-form-item label="任务类型" prop="productId">
+            <el-select v-model="todayPlanForm.productId" placeholder="请选择" class="w100">
+              <el-option v-for="item in productList" :key="item.id" :label="item.name" :value="item.id">
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="计划人数" prop="projectCode">
+            <el-input v-model="todayPlanForm.projectCode" type="number" placeholder="请输入"></el-input>
+          </el-form-item>
+          <el-form-item label="数量" prop="projectCode">
+            <el-input v-model="todayPlanForm.projectCode" type="number" placeholder="请输入"></el-input>
+          </el-form-item>
+          <el-form-item label="计划工时" prop="projectCode">
+            <div style="display: flex;">
+              <el-input v-model="todayPlanForm.projectCode" type="number" placeholder="请输入" style="flex: 1;"></el-input>
+              <div style="margin-left: 10px;">小时</div>
+            </div>
+          </el-form-item>
+          <el-form-item label="单价" prop="projectCode">
+            <div style="display: flex;">
+              <el-input v-model="todayPlanForm.projectCode" type="number" placeholder="请输入" style="flex: 1;"></el-input>
+              <div style="margin-left: 10px;">元/小时</div>
+            </div>
+          </el-form-item>
+          <el-form-item label="质检类型" prop="productId">
+            <el-select v-model="todayPlanForm.productId" placeholder="请选择" class="w100">
+              <el-option v-for="item in productList" :key="item.id" :label="item.name" :value="item.id">
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="工位" prop="productId">
+            <el-select v-model="todayPlanForm.productId" placeholder="请选择" class="w100">
+              <el-option v-for="item in productList" :key="item.id" :label="item.name" :value="item.id">
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="工长" prop="productId">
+            <el-select v-model="todayPlanForm.productId" placeholder="请选择" class="w100">
+              <el-option v-for="item in productList" :key="item.id" :label="item.name" :value="item.id">
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="开工时间" prop="startDate">
+            <el-date-picker class="w100" v-model="todayPlanForm.startDate" type="date" placeholder="选择日期"
+              value-format="yyyy-MM-dd">
+            </el-date-picker>
+          </el-form-item>
+          <el-form-item label="完工时间" prop="endDate">
+            <el-date-picker class="w100" v-model="todayPlanForm.endDate" type="date" placeholder="选择日期"
+              value-format="yyyy-MM-dd">
+            </el-date-picker>
+          </el-form-item>
+          <el-form-item label="描述" style="width: 100%">
+            <el-input type="textarea" :rows="6" placeholder="请输入描述" v-model="todayPlanForm.describtion">
+            </el-input>
+          </el-form-item>
+        </el-form>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="
+          (editPlanDiaLog = false), $refs['todayPlanForm'].resetFields()
+          ">取 消</el-button>
+        <el-button type="primary" @click="addPlanData('todayPlanForm')">确 定</el-button>
+      </span>
+    </el-dialog>
 
+    <!-- 部门设置弹框 -->
+    <el-dialog title="部门设置" :visible.sync="deptSetDialog" width="800" :before-close="handleClose">
+      <div>
+        你好
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="deptSetDialog = false">取 消</el-button>
+        <el-button type="primary" @click="deptSetDialog = false">确 定</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+  
 <script>
 export default {
-name: '',
-components: {},
-props: { },
-data() { 
-return {}
-},
-computed: {},
-watch: {},
-created () {},
-mounted () {},
-methods: {},
-}
+  name: "planComponent",
+  components: {},
+  props: {
+    planType: {
+      type: String,
+      default: "2",
+    },
+    titleText: {
+      type: String,
+      default: "插单计划",
+    }
+  },
+  data() {
+    return {
+      steelStampNumber: "",
+      todayDate: this.dayjs().format('YYYY-MM-DD'),
+      planDate: this.dayjs().format('YYYY-MM-DD'),
+      deptSetDialog: false,
+      departmentList: [],
+      departmentIdArray: [],
+      deptSetData: "",
+      props: { multiple: true },
+      hasSetDeptList: [],
+      titleName: "",
+      todayPlanForm: {
+        id: null,
+        productSchedulingNum: "",
+        productId: "",
+        projectCode: "",
+        steelStampNumberStart: "",
+        steelStampNumberEnd: "",
+        num: "",
+        mainProcess: "",
+        stationId: "",
+        foremanId: "",
+        foremanName: "",
+        startDate: "",
+        endDate: "",
+        describtion: "",
+        versionNumber: "",
+      },
+      todayTabIndex: 0,
+      tableDataLoading: false,
+      tableData: [],
+      editPlanDiaLog: false,
+      pageIndex: 0,
+      pageSize: 20,
+      total: 0,
+      hasChooseDept: "",
+      productList: [],
+      multipleSelection: [],
+      // 表单规则验证
+      todayPlanFormrules: {
+        productSchedulingNum: [
+          { required: true, message: "排产工单号", trigger: "blur" },
+        ],
+        productId: [{ required: true, message: "产品名称", trigger: "blur" }],
+        projectCode: [{ required: true, message: "项目代码", trigger: "blur" }],
+        steelStampNumberStart: [
+          { required: true, message: "钢印号", trigger: "blur" },
+        ],
+        steelStampNumberEnd: [
+          { required: true, message: "钢印号", trigger: "blur" },
+        ],
+        num: [{ required: true, message: "数量", trigger: "blur" }],
+        mainProcess: [{ required: true, message: "主工序", trigger: "blur" }],
+        stationId: [{ required: true, message: "工位", trigger: "blur" }],
+        startDate: [{ required: true, message: "开工时间", trigger: "blur" }],
+        endDate: [{ required: true, message: "完工时间", trigger: "blur" }],
+      },
+    };
+  },
+  computed: {},
+  watch: {},
+  created() { },
+  mounted() {
+    this.getDepartmentList(),
+      this.getPlanDeptSet(),
+      this.getHasSetPlanDeptList(),
+      this.getProductList();
+  },
+  methods: {
+    today() {
+      let date = new Date();
+      let year = date.getFullYear();
+      let month = (date.getMonth() + 1 + "").padStart(2, "0");
+      let day = (date.getDate() + "").padStart(2, "0");
+      return `${year}-${month}-${day}`;
+    },
+    getDepartmentList() {
+      this.http.post(
+        this.port.manage.depList,
+        {},
+        (res) => {
+          if (res.code == "ok") {
+            let dptlist = JSON.parse(JSON.stringify(res.data));
+            this.departmentList = this.changeArr(dptlist);
+          } else {
+            this.$message({
+              message: res.msg,
+              type: "error",
+            });
+          }
+        },
+        (error) => {
+          this.$message({
+            message: error,
+            type: "error",
+          });
+        }
+      );
+    },
+    changeArr(arr) {
+      for (var i = 0; i < arr.length; i++) {
+        if (arr[i].id != -1 && arr[i].id != 0) {
+          if (arr[i].children != null && arr[i].children.length > 0) {
+            arr[i].children = this.changeArr(arr[i].children);
+          }
+          arr[i].id && (arr[i].value = arr[i].id);
+          delete arr[i].id;
+        }
+      }
+      for (var i in arr) {
+        if (arr[i].id == -1 || arr[i].id == 0) {
+          arr.splice(i, 1);
+        }
+      }
+      return arr;
+    },
+    deptSet() {
+      console.log(
+        this.departmentIdArray,
+        JSON.stringify(this.departmentIdArray)
+      );
+      // return
+      let arr = [];
+      for (var i in this.departmentIdArray) {
+        arr.push(
+          this.departmentIdArray[i][this.departmentIdArray[i].length - 1]
+        );
+      }
+      this.http.post(
+        "/plan/deptSet",
+        { deptIds: arr.join(",") },
+        (res) => {
+          if (res.code == "ok") {
+            this.$message({
+              message: "设置成功",
+              type: "success",
+            });
+            this.getHasSetPlanDeptList();
+          } else {
+            this.$message({
+              message: res.msg,
+              type: "error",
+            });
+          }
+        },
+        (error) => {
+          this.$message({
+            message: error,
+            type: "error",
+          });
+        }
+      );
+    },
+    getPlanDeptSet() {
+      this.http.post(
+        "/plan/deptList",
+        {},
+        (res) => {
+          if (res.code == "ok") {
+            let arr = res.data.split(",") || [];
+            for (var i in arr) {
+              arr[i] = +arr[i];
+            }
+            console.log(arr);
+            this.departmentIdArray = arr;
+          } else {
+            this.$message({
+              message: res.msg,
+              type: "error",
+            });
+          }
+        },
+        (error) => {
+          this.$message({
+            message: error,
+            type: "error",
+          });
+        }
+      );
+    },
+    getHasSetPlanDeptList() {
+      this.http.post(
+        "/plan/hasSetDeptDetail",
+        {},
+        (res) => {
+          if (res.code == "ok") {
+            this.hasSetDeptList = res.data;
+            if (res.data.length > 0) {
+              this.tableDataLoading = true;
+              this.hasChooseDept = res.data[0].departmentId;
+              this.getTableData(res.data[0].departmentId);
+            }
+          } else {
+            this.$message({
+              message: res.msg,
+              type: "error",
+            });
+          }
+        },
+        (error) => {
+          this.$message({
+            message: error,
+            type: "error",
+          });
+        }
+      );
+    },
+
+    // tab 切换事件
+    tabChange(item, index) {
+      console.log(item, "item");
+      this.todayTabIndex = index;
+      this.hasChooseDept = item.departmentId;
+      this.getTableData(item.departmentId);
+    },
+    // 获取车间数据
+    getTableData(departmentId) {
+      console.log(this.planDate);
+      this.tableDataLoading = true;
+      this.http.post(
+        "/plan/list",
+        {
+          deptId: departmentId,
+          planType: this.planType,
+          date: this.planDate,
+          steelStampNumber: this.steelStampNumber,
+          pageIndex: this.pageIndex,
+          pageSize: this.pageSize,
+        },
+        (res) => {
+          this.tableDataLoading = false;
+          if (res.code == "ok") {
+            this.tableData = res.data.records;
+            this.total = res.data.total;
+          } else {
+            this.$message({
+              message: res.msg,
+              type: "error",
+            });
+          }
+        },
+        (error) => {
+          this.tableDataLoading = false;
+          this.$message({
+            message: error,
+            type: "error",
+          });
+        }
+      );
+    },
+    handleSizeChange(val) {
+      console.log(val, "handleSizeChange");
+      this.pageSize = val;
+      this.pageIndex = 1;
+      this.getTableData(this.hasChooseDept);
+    },
+    handleCurrentChange(val) {
+      console.log(val, "handleCurrentChange");
+      this.pageIndex = val;
+      this.getTableData(this.hasChooseDept);
+    },
+    addPlan() {
+      this.titleName = `新增${this.titleText}`;
+      this.editPlanDiaLog = true;
+      this.getDepartmentList();
+      this.getProductList();
+      // this.todayPlanForm
+    },
+    addPlanData(formName) {
+      console.log(this.todayPlanForm);
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          console.log(this.todayPlanForm, "传给后端的值");
+          let stationId =
+            this.todayPlanForm.stationId[
+            this.todayPlanForm.stationId.length - 1
+            ];
+          this.http.post(
+            "/plan/addOrUpdatePlan",
+            {
+              ...this.todayPlanForm,
+              stationId,
+              planType: this.planType,
+            },
+            (res) => {
+              if (res.code == "ok") {
+                this.$message({
+                  message:
+                    this.todayPlanForm.id == null ? "新增成功" : "修改成功",
+                  type: "success",
+                });
+                this.editPlanDiaLog = false;
+              } else {
+                this.$message({
+                  message: res.msg,
+                  type: "error",
+                });
+              }
+            },
+            (error) => {
+              this.$message({
+                message: error,
+                type: "error",
+              });
+            }
+          );
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    editPlan(item) {
+      (this.titleName = `编辑${this.titleText}`), (this.editPlanDiaLog = true);
+      this.todayPlanForm = item;
+      console.log(item);
+    },
+    getProductList() {
+      this.http.post(
+        "/product/getProductPage",
+        {
+          pageIndex: null,
+          pageSize: null,
+        },
+        (res) => {
+          if (res.code == "ok") {
+            this.productList = res.data.records;
+          } else {
+            this.$message({
+              message: res.msg,
+              type: "error",
+            });
+          }
+        },
+        (error) => {
+          this.$message({
+            message: error,
+            type: "error",
+          });
+        }
+      );
+    },
+    getIncharger() {
+      console.log(this.todayPlanForm.stationId);
+      this.http.post(
+        "/department/getIncharger",
+        {
+          deptId:
+            this.todayPlanForm.stationId[
+            this.todayPlanForm.stationId.length - 1
+            ],
+        },
+        (res) => {
+          if (res.code == "ok") {
+            this.todayPlanForm.foremanId = res.data ? res.data.id : '';
+            this.todayPlanForm.foremanName = res.data ? res.data.name : ''
+          } else {
+            this.$message({
+              message: res.msg,
+              type: "error",
+            });
+          }
+        },
+        (error) => {
+          this.$message({
+            message: error,
+            type: "error",
+          });
+        }
+      );
+    },
+    // 跳转至详情
+    toPlanDetil(item) {
+      console.log(item, "详情页面数据");
+      let pathUrl = "";
+      if (this.planType == 1) {
+        pathUrl = "/plan/planDetil";
+      } else {
+        pathUrl = "/plan/planDetil";
+      }
+      console.log(pathUrl);
+      this.$router.push({
+        path: pathUrl,
+        name: "计划详情",
+        params: {
+          id: item.id,
+          topText: item.productSchedulingNum,
+          leftText: item.productName,
+        },
+      });
+    },
+    // 导入数据
+    importData(item) {
+      this.tableDataLoading = true;
+      let formData = new FormData();
+      formData.append("file", item.file);
+      formData.append("planType", this.planType);
+      this.http.uploadFile('/plan/importData', formData,
+        res => {
+          this.$refs.upload.clearFiles();
+          this.tableDataLoading = false;
+          if (res.code == "ok") {
+            this.$message({
+              message: '导入成功',
+              type: "success"
+            });
+            this.getTableData(this.hasChooseDept);
+          } else {
+            this.$message({
+              message: res.msg,
+              type: "error"
+            });
+          }
+        },
+        error => {
+          this.$refs.upload.clearFiles();
+          this.tableDataLoading = false;
+          this.$message({
+            message: error,
+            type: "error"
+          });
+        });
+    },
+    exportData() {
+      let param = {
+        planType: this.planType,
+        date: this.planDate,
+        steelStampNumber: this.steelStampNumber,
+      }
+      this.http.post('/plan/exportData', param,
+        res => {
+          if (res.code == "ok") {
+            var filePath = res.data;
+            const a = document.createElement('a'); // 创建a标签
+            a.setAttribute('download', this.$t('projectexport') + '.xlsx');// download属性
+            a.setAttribute('href', filePath);// href链接
+            a.click(); //自执行点击事件
+            a.remove();
+          }
+        },
+        error => {
+          this.$message({
+            message: error,
+            type: "error"
+          });
+        }
+      );
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val.map(item => item.id);
+      console.log(this.multipleSelection)
+    },
+    allocationPlan() {
+      if (this.multipleSelection.length == 0) {
+        return
+      }
+      this.http.post(
+        "/plan/allocationPlan",
+        {
+          ids: this.multipleSelection.join(","),
+          planType: this.planType
+        },
+        (res) => {
+          if (res.code == "ok") {
+            this.$message({
+              message: '下发成功',
+              type: "success",
+            });
+          } else {
+            this.$message({
+              message: res.msg,
+              type: "error",
+            });
+          }
+        },
+        (error) => {
+          this.$message({
+            message: error,
+            type: "error",
+          });
+        }
+      );
+    },
+  },
+};
 </script>
 <style scoped lang='scss'>
+.colorText {
+  color: #02a7f0;
+  cursor: pointer;
+}
+
+.layout-container {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-wrap: wrap;
+  flex-direction: column;
+  box-sizing: border-box;
+  padding: 10px;
+
+  .layout-container-header,
+  .layout-container-center,
+  .layout-container-floor {
+    width: 100%;
+  }
+
+  .layout-container-center {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+  }
+
+  .layout-container-floor {
+    box-sizing: border-box;
+    display: flex;
+    justify-content: space-between;
+    padding: 10px 20px;
+  }
+
+  .OutSide {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    flex-direction: initial;
+    padding-bottom: 10px;
+
+    .demonstration {
+      margin-right: 20px;
+      min-width: 48px;
+    }
+
+    .OutSide_left {
+      width: 200px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+
+      div {
+        font-size: 16px;
+      }
+
+      div:first-child {
+        font-size: 20px;
+      }
+    }
+
+    .OutSide,
+    .block {
+      max-width: 400px;
+    }
+
+    .OutSide_center {
+      flex: 1;
+      display: flex;
+      // justify-content: space-between;
+      align-items: center;
+
+      .block {
+        display: flex;
+        align-items: center;
+        margin-right: 30px;
+      }
+    }
+
+    .OutSide_right {
+      display: flex;
+      align-items: center;
+
+      .el-link {
+        margin-right: 15px;
+      }
+    }
+  }
+
+  .today-tab {
+    display: flex;
+    overflow-x: auto;
+    margin-bottom: 10px;
+
+    div {
+      font-size: 16px;
+      margin-left: 15px;
+      cursor: pointer;
+    }
+
+    .on {
+      color: #02a7f0;
+    }
+  }
+
+  .planDialog::-webkit-scrollbar {
+    display: none;
+    /* Chrome Safari */
+  }
+
+  // 新增样式
+  .planDialog {
+    max-height: 50vh;
+    overflow-y: auto;
+    scrollbar-width: none;
+    /* Firefox */
+    -ms-overflow-style: none;
+
+    /* IE 10+ */
+    .el-form {
+      display: flex;
+      flex-wrap: wrap;
+      justify-content: space-between;
+    }
+
+    .w100 {
+      width: 100%;
+    }
+
+    .el-form-item {
+      width: 50%;
+
+      .w45 {
+        width: 49%;
+      }
+    }
+  }
+}
 </style>
+  

fhKeeper/formulahousekeeper/timesheet-workshop/src/views/plan/planComponent.vue

@@ -9,74 +9,44 @@
         <div class="OutSide_center">
           <div class="block">
             <span class="demonstration">查询以往{{ titleText }}</span>
-            <el-date-picker
-              v-model="planDate"
-              type="date"
-              value-format="yyyy-MM-dd"
-              @change="getTableData(hasChooseDept)"
-              placeholder="选择日期"
-              size="small"
-            >
+            <el-date-picker v-model="planDate" type="date" value-format="yyyy-MM-dd" @change="getTableData(hasChooseDept)"
+              placeholder="选择日期" size="small">
             </el-date-picker>
           </div>
-          <div class="OutSide">
-            <span class="demonstration">{{ "钢印号" }}</span
-            ><el-input
-              v-model="steelStampNumber"
-              size="small"
-              @change="getTableData(hasChooseDept)"
-              placeholder="请输入内容"
-              clearable="true"
-            ></el-input>
+          <div class="OutSide" style="padding-bottom: 0;">
+            <span class="demonstration">{{ "钢印号" }}</span><el-input v-model="steelStampNumber" size="small"
+              @change="getTableData(hasChooseDept)" placeholder="请输入内容" clearable="true"></el-input>
           </div>
         </div>
         <div class="OutSide_right">
-          <div>
-            <span>
-              <el-link
-                type="primary"
-                :underline="false"
-                @click="(deptSetDialog = true), getPlanDeptSet()"
-                >{{ "部门设置" }}</el-link
-              >
+              <el-link type="primary" :underline="false" @click="(deptSetDialog = true), getPlanDeptSet()">{{ "部门设置"
+              }}</el-link>
               <el-link type="primary" :underline="false" @click="addPlan()">{{
                 `新增${titleText}`
               }}</el-link>
               <el-upload ref="upload" action="#" :limit="1" :http-request="importData" :show-file-list="false">
-                    <el-link type="primary" :underline="false">{{ "导入" }}</el-link>
+                <el-link type="primary" :underline="false">{{ "导入" }}</el-link>
               </el-upload>
-              <el-link type="primary" :underline="false" @click="exportData()" :download="this.planType==0?'今日计划':this.planType==1?'明日计划':this.planType==1?'插单计划':''+'.xlsx'">{{ "导出" }}</el-link>
-            </span>
-          </div>
+              <el-link type="primary" :underline="false" @click="exportData()"
+                :download="this.planType == 0 ? '今日计划' : this.planType == 1 ? '明日计划' : this.planType == 1 ? '插单计划' : '' + '.xlsx'">{{ "导出"
+                }}</el-link>
         </div>
       </div>
     </div>
     <div class="layout-container-center">
       <!-- tab 切换 -->
       <div class="today-tab">
-        <div
-          v-for="(item, index) in hasSetDeptList"
-          :key="index"
-          :class="`${todayTabIndex === index ? 'on' : ''}`"
-          @click="tabChange(item, index)"
-        >
+        <div v-for="(item, index) in hasSetDeptList" :key="index" :class="`${todayTabIndex === index ? 'on' : ''}`"
+          @click="tabChange(item, index)">
           {{ item.departmentName }}
         </div>
       </div>
 
       <!-- 各部分数据列表 -->
-      <el-table
-        :data="tableData"
-        style="width: 100%; flex: 1"
-        v-loading="tableDataLoading"
-        @selection-change="handleSelectionChange"
-      >
+      <el-table :data="tableData" style="width: 100%; flex: 1" v-loading="tableDataLoading"
+        @selection-change="handleSelectionChange">
         <el-table-column type="selection" width="55"> </el-table-column>
-        <el-table-column
-          prop="productSchedulingNum"
-          label="排产工单号"
-          width="180"
-        >
+        <el-table-column prop="productSchedulingNum" label="排产工单号" width="180">
           <template slot-scope="scope">
             <div @click="toPlanDetil(scope.row)" class="colorText">
               {{ scope.row.productSchedulingNum }}
@@ -107,72 +77,32 @@
     </div>
     <div class="layout-container-floor">
       <el-button type="primary" size="mini" @click="allocationPlan">下发计划</el-button>
-      <el-pagination
-        @size-change="handleSizeChange"
-        @current-change="handleCurrentChange"
-        :current-page="pageIndex"
-        :page-sizes="[10, 20, 50, 100]"
-        :page-size="pageSize"
-        layout="total, prev, pager, next, sizes, jumper"
-        :total="total"
-      >
+      <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="pageIndex"
+        :page-sizes="[10, 20, 50, 100]" :page-size="pageSize" layout="total, prev, pager, next, sizes, jumper"
+        :total="total">
       </el-pagination>
     </div>
 
     <!-- 新增今日计划 -->
-    <el-dialog
-      :title="titleName"
-      :visible.sync="editPlanDiaLog"
-      width="800px"
-      top="18.5vh"
-      :before-close="handleClose"
-    >
+    <el-dialog :title="titleName" :visible.sync="editPlanDiaLog" width="800px" top="18.5vh" :before-close="handleClose">
       <div class="planDialog">
-        <el-form
-          ref="todayPlanForm"
-          :rules="todayPlanFormrules"
-          :model="todayPlanForm"
-          label-width="120px"
-        >
-          <el-form-item
-            label="排产工单号"
-            style="width: 100%"
-            prop="productSchedulingNum"
-          >
+        <el-form ref="todayPlanForm" :rules="todayPlanFormrules" :model="todayPlanForm" label-width="120px">
+          <el-form-item label="排产工单号" style="width: 100%" prop="productSchedulingNum">
             <el-input v-model="todayPlanForm.productSchedulingNum"></el-input>
           </el-form-item>
           <el-form-item label="产品名称" style="width: 100%" prop="productId">
-            <el-select
-              v-model="todayPlanForm.productId"
-              placeholder="请选择"
-              class="w100"
-            >
-              <el-option
-                v-for="item in productList"
-                :key="item.id"
-                :label="item.name"
-                :value="item.id"
-              >
+            <el-select v-model="todayPlanForm.productId" placeholder="请选择" class="w100">
+              <el-option v-for="item in productList" :key="item.id" :label="item.name" :value="item.id">
               </el-option>
             </el-select>
           </el-form-item>
           <el-form-item label="项目代码" style="width: 100%" prop="projectCode">
             <el-input v-model="todayPlanForm.projectCode"></el-input>
           </el-form-item>
-          <el-form-item
-            label="钢印号"
-            style="width: 100%"
-            prop="steelStampNumberStart"
-          >
-            <el-input
-              class="w45"
-              v-model="todayPlanForm.steelStampNumberStart"
-            ></el-input>
+          <el-form-item label="钢印号" style="width: 100%" prop="steelStampNumberStart">
+            <el-input class="w45" v-model="todayPlanForm.steelStampNumberStart"></el-input>
             {{ "-" }}
-            <el-input
-              class="w45"
-              v-model="todayPlanForm.steelStampNumberEnd"
-            ></el-input>
+            <el-input class="w45" v-model="todayPlanForm.steelStampNumberEnd"></el-input>
           </el-form-item>
           <el-form-item label="数量" prop="num">
             <el-input v-model="todayPlanForm.num"></el-input>
@@ -190,71 +120,39 @@
                   >
                   </el-option>
                 </el-select> -->
-            <el-cascader
-              v-model="todayPlanForm.stationId"
-              :options="departmentList"
-              :props="{ checkStrictly: true }"
-              collapse-tags
-              class="w100"
-              clearable
-              @change="getIncharger()"
-            >
+            <el-cascader v-model="todayPlanForm.stationId" :options="departmentList" :props="{ checkStrictly: true }"
+              collapse-tags class="w100" clearable @change="getIncharger()">
             </el-cascader>
           </el-form-item>
           <el-form-item label="工长" prop="foremanId">
             <el-input v-model="todayPlanForm.foremanName"></el-input>
           </el-form-item>
           <el-form-item label="开工时间" prop="startDate">
-            <el-date-picker
-              class="w100"
-              v-model="todayPlanForm.startDate"
-              type="date"
-              placeholder="选择日期"
-              value-format="yyyy-MM-dd"
-            >
+            <el-date-picker class="w100" v-model="todayPlanForm.startDate" type="date" placeholder="选择日期"
+              value-format="yyyy-MM-dd">
             </el-date-picker>
           </el-form-item>
           <el-form-item label="完工时间" prop="endDate">
-            <el-date-picker
-              class="w100"
-              v-model="todayPlanForm.endDate"
-              type="date"
-              placeholder="选择日期"
-              value-format="yyyy-MM-dd"
-            >
+            <el-date-picker class="w100" v-model="todayPlanForm.endDate" type="date" placeholder="选择日期"
+              value-format="yyyy-MM-dd">
             </el-date-picker>
           </el-form-item>
           <el-form-item label="描述" style="width: 100%">
-            <el-input
-              type="textarea"
-              :rows="6"
-              placeholder="请输入描述"
-              v-model="todayPlanForm.describtion"
-            >
+            <el-input type="textarea" :rows="6" placeholder="请输入描述" v-model="todayPlanForm.describtion">
             </el-input>
           </el-form-item>
         </el-form>
       </div>
       <span slot="footer" class="dialog-footer">
-        <el-button
-          @click="
-            (editPlanDiaLog = false), $refs['todayPlanForm'].resetFields()
-          "
-          >取 消</el-button
-        >
-        <el-button type="primary" @click="addPlanData('todayPlanForm')"
-          >确 定</el-button
-        >
+        <el-button @click="
+          (editPlanDiaLog = false), $refs['todayPlanForm'].resetFields()
+          ">取 消</el-button>
+        <el-button type="primary" @click="addPlanData('todayPlanForm')">确 定</el-button>
       </span>
     </el-dialog>
 
     <!-- 部门设置弹框 -->
-    <el-dialog
-      title="部门设置"
-      :visible.sync="deptSetDialog"
-      width="30%"
-      :before-close="handleClose"
-    >
+    <el-dialog title="部门设置" :visible.sync="deptSetDialog" width="30%" :before-close="handleClose">
       <div>
         <span>{{ "选择部门" }}</span>
         <!-- <el-cascader
@@ -265,11 +163,8 @@
           clearable
         >
         </el-cascader> -->
-        <el-cascader
-          v-model="departmentIdArray"
-          :options="departmentList"
-          :props="{ multiple: true, checkStrictly: true }"
-          clearable>
+        <el-cascader v-model="departmentIdArray" :options="departmentList"
+          :props="{ multiple: true, checkStrictly: true }" clearable>
         </el-cascader>
       </div>
       <span slot="footer" class="dialog-footer">
@@ -280,7 +175,7 @@
   </div>
 </template>
   
-  <script>
+<script>
 export default {
   name: "planComponent",
   components: {},
@@ -296,7 +191,7 @@ export default {
     },
   },
   data() {
-    return { 
+    return {
       steelStampNumber: "",
       planDate: this.todayDate,
       deptSetDialog: false,
@@ -321,7 +216,7 @@ export default {
         startDate: "",
         endDate: "",
         describtion: "",
-        versionNumber:"",
+        versionNumber: "",
       },
       todayTabIndex: 0,
       tableDataLoading: false,
@@ -356,7 +251,7 @@ export default {
   },
   computed: {},
   watch: {},
-  created() {},
+  created() { },
   mounted() {
     this.getDepartmentList(),
       this.getPlanDeptSet(),
@@ -570,7 +465,7 @@ export default {
           console.log(this.todayPlanForm, "传给后端的值");
           let stationId =
             this.todayPlanForm.stationId[
-              this.todayPlanForm.stationId.length - 1
+            this.todayPlanForm.stationId.length - 1
             ];
           this.http.post(
             "/plan/addOrUpdatePlan",
@@ -644,7 +539,7 @@ export default {
         {
           deptId:
             this.todayPlanForm.stationId[
-              this.todayPlanForm.stationId.length - 1
+            this.todayPlanForm.stationId.length - 1
             ],
         },
         (res) => {
@@ -687,80 +582,80 @@ export default {
       });
     },
     // 导入数据
-    importData(item){
-        this.tableDataLoading = true;
-        let formData = new FormData();
-        formData.append("file", item.file);
-        formData.append("planType",this.planType);
-        this.http.uploadFile('/plan/importData', formData,
+    importData(item) {
+      this.tableDataLoading = true;
+      let formData = new FormData();
+      formData.append("file", item.file);
+      formData.append("planType", this.planType);
+      this.http.uploadFile('/plan/importData', formData,
         res => {
-            this.$refs.upload.clearFiles();
-            this.tableDataLoading = false;
-            if (res.code == "ok") {
-                this.$message({
-                    message: '导入成功',
-                    type: "success"
-                });
-                this.getTableData(this.hasChooseDept);
-            } else {
-                this.$message({
-                    message: res.msg,
-                    type: "error"
-                });
-            }
-        },
-        error => {
-            this.$refs.upload.clearFiles();
-            this.tableDataLoading = false;
+          this.$refs.upload.clearFiles();
+          this.tableDataLoading = false;
+          if (res.code == "ok") {
             this.$message({
-                message: error,
-                type: "error"
+              message: '导入成功',
+              type: "success"
             });
+            this.getTableData(this.hasChooseDept);
+          } else {
+            this.$message({
+              message: res.msg,
+              type: "error"
+            });
+          }
+        },
+        error => {
+          this.$refs.upload.clearFiles();
+          this.tableDataLoading = false;
+          this.$message({
+            message: error,
+            type: "error"
+          });
         });
     },
-    exportData(){
+    exportData() {
       let param = {
-          planType: this.planType,
-          date: this.planDate,
-          steelStampNumber: this.steelStampNumber,
+        planType: this.planType,
+        date: this.planDate,
+        steelStampNumber: this.steelStampNumber,
       }
-      this.http.post('/plan/exportData',param,
-      res => {
+      this.http.post('/plan/exportData', param,
+        res => {
           if (res.code == "ok") {
-              var filePath = res.data;
-              const a = document.createElement('a'); // 创建a标签
-              a.setAttribute('download', this.$t('projectexport') + '.xlsx');// download属性
-              a.setAttribute('href', filePath);// href链接
-              a.click(); //自执行点击事件
-              a.remove();
-          } 
-      },
-      error => {
+            var filePath = res.data;
+            const a = document.createElement('a'); // 创建a标签
+            a.setAttribute('download', this.$t('projectexport') + '.xlsx');// download属性
+            a.setAttribute('href', filePath);// href链接
+            a.click(); //自执行点击事件
+            a.remove();
+          }
+        },
+        error => {
           this.$message({
-              message: error,
-              type: "error"
+            message: error,
+            type: "error"
           });
-          }
+        }
       );
     },
     handleSelectionChange(val) {
-        this.multipleSelection = val.map(item => item.id);
-        console.log(this.multipleSelection)
+      this.multipleSelection = val.map(item => item.id);
+      console.log(this.multipleSelection)
     },
-    allocationPlan(){
-      if(this.multipleSelection.length==0){
-          return
+    allocationPlan() {
+      if (this.multipleSelection.length == 0) {
+        return
       }
       this.http.post(
         "/plan/allocationPlan",
         {
-          ids:this.multipleSelection.join(","),
-          planType:this.planType
+          ids: this.multipleSelection.join(","),
+          planType: this.planType
         },
         (res) => {
           if (res.code == "ok") {
             this.$message({
-              message:'下发成功',
+              message: '下发成功',
               type: "success",
             });
           } else {
@@ -781,11 +676,12 @@ export default {
   },
 };
 </script>
-  <style scoped lang='scss'>
+<style scoped lang='scss'>
 .colorText {
   color: #02a7f0;
   cursor: pointer;
 }
+
 .layout-container {
   width: 100%;
   height: 100%;
@@ -794,22 +690,26 @@ export default {
   flex-direction: column;
   box-sizing: border-box;
   padding: 10px;
+
   .layout-container-header,
   .layout-container-center,
   .layout-container-floor {
     width: 100%;
   }
+
   .layout-container-center {
     flex: 1;
     display: flex;
     flex-direction: column;
   }
+
   .layout-container-floor {
     box-sizing: border-box;
     display: flex;
-    justify-content: end;
+    justify-content: space-between;
     padding: 10px 20px;
   }
+
   .OutSide {
     width: 100%;
     display: flex;
@@ -817,29 +717,38 @@ export default {
     justify-content: space-between;
     flex-direction: initial;
     padding-bottom: 10px;
+
     .demonstration {
       margin-right: 20px;
       min-width: 48px;
     }
+
     .OutSide_left {
       width: 200px;
       display: flex;
       justify-content: space-between;
       align-items: center;
+
       div {
         font-size: 16px;
       }
+
       div:first-child {
         font-size: 20px;
       }
     }
-    .OutSide, .block {
+
+    .OutSide,
+    .block {
       max-width: 400px;
     }
+
     .OutSide_center {
       flex: 1;
       display: flex;
       justify-content: center;
+      align-items: center;
+
       .block {
         display: flex;
         align-items: center;
@@ -848,44 +757,57 @@ export default {
     }
 
     .OutSide_right {
+      display: flex;
+      align-items: center;
       .el-link {
         margin-right: 15px;
       }
     }
   }
+
   .today-tab {
     display: flex;
     overflow-x: auto;
     margin-bottom: 10px;
+
     div {
       font-size: 16px;
       margin-left: 15px;
       cursor: pointer;
     }
+
     .on {
       color: #02a7f0;
     }
   }
 
   .planDialog::-webkit-scrollbar {
-    display: none; /* Chrome Safari */
+    display: none;
+    /* Chrome Safari */
   }
+
   // 新增样式
   .planDialog {
     max-height: 50vh;
     overflow-y: auto;
-    scrollbar-width: none; /* Firefox */
-    -ms-overflow-style: none; /* IE 10+ */
+    scrollbar-width: none;
+    /* Firefox */
+    -ms-overflow-style: none;
+
+    /* IE 10+ */
     .el-form {
       display: flex;
       flex-wrap: wrap;
       justify-content: space-between;
     }
+
     .w100 {
       width: 100%;
     }
+
     .el-form-item {
       width: 50%;
+
       .w45 {
         width: 49%;
       }