下差纤度，上差纤度，目的纤度 3个部分列表的数据处理+纤度登记 回数的字段修改

haoxuan

2024-04-09 b878a6b4f40708ca330591cdd4dfee2387ebf970

 src/views/productManage/silkRegisterForm/addPage.vue

@@ -1,829 +1,1051 @@
<template>
    <div class="custom-manage">
        <div class="tab-view">
            <el-tabs v-model="activeName" @tab-click="tabsClick">
                <el-tab-pane label="纤度登记表" name="first"></el-tab-pane>
                <el-tab-pane label="纤度检验表" :disabled='!registerId&&!isRegisterSave' name="second"></el-tab-pane>
            </el-tabs>
  <div class="custom-manage">
    <div class="tab-view">
      <el-tabs v-model="activeName" @tab-click="tabsClick">
        <el-tab-pane label="纤度登记表" name="first"></el-tab-pane>
        <el-tab-pane
          label="纤度检验表"
          :disabled="!registerId && !isRegisterSave"
          name="second"
        ></el-tab-pane>
      </el-tabs>
    </div>
    <template v-if="activeName == 'first'">
      <div class="filter">
        <div class="filter-card">
          <CommonSearch
            :show-add="false"
            :show-download="false"
            :amount-view="false"
            :show-action-btn="false"
            placeholder="请输入关键词"
            @searchClick="onFilterSearch"
          >
            <template slot="leftButton">
              <el-button size="small" type="primary" @click="cancelClickOne"
                >放弃</el-button
              >
              <el-button
                size="small"
                type="primary"
                :loading="isAddloading"
                @click="saveClickOne('form')"
                >保存</el-button
              >
            </template>
          </CommonSearch>
        </div>
        <template v-if="activeName == 'first'">
            <div class="filter">
                <div class="filter-card">
                    <CommonSearch :show-add="false" :show-download="false" :amount-view="false" :show-action-btn="false"
                        placeholder="请输入关键词" @searchClick="onFilterSearch">
                        <template slot="leftButton">
                            <el-button size="small" type="primary" @click="cancelClickOne">放弃</el-button>
                            <el-button size="small" type="primary" :loading="isAddloading"
                                @click="saveClickOne('form')">保存</el-button>
                        </template>
                    </CommonSearch>
                </div>
            </div>
      </div>

            <div class="body">
                <div class="body-l">
                    <el-form ref="form" class="form-box" :model="form" :rules="rules" label-position="left"
                        label-width="80px">
                        <el-form-item label="编号" prop="number" class="form-item">
                            <el-input v-model="form.number" placeholder="请输入">
                            </el-input>
                        </el-form-item>
                        <el-form-item label="落丝时间" prop="finishDate" class="form-item">
                            <el-date-picker v-model="form.finishDate" value-format="yyyy-MM-dd" type="date"
                                placeholder="选择日期" class="select-width">
                            </el-date-picker>
                        </el-form-item>
                        <el-form-item label="庄口" prop="market" class="form-item">
                            <el-select v-model="form.market" placeholder="请选择" class="select-width">
                                <el-option v-for="item in marketList" :key="item.ID" :label="item.name"
                                    :value="item.name">
                                </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="车间" prop="name" class="form-item">
                            <el-select v-model="form.name" placeholder="请选择" class="select-width">
                                <el-option v-for="item in nameList" :key="item.ID" :label="item.name"
                                    :value="item.name">
                                </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="规格" prop="spec" class="form-item">
                            <el-select v-model="form.spec" placeholder="请选择" class="select-width">
                                <el-option v-for="item in specList" :key="item.ID" :label="item.name"
                                    :value="item.name">
                                </el-option>
                            </el-select>
                            <!-- <el-input v-model="form.spec" placeholder="请输入">
      <div class="body">
        <div class="body-l">
          <el-form
            ref="form"
            class="form-box"
            :model="form"
            :rules="rules"
            label-position="left"
            label-width="80px"
          >
            <el-form-item label="编号" prop="number" class="form-item">
              <el-input v-model="form.number" placeholder="请输入"> </el-input>
            </el-form-item>
            <el-form-item label="落丝时间" prop="finishDate" class="form-item">
              <el-date-picker
                v-model="form.finishDate"
                value-format="yyyy-MM-dd"
                type="date"
                placeholder="选择日期"
                class="select-width"
              >
              </el-date-picker>
            </el-form-item>
            <el-form-item label="庄口" prop="market" class="form-item">
              <el-select
                v-model="form.market"
                placeholder="请选择"
                class="select-width"
              >
                <el-option
                  v-for="item in marketList"
                  :key="item.ID"
                  :label="item.name"
                  :value="item.name"
                >
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="车间" prop="name" class="form-item">
              <el-select
                v-model="form.name"
                placeholder="请选择"
                class="select-width"
              >
                <el-option
                  v-for="item in nameList"
                  :key="item.ID"
                  :label="item.name"
                  :value="item.name"
                >
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="规格" prop="spec" class="form-item">
              <el-select
                v-model="form.spec"
                placeholder="请选择"
                class="select-width"
              >
                <el-option
                  v-for="item in specList"
                  :key="item.ID"
                  :label="item.name"
                  :value="item.name"
                >
                </el-option>
              </el-select>
              <!-- <el-input v-model="form.spec" placeholder="请输入">
                            </el-input> -->
                        </el-form-item>
                        <el-form-item label="组别" prop="workshopGroup" class="form-item">
                            <el-select v-model="form.workshopGroup" placeholder="请选择" class="select-width">
                                <el-option v-for="item in workshopGroupList" :key="item.ID" :label="item.name"
                                    :value="item.ID">
                                </el-option>
                            </el-select>

                        </el-form-item>
                        <el-form-item label="回数" prop='circle' class="form-item">
                            <el-row>
                                <el-col :span="11">
                                    <el-form-item label="" @input="inputStart" label-width="0" prop="startCircle"
                                        class="select-width">
                                        <el-input v-model.number="form.startCircle" placeholder="请输入" show-word-limit
                                            class="select-width"></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="2" style="margin:0 auto;text-align:center;">-</el-col>
                                <el-col :span="11">
                                    <el-form-item label="" label-width="0" prop="endCircle" class="select-width">

                                        <el-input v-model.number="form.endCircle" @input="inputStart" placeholder="请输入"
                                            show-word-limit class="select-width"></el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                        </el-form-item>
                        <el-form-item label="车号" prop="position" class="form-item">
                            <el-input v-model="form.position" placeholder="请输入">
                            </el-input>
                        </el-form-item>
                    </el-form>
                    <div class="list-view">
                        <!-- <TableCommonView ref="tableListRef" :colOpenShow="false" v-loading="loading" :table-list="tableList"
            </el-form-item>
            <el-form-item label="组别" prop="workshopGroup" class="form-item">
              <el-select
                v-model="form.workshopGroup"
                placeholder="请选择"
                class="select-width"
              >
                <el-option
                  v-for="item in workshopGroupList"
                  :key="item.ID"
                  :label="item.name"
                  :value="item.ID"
                >
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="回数" prop="circle" class="form-item">
              <el-row>
                <el-col :span="11">
                  <el-form-item
                    label=""
                    @input="inputStart"
                    label-width="0"
                    prop="circle"
                    class="select-width"
                  >
                    <el-input
                      v-model.number="form.circle"
                      placeholder="请输入"
                      show-word-limit
                      class="select-width"
                    ></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="2" style="margin: 0 auto; text-align: center"
                  >-</el-col
                >
                <el-col :span="11">
                  <el-form-item
                    label=""
                    label-width="0"
                    prop="totalCircle"
                    class="select-width"
                  >
                    <el-input
                      v-model.number="form.totalCircle"
                      @input="inputStart"
                      placeholder="请输入"
                      show-word-limit
                      class="select-width"
                    ></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-form-item>
            <el-form-item label="车号" prop="position" class="form-item">
              <el-input v-model="form.position" placeholder="请输入">
              </el-input>
            </el-form-item>
          </el-form>
          <div class="list-view">
            <!-- <TableCommonView ref="tableListRef" :colOpenShow="false" v-loading="loading" :table-list="tableList"
                            @selTableCol="selTableCol">
                        </TableCommonView> -->
                        <!-- 修改为输入 -->
                        <CommonFormTableView ref="commonFormTableView" :detail-enter="isView ? true : false"
                            :selectBox="false" :detailEnter="true" :show-summary="showSummary"
                            :product-table-list="tableList" @inputContent="inputContent"
                            @addProductClick="addProductClick"></CommonFormTableView>
                    </div>
                </div>
                <div class="body-r">
                    纤度：
                    <p>{{ form.sumFineness }}</p>
                </div>
            </div>
        </template>
        <template v-if="activeName == 'second'">
            <div class="filter">
                <div class="filter-card">
                    <!-- <CommonSearch :show-add="false" :show-download="false" :amount-view="false" :show-action-btn="false"
            <!-- 修改为输入 -->
            <CommonFormTableView
              ref="commonFormTableView"
              :detail-enter="isView ? true : false"
              :selectBox="false"
              :detailEnter="true"
              :show-summary="showSummary"
              :product-table-list="tableList"
              @inputContent="inputContent"
              @addProductClick="addProductClick"
            ></CommonFormTableView>
          </div>
        </div>
        <div class="body-r">
          纤度：
          <p>{{ form.sumFineness }}</p>
        </div>
      </div>
    </template>
    <template v-if="activeName == 'second'">
      <div class="filter">
        <div class="filter-card">
          <!-- <CommonSearch :show-add="false" :show-download="false" :amount-view="false" :show-action-btn="false"
                        placeholder="请输入关键词" @searchClick="onFilterSearch">
                        <template slot="leftButton"> -->
                    <el-button size="small" type="primary" @click="cancelClickTwo">放弃</el-button>
                    <el-button size="small" type="primary" :loading="isAddloading"
                        @click="saveClickOne('form')">保存</el-button>
                    <!-- </template>
          <el-button size="small" type="primary" @click="cancelClickTwo"
            >放弃</el-button
          >
          <el-button
            size="small"
            type="primary"
            :loading="isAddloading"
            @click="saveClickOne('form')"
            >保存</el-button
          >
          <!-- </template>
</CommonSearch> -->
                </div>
            </div>
            <div class="body-two body">
                <div class="body-two-t">纤度检验表</div>
                <el-form ref="form" class="form-box" :model="form" :rules="rules" label-position="right"
                    label-width="60px">
                    <div class="form-box-t">
                        <el-form-item label="编号" prop="number" class="form-item">
                            {{ form.number }}
                        </el-form-item>
                        <el-form-item label="车间" prop="name" class="form-item">
                            {{ form.name }}
                        </el-form-item>
                        <el-form-item label="组别" prop="workshopGroup" class="form-item">
                            {{ form.workshopGroup }}
                        </el-form-item>
                        <el-form-item label="回数" prop="circle" class="form-item">
                            {{ form.circle }}
                        </el-form-item>
                        <el-form-item label="规格" prop="spec" class="form-item">
                            {{ form.spec }}
                        </el-form-item>
                        <el-form-item label="日期" prop="finishDate" class="form-item">
                            {{ form.finishDate }}
                        </el-form-item>
                    </div>
                    <div class="list-view">
                        <el-table ref="multipleTable" :data="tableTwoList.tableInfomation" tooltip-effect="dark"
                            style="width: 100%">
                            <el-table-column label="车号" prop="ID" width="100">
                            </el-table-column>
                            <el-table-column label="下差纤度" prop="name1" width="100" align="center">
                                <template v-for="(item, i) in tableTwoList.lower">
                                    <el-table-column align="center" :key="i" :prop="item.prop" :label="item.label"
                                        :width="item.width" :min-width="item.min" show-overflow-tooltip
                                        :sortable="item.sortable">
                                    </el-table-column>
                                </template>
                            </el-table-column>
                            <el-table-column label="目的纤度" prop="name2" width="100" align="center">
                                <template v-for="(item, i) in tableTwoList.objective">
                                    <el-table-column align="center" :key="i" :prop="item.prop" :label="item.label"
                                        :width="item.width" :min-width="item.min" show-overflow-tooltip
                                        :sortable="item.sortable">
                                    </el-table-column>
                                </template>
                            </el-table-column>
                            <el-table-column label="上差纤度" prop="name3" width="100" align="center">
                                <template v-for="(item, i) in tableTwoList.upper">
                                    <el-table-column align="center" :key="i" :prop="item.prop" :label="item.label"
                                        :width="item.width" :min-width="item.min" show-overflow-tooltip
                                        :sortable="item.sortable">
                                    </el-table-column>
                                </template>
                            </el-table-column>
                            <el-table-column prop="deviation" label="偏差" width="120">
                            </el-table-column>
                            <el-table-column prop="totalDeviation" label="总差" show-overflow-tooltip>
                            </el-table-column>
                            <el-table-column prop="valueRange" label="野纤" width="120">
                            </el-table-column>
                            <el-table-column prop="unit" label="大野" show-overflow-tooltip>
                            </el-table-column>
                            <el-table-column prop="valueRange" label="特野" width="120">
                            </el-table-column>
                            <el-table-column prop="finenessGrade" label="等级" show-overflow-tooltip>
                            </el-table-column>
                            <el-table-column prop="twiceChange" label="II度" width="120">
                            </el-table-column>
                            <el-table-column prop="cleanliness" label="清洁" show-overflow-tooltip>
                            </el-table-column>
                            <el-table-column prop="purity" label="洁净" width="120">
                            </el-table-column>
                            <el-table-column prop="remark" label="备注" show-overflow-tooltip>
                            </el-table-column>
                        </el-table>
                    </div>
                    <div class="form-box-b">
                        <el-form-item label="平均纤度" prop="averageFineness" class="form-item-two" label-width="100px">
                            {{ form.averageFineness }}
                        </el-form-item>
                        <el-form-item label="公量纤度" prop="measureFineness" class="form-item" label-width="100px">
                            <el-input v-model="form.measureFineness" placeholder="请输入">
                            </el-input>
                        </el-form-item>
                        <el-form-item label="偏差" prop="deviation" class="form-item-two">
                            {{ form.deviation }}
                        </el-form-item>
                        <el-form-item label="总差" prop="totalDeviation" class="form-item-two">
                            {{ form.totalDeviation }}
                        </el-form-item>
                        <el-form-item label="车组等级" prop="finenessGrade" class="form-item-two" label-width="100px">
                            {{ form.finenessGrade }}
                        </el-form-item>
                        <el-form-item label="II度" prop="twiceChange" class="form-item">
                            <el-input v-model="form.twiceChange" placeholder="请输入">
                            </el-input>
                        </el-form-item>
                        <el-form-item label="清洁" prop="cleanliness" class="form-item">
                            <el-input v-model="form.cleanliness" placeholder="请输入">
                            </el-input>
                        </el-form-item>
                        <el-form-item label="洁净" prop="purity" class="form-item">
                            <el-input v-model="form.purity" placeholder="请输入">
                            </el-input>
                        </el-form-item>
                        <el-form-item label="庄口工艺单编号" prop="marketProcessOrderNumber" class="form-item"
                            label-width="110px">
                            <el-input v-model="form.marketProcessOrderNumber" placeholder="请输入">
                            </el-input>
                        </el-form-item>
                        <el-form-item label="检验员" prop="inspector" class="form-item">
                            <el-input v-model="form.inspector" placeholder="请输入">
                            </el-input>
                        </el-form-item>
                    </div>
                </el-form>
            </div>
        </template>
    </div>
        </div>
      </div>
      <div class="body-two body">
        <div class="body-two-t">纤度检验表</div>
        <el-form
          ref="form"
          class="form-box"
          :model="form"
          :rules="rules"
          label-position="right"
          label-width="60px"
        >
          <div class="form-box-t">
            <el-form-item label="编号" prop="number" class="form-item">
              {{ form.number }}
            </el-form-item>
            <el-form-item label="车间" prop="name" class="form-item">
              {{ form.name }}
            </el-form-item>
            <el-form-item label="组别" prop="workshopGroup" class="form-item">
              {{ form.workshopGroup }}
            </el-form-item>
            <el-form-item label="回数" prop="circle" class="form-item">
              {{ form.circle }}
            </el-form-item>
            <el-form-item label="规格" prop="spec" class="form-item">
              {{ form.spec }}
            </el-form-item>
            <el-form-item label="日期" prop="finishDate" class="form-item">
              {{ form.finishDate }}
            </el-form-item>
          </div>
          <div class="list-view">
            <el-table
              ref="multipleTable"
              :data="tableTwoList.tableInfomation"
              tooltip-effect="dark"
              style="width: 100%"
            >
              <el-table-column label="车号" prop="ID" width="100">
              </el-table-column>
              <el-table-column
                label="下差纤度"
                prop="name1"
                width="100"
                align="center"
              >
                <template v-for="(item, i) in tableTwoList.lower">
                  <el-table-column
                    align="center"
                    :key="i"
                    :prop="item.prop"
                    :label="item.label"
                    :width="item.width"
                    :min-width="item.min"
                    show-overflow-tooltip
                    :sortable="item.sortable"
                  >
                  </el-table-column>
                </template>
              </el-table-column>
              <el-table-column
                label="目的纤度"
                prop="name2"
                width="100"
                align="center"
              >
                <template v-for="(item, i) in tableTwoList.objective">
                  <el-table-column
                    align="center"
                    :key="i"
                    :prop="item.prop"
                    :label="item.label"
                    :width="item.width"
                    :min-width="item.min"
                    show-overflow-tooltip
                    :sortable="item.sortable"
                  >
                  </el-table-column>
                </template>
              </el-table-column>
              <el-table-column
                label="上差纤度"
                prop="name3"
                width="100"
                align="center"
              >
                <template v-for="(item, i) in tableTwoList.upper">
                  <el-table-column
                    align="center"
                    :key="i"
                    :prop="item.prop"
                    :label="item.label"
                    :width="item.width"
                    :min-width="item.min"
                    show-overflow-tooltip
                    :sortable="item.sortable"
                  >
                  </el-table-column>
                </template>
              </el-table-column>
              <el-table-column prop="deviation" label="偏差" width="120">
              </el-table-column>
              <el-table-column
                prop="totalDeviation"
                label="总差"
                show-overflow-tooltip
              >
              </el-table-column>
              <el-table-column prop="valueRange" label="野纤" width="120">
              </el-table-column>
              <el-table-column prop="unit" label="大野" show-overflow-tooltip>
              </el-table-column>
              <el-table-column prop="valueRange" label="特野" width="120">
              </el-table-column>
              <el-table-column
                prop="finenessGrade"
                label="等级"
                show-overflow-tooltip
              >
              </el-table-column>
              <el-table-column prop="twiceChange" label="II度" width="120">
              </el-table-column>
              <el-table-column
                prop="cleanliness"
                label="清洁"
                show-overflow-tooltip
              >
              </el-table-column>
              <el-table-column prop="purity" label="洁净" width="120">
              </el-table-column>
              <el-table-column prop="remark" label="备注" show-overflow-tooltip>
              </el-table-column>
            </el-table>
          </div>
          <div class="form-box-b">
            <el-form-item
              label="平均纤度"
              prop="averageFineness"
              class="form-item-two"
              label-width="100px"
            >
              {{ form.averageFineness }}
            </el-form-item>
            <el-form-item
              label="公量纤度"
              prop="measureFineness"
              class="form-item"
              label-width="100px"
            >
              <el-input v-model="form.measureFineness" placeholder="请输入">
              </el-input>
            </el-form-item>
            <el-form-item label="偏差" prop="deviation" class="form-item-two">
              {{ form.deviation }}
            </el-form-item>
            <el-form-item
              label="总差"
              prop="totalDeviation"
              class="form-item-two"
            >
              {{ form.totalDeviation }}
            </el-form-item>
            <el-form-item
              label="车组等级"
              prop="finenessGrade"
              class="form-item-two"
              label-width="100px"
            >
              {{ form.finenessGrade }}
            </el-form-item>
            <el-form-item label="II度" prop="twiceChange" class="form-item">
              <el-input v-model="form.twiceChange" placeholder="请输入">
              </el-input>
            </el-form-item>
            <el-form-item label="清洁" prop="cleanliness" class="form-item">
              <el-input v-model="form.cleanliness" placeholder="请输入">
              </el-input>
            </el-form-item>
            <el-form-item label="洁净" prop="purity" class="form-item">
              <el-input v-model="form.purity" placeholder="请输入"> </el-input>
            </el-form-item>
            <el-form-item
              label="庄口工艺单编号"
              prop="marketProcessOrderNumber"
              class="form-item"
              label-width="110px"
            >
              <el-input
                v-model="form.marketProcessOrderNumber"
                placeholder="请输入"
              >
              </el-input>
            </el-form-item>
            <el-form-item label="检验员" prop="inspector" class="form-item">
              <el-input v-model="form.inspector" placeholder="请输入">
              </el-input>
            </el-form-item>
          </div>
        </el-form>
      </div>
    </template>
  </div>
</template>

<script>
import { saveRegister, getDictList, getWorkshopManageList, getRegisterDetails } from "@/api/productManage/silkRegisterForm.js"
import { getCheckDetails, saveCheck, } from "@/api/productManage/silkInspectForm.js"
import pageMixin from "@/components/makepager/pager/mixin/pageMixin"
import CommonFormTableView from "@/components/makepager/CommonFormTableView"
import {
  saveRegister,
  getDictList,
  getWorkshopManageList,
  getRegisterDetails,
} from "@/api/productManage/silkRegisterForm.js";
import {
  getCheckDetails,
  saveCheck,
} from "@/api/productManage/silkInspectForm.js";
import pageMixin from "@/components/makepager/pager/mixin/pageMixin";
import CommonFormTableView from "@/components/makepager/CommonFormTableView";
export default {
    name: "silkRegisterAddPage",
    props: {},
    mixins: [pageMixin],
    components: {
        CommonFormTableView,
    },
    computed: {},
    data() {
        return {
            loading: false,
            activeName: "first",
            searchOptions: [],
            keyword: '',
            marketList: [], //庄口
            nameList: [], //车间
            workshopGroupList: [], //组别
            deliveryTypeList: [],
            specList: [], //规格
            form: {
            },
            rules: {
                number: [
                    { required: true, message: "请填写", trigger: ["change", 'blur'] },
                ],
                finishDate: [
                    { required: true, message: "请选择", trigger: ["change", 'blur'] },
                ],
                // 车间 应该true
                name: [
                    { required: true, message: "请选择", trigger: ["change", 'blur'] },
                ],
                spec: [
                    { required: true, message: "请填写", trigger: ["change", 'blur'] },
                ],
                // 组别 应该true
                workshopGroup: [
                    { required: false, message: "请选择", trigger: ["change", 'blur'] },
                ],
                circle: [
                    { required: true, message: "请填写", trigger: ["change", 'blur'] },
                ],
                startCircle: [
                    { required: true, message: "请填写", trigger: ["change", 'blur'] },
                ],
                endCircle: [
                    { required: true, message: "请填写", trigger: ["change", 'blur'] },
                ],
                position: [
                    { required: true, message: "请填写", trigger: ["change", 'blur'] },
                ],
            },
            tableTwoList: {
                tableInfomation: [],
                lower: [],
                objective: [],
                upper: [],
            },
            // 新增纤度登记表
            isAddloading: false,
            isView: true,
            showSummary: {
                show: true,
                total: true,
                totalLabel: '合计:',
                sumProp: ["fineness", "quantity", 'sum'],
                mergeNumber: 0
            },
  name: "silkRegisterAddPage",
  props: {},
  mixins: [pageMixin],
  components: {
    CommonFormTableView,
  },
  computed: {},
  data() {
    return {
      loading: false,
      activeName: "first",
      searchOptions: [],
      keyword: "",
      marketList: [], //庄口
      nameList: [], //车间
      workshopGroupList: [], //组别
      deliveryTypeList: [],
      specList: [], //规格
      form: {},
      rules: {
        number: [
          { required: true, message: "请填写", trigger: ["change", "blur"] },
        ],
        finishDate: [
          { required: true, message: "请选择", trigger: ["change", "blur"] },
        ],
        // 车间 应该true
        name: [
          { required: true, message: "请选择", trigger: ["change", "blur"] },
        ],
        spec: [
          { required: true, message: "请填写", trigger: ["change", "blur"] },
        ],
        // 组别 应该true
        workshopGroup: [
          { required: false, message: "请选择", trigger: ["change", "blur"] },
        ],
        circleTwo: [
          { required: true, message: "请填写", trigger: ["change", "blur"] },
        ],
        circle: [
          { required: true, message: "请填写", trigger: ["change", "blur"] },
        ],
        totalCircle: [
          { required: true, message: "请填写", trigger: ["change", "blur"] },
        ],
        position: [
          { required: true, message: "请填写", trigger: ["change", "blur"] },
        ],
      },
      tableTwoList: {
        tableInfomation: [],
        lower: [],
        objective: [],
        upper: [],
      },
      // 新增纤度登记表
      isAddloading: false,
      isView: true,
      showSummary: {
        show: true,
        total: true,
        totalLabel: "合计:",
        sumProp: ["fineness", "quantity", "sum"],
        mergeNumber: 0,
      },
      productId: 1,
      tableList: {
        allcol: [],
        headerColor: "red",
        showcol: ["车号", "纤度值", "数量", "纤度合计"],
        tableData: [
          {
            productId: 1,
            tableList: {
                allcol: [],
                headerColor: 'red',
                showcol: ['车号', '纤度值', '数量', '纤度合计'],
                tableData: [
                    {
                        productId: 1,
                        position: null,
                        fineness: null,
                        quantity: null,
                        sum: null,
                    }
                ],
                tableColumn: [
                    { label: "车号", prop: "position", inputNumber: true, isRequird: true, }, // 客户名称
                    { label: "纤度值", prop: "fineness", inputNumber: true, isRequird: true, }, // 销售负责人
                    { label: "数量", prop: "quantity", inputNumber: true, isRequird: true, }, // 重要级别
                    { label: "纤度合计", prop: "sum", inputNumber: true, isRequird: true, }, // 下次回访日期
                ],
            },
            tableData: [],
            registerId: '',
            inspectID: '',
            isRegisterSave:false,
        }
    },
    created() {
        let query = this.$route.query;
        if (query) {
            this.activeName = query.activeName ? query.activeName : "first";
            this.registerId = query.id ? query.id : "";
            this.inspectID = query.inspectID ? query.inspectID : "";
        }
        this.getSelectDataList()
        this.keyword = ''
        this.getDetailsData()
    },
    methods: {
        getDetailsData(id) {
            if (this.activeName == 'first') {
                this.form = {
                    number: '',
                    finishDate: '',
                    market: '',
                    name: '',
                    spec: '',
                    workshopGroup: '',
                    circle: '',
                    startCircle: '',
                    endCircle: '',
                    position: '',
                }
                if (this.registerId) {
                    getRegisterDetails({ id: id ? id : this.registerId }).then((response) => {
                        if (response.code === 200) {
                            let config = JSON.parse(JSON.stringify(response.data ? response.data : {}));
                            this.form = config;
                            this.tableList.tableData = config.finenessList ? config.finenessList : []
                        }
                    })
                }
            } else {
                this.form = {
                    number: '',
                    name: '',
                    workshopGroup: '',
                    circle: '',
                    spec: '',
                    finishDate: '',
                    averageFineness: '',
                    measureFineness: '',
                    deviation: '',
                    totalDeviation: '',
                    finenessGrade: '',
                    twiceChange: '',
                    cleanliness: '',
                    purity: '',
                    marketProcessOrderNumber: '',
                    inspector: '',
                }
                if (this.inspectID) {
                    getCheckDetails({ id: id ? id : this.inspectID }).then((response) => {
                        if (response.code === 200) {
                            let config = JSON.parse(JSON.stringify(response.data.info ? response.data.info : {}));
                            this.form = config;
                            this.form.number = config.finenessRegister.number
                            this.form.name = config.finenessRegister.name
                            this.form.workshopGroup = config.finenessRegister.workshopGroup
                            this.form.spec = config.finenessRegister.spec
                            this.form.finishDate = config.finenessRegister.finishDate
                            this.form.circle = config.finenessRegister.circle
                            this.getTableHeader()
                            this.tableTwoList.tableInfomation = response.data.items ? response.data.items : []
                        }
                    })
                }
            }
        },
        getTableHeader(){
            let lowNumber;
                            let topNumber;
                            if(this.form.spec){
                                lowNumber=Number(this.form.spec.split('/')[0])
                                topNumber=Number(this.form.spec.split('/')[1])
                            }
                            this.tableTwoList.objective=[]
                            this.tableTwoList.lower=[]
                            this.tableTwoList.upper=[]
                            if(lowNumber&&topNumber){
                                for(let i = 0; i <lowNumber; i++){
                                    let item={
                                        label: lowNumber+i*0.5+'',
                                         prop: lowNumber+i*0.5+'', 
                                         min: 100, 
                                         default: true
                                    }
                                    this.tableTwoList.objective.push(item)
                                    if(lowNumber+i*0.5==topNumber){
                                        break;
                                    }
                                }
                                let lowStart=lowNumber-5
                                for(let i = 0; i <lowStart; i++){
                                    let item={
                                        label: lowStart+i*0.5+'',
                                         prop: lowStart+i*0.5+'', 
                                         min: 100, 
                                         default: true
                                    }
                                    this.tableTwoList.lower.push(item)
                                    if(lowStart+i*0.5==(lowNumber-0.5)){
                                        break;
                                    }
                                }
                                let topEnd=topNumber+5
                                for(let i = 1; i <topNumber; i++){
                                    let item={
                                        label: topNumber+i*0.5+'',
                                         prop: topNumber+i*0.5+'', 
                                         min: 100, 
                                         default: true
                                    }
                                    this.tableTwoList.upper.push(item)
                                    if(topNumber+i*0.5==topEnd){
                                        break;
                                    }
                                }
                            }
                            this.$forceUpdate()
        },
        getSelectDataList() {
            //车间
            getDictList({
                dictType: 1,
            }).then((res) => {
                if (res.code == 200) {
                    this.nameList = res.data || []
                }
            })
            //规格
            getDictList({
                dictType: 3,
            }).then((res) => {
                if (res.code == 200) {
                    this.specList = res.data || []
                }
            })
            //组别
            getWorkshopManageList().then((res) => {
                if (res.code == 200) {
                    this.workshopGroupList = res.data || []
                }
            })
            //庄口
            getDictList({
                dictType: 0,
            }).then((res) => {
                if (res.code == 200) {
                    this.marketList = res.data || []
                }
            })
        },
        inputStart() {
            this.form.circle = this.form.startCircle + '-' + this.form.endCircle
        },
        // 产品新增
        addProductClick() {
            this.productId++
            this.tableData.push({
                productId: this.productId,
                position: '',
                fineness: 0,
                quantity: 0,
                sum: "",
            })
            this.tableList.tableData = this.tableData
            this.showSummary.show = true
        },
        // 产品列表输入
        inputContent(val, prop, row) {
            this.productId = row.productId
            this.tableData.map((item) => {
                if (item.productId === row.productId) {
                    item[prop] = val
                }
            })
        },
        tabsClick() {
            // if (tab.name === "first") {
            //     this.is_public = true
            // } else {
            //     this.is_public = false
            // }
            this.$router.push({
                path:"/productManage/silkRegisterForm/addPage",
                query:{
                  activeName:this.activeName,
                  inspectID:this.inspectID,
                  id:this.registerId,
                }
              });
            this.getDetailsData()
            this.keyword = ''
        },
        // 搜索
        onFilterSearch(searchText) {
            this.keyword = searchText || ''
            this.pagerOptions.currPage = 1
            this.getData()
        },
        // 纤度登记表
        // 放弃
        cancelClickOne() {
            if (this.activeName == 'first') {
                this.form = {
                    number: '',
                    finishDate: '',
                    market: '',
                    name: '',
                    spec: '',
                    workshopGroup: '',
                    circle: '',
                    startCircle: '',
                    endCircle: '',
                    position: '',
                }
                this.$refs.form.resetFields();
                this.productId = 1
                this.tableList.tableData = [{
                    productId: 1,
                    position: '',
                    fineness: 0,
                    quantity: 0,
                    sum: "",
                }]
            }
        },
        // 纤度检验表
        cancelClickTwo() {

        },
        // 保存
        saveClickOne(formName) {
            this.$refs[formName].validate((valid) => {
                if (valid) {
                    let form = JSON.parse(JSON.stringify(this.form));
                    // params.workshopGroup=Number(params.workshopGroup)
                    this.isAddloading = true
                    if (this.activeName == 'first') {
                        delete form.circle
                        let finenessList = JSON.parse(JSON.stringify(this.tableList.tableData));
                        for (let i in finenessList) {
                            delete finenessList[i].productId
                        }
                        let params = {
                            finenessList: finenessList,
                            ...form
                        }
                        // 编辑
                        if (this.inspectID) {
                            params.ID = this.form.ID?this.form.ID:Number(this.inspectID)
                        }
                        saveRegister(params).then((res) => {
                            if (res.code == 200) {
                                this.isRegisterSave=true;
                                this.$message({
                                    message: "保存成功！",
                                    type: "success",
                                });
                                this.$router.push({
                                    path:"/productManage/silkRegisterForm",
                                });
                            }
                            this.isAddloading = false
                        }).catch(() => {
                            setTimeout(() => {
                                this.isAddloading = false;
                            }, 3000);
                        })
                    } else {
                        let paramsTwo = {
                            ...form
                        }
                        // 编辑
                        if (this.registerId) {
                            paramsTwo.ID = this.form.ID?this.form.ID:Number(this.registerId)
                        }
                        saveCheck(paramsTwo).then((res) => {
                            if (res.code == 200) {
                                this.$message({
                                    message: "保存成功！",
                                    type: "success",
                                });
                            }
                            this.isAddloading = false
                        }).catch(() => {
                            setTimeout(() => {
                                this.isAddloading = false;
                            }, 3000);
                        })
                    }

                } else {
                    console.log('error submit!!');

                    return false;
                }
            });
        },
        // 放弃
        cancelClick() {

        },
        saveClick() {

        },

            position: null,
            fineness: null,
            quantity: null,
            sum: null,
          },
        ],
        tableColumn: [
          {
            label: "车号",
            prop: "position",
            inputNumber: true,
            isRequird: true,
          }, // 客户名称
          {
            label: "纤度值",
            prop: "fineness",
            inputNumber: true,
            isRequird: true,
          }, // 销售负责人
          {
            label: "数量",
            prop: "quantity",
            inputNumber: true,
            isRequird: true,
          }, // 重要级别
          {
            label: "纤度合计",
            prop: "sum",
            inputNumber: true,
            isRequird: true,
          }, // 下次回访日期
        ],
      },
      tableData: [],
      registerId: "",
      inspectID: "",
      isRegisterSave: false,
    };
  },
  created() {
    let query = this.$route.query;
    if (query) {
      this.activeName = query.activeName ? query.activeName : "first";
      this.registerId = query.id ? query.id : "";
      this.inspectID = query.inspectID ? query.inspectID : "";
    }
}
    this.getSelectDataList();
    this.keyword = "";
    this.getDetailsData();
  },
  methods: {
    getDetailsData(id) {
      if (this.activeName == "first") {
        this.form = {
          number: "",
          finishDate: "",
          market: "",
          name: "",
          spec: "",
          workshopGroup: "",
          circleTwo: "",
          circle: "",
          totalCircle: "",
          position: "",
        };
        if (this.registerId) {
          getRegisterDetails({ id: id ? id : this.registerId }).then(
            (response) => {
              if (response.code === 200) {
                let config = JSON.parse(
                  JSON.stringify(response.data ? response.data : {})
                );
                this.form = config;
                this.tableList.tableData = config.finenessList
                  ? config.finenessList
                  : [];
              }
            }
          );
        }
      } else {
        this.form = {
          number: "",
          name: "",
          workshopGroup: "",
          circle: "",
          spec: "",
          finishDate: "",
          averageFineness: "",
          measureFineness: "",
          deviation: "",
          totalDeviation: "",
          finenessGrade: "",
          twiceChange: "",
          cleanliness: "",
          purity: "",
          marketProcessOrderNumber: "",
          inspector: "",
        };
        if (this.inspectID) {
          getCheckDetails({ id: id ? id : this.inspectID }).then((response) => {
            if (response.code === 200) {
              let config = JSON.parse(
                JSON.stringify(response.data.info ? response.data.info : {})
              );
              this.form = config;
              this.form.number = config.finenessRegister.number;
              this.form.name = config.finenessRegister.name;
              this.form.workshopGroup = config.finenessRegister.workshopGroup;
              this.form.spec = config.finenessRegister.spec;
              this.form.finishDate = config.finenessRegister.finishDate;
              this.form.circle = config.finenessRegister.circle;
              this.getTableHeader();
              let arr= response.data.items
                ? response.data.items
                : [];
                for(let i in arr){
                    let round=arr[i].finenessRoundingItems
                    if(round){
                        for(let j in round){
                            arr[i][round[j].fineness]=round[j].quantity
                        }
                    }
                }
              this.tableTwoList.tableInfomation =arr;
            }
          });
        }
      }
    },
    getTableHeader() {
      let lowNumber;
      let topNumber;
      if (this.form.spec) {
        lowNumber = Number(this.form.spec.split("/")[0]);
        topNumber = Number(this.form.spec.split("/")[1]);
      }
      this.tableTwoList.objective = [];
      this.tableTwoList.lower = [];
      this.tableTwoList.upper = [];
      if (lowNumber && topNumber) {
        for (let i = 0; i < lowNumber; i++) {
          let item = {
            label: lowNumber + i * 0.5 + "",
            prop: lowNumber + i * 0.5 + "",
            min: 100,
            default: true,
          };
          this.tableTwoList.objective.push(item);
          if (lowNumber + i * 0.5 == topNumber) {
            break;
          }
        }
        let lowStart = lowNumber - 5;
        for (let i = 0; i < lowStart; i++) {
          let item = {
            label: lowStart + i * 0.5 + "",
            prop: lowStart + i * 0.5 + "",
            min: 100,
            default: true,
          };
          this.tableTwoList.lower.push(item);
          if (lowStart + i * 0.5 == lowNumber - 0.5) {
            break;
          }
        }
        let topEnd = topNumber + 5;
        for (let i = 1; i < topNumber; i++) {
          let item = {
            label: topNumber + i * 0.5 + "",
            prop: topNumber + i * 0.5 + "",
            min: 100,
            default: true,
          };
          this.tableTwoList.upper.push(item);
          if (topNumber + i * 0.5 == topEnd) {
            break;
          }
        }
      }
      this.$forceUpdate();
    },
    getSelectDataList() {
      //车间
      getDictList({
        dictType: 1,
      }).then((res) => {
        if (res.code == 200) {
          this.nameList = res.data || [];
        }
      });
      //规格
      getDictList({
        dictType: 3,
      }).then((res) => {
        if (res.code == 200) {
          this.specList = res.data || [];
        }
      });
      //组别
      getWorkshopManageList().then((res) => {
        if (res.code == 200) {
          this.workshopGroupList = res.data || [];
        }
      });
      //庄口
      getDictList({
        dictType: 0,
      }).then((res) => {
        if (res.code == 200) {
          this.marketList = res.data || [];
        }
      });
    },
    inputStart() {
      this.form.circleTwo = this.form.circle + "-" + this.form.totalCircle;
    },
    // 产品新增
    addProductClick() {
      this.productId++;
      this.tableData.push({
        productId: this.productId,
        position: "",
        fineness: 0,
        quantity: 0,
        sum: "",
      });
      this.tableList.tableData = this.tableData;
      this.showSummary.show = true;
    },
    // 产品列表输入
    inputContent(val, prop, row) {
      this.productId = row.productId;
      this.tableData.map((item) => {
        if (item.productId === row.productId) {
          item[prop] = val;
        }
      });
    },
    tabsClick() {
      // if (tab.name === "first") {
      //     this.is_public = true
      // } else {
      //     this.is_public = false
      // }
      this.$router.push({
        path: "/productManage/silkRegisterForm/addPage",
        query: {
          activeName: this.activeName,
          inspectID: this.inspectID,
          id: this.registerId,
        },
      });
      this.getDetailsData();
      this.keyword = "";
    },
    // 搜索
    onFilterSearch(searchText) {
      this.keyword = searchText || "";
      this.pagerOptions.currPage = 1;
      this.getData();
    },
    // 纤度登记表
    // 放弃
    cancelClickOne() {
      if (this.activeName == "first") {
        this.form = {
          number: "",
          finishDate: "",
          market: "",
          name: "",
          spec: "",
          workshopGroup: "",
          circleTwo: "",
          circle: "",
          totalCircle: "",
          position: "",
        };
        this.$refs.form.resetFields();
        this.productId = 1;
        this.tableList.tableData = [
          {
            productId: 1,
            position: "",
            fineness: 0,
            quantity: 0,
            sum: "",
          },
        ];
      }
    },
    // 纤度检验表
    cancelClickTwo() {},
    // 保存
    saveClickOne(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          let form = JSON.parse(JSON.stringify(this.form));
          // params.workshopGroup=Number(params.workshopGroup)
          this.isAddloading = true;
          if (this.activeName == "first") {
            delete form.circle;
            let finenessList = JSON.parse(
              JSON.stringify(this.tableList.tableData)
            );
            for (let i in finenessList) {
              delete finenessList[i].productId;
            }
            let params = {
              finenessList: finenessList,
              ...form,
            };
            // 编辑
            if (this.inspectID) {
              params.ID = this.form.ID ? this.form.ID : Number(this.inspectID);
            }
            saveRegister(params)
              .then((res) => {
                if (res.code == 200) {
                  this.isRegisterSave = true;
                  this.$message({
                    message: "保存成功！",
                    type: "success",
                  });
                  this.$router.push({
                    path: "/productManage/silkRegisterForm",
                  });
                }
                this.isAddloading = false;
              })
              .catch(() => {
                setTimeout(() => {
                  this.isAddloading = false;
                }, 3000);
              });
          } else {
            let paramsTwo = {
              ...form,
            };
            // 编辑
            if (this.registerId) {
              paramsTwo.ID = this.form.ID
                ? this.form.ID
                : Number(this.registerId);
            }
            saveCheck(paramsTwo)
              .then((res) => {
                if (res.code == 200) {
                  this.$message({
                    message: "保存成功！",
                    type: "success",
                  });
                }
                this.isAddloading = false;
              })
              .catch(() => {
                setTimeout(() => {
                  this.isAddloading = false;
                }, 3000);
              });
          }
        } else {
          console.log("error submit!!");

          return false;
        }
      });
    },
    // 放弃
    cancelClick() {},
    saveClick() {},
  },
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
::v-deep {
    .el-tabs--top .el-tabs__item.is-top:nth-child(2) {
        padding-left: 25px;
    }
  .el-tabs--top .el-tabs__item.is-top:nth-child(2) {
    padding-left: 25px;
  }

    .el-tabs__item {
        padding: 0 25px;
        height: 45px;
    }
  .el-tabs__item {
    padding: 0 25px;
    height: 45px;
  }
}

.custom-manage {
    height: 100%;
  height: 100%;
  overflow: hidden;

  .filter {
    height: 80px;
    display: flex;
    align-items: center;
    padding: 0 20px 0 20px;

    &-card {
      height: 80px;
      display: flex;
      align-items: center;
      box-sizing: border-box;
      padding: 10px 20px;
      flex: 1;
      border-radius: 12px;
      background-color: #fff;
    }
  }

  .body {
    box-sizing: border-box;
    padding: 10px 10px;
    border-radius: 12px;
    height: calc(100% - 139px - 10px - 20px);
    width: calc(100% - 20px);
    margin: 0 auto;
    margin-top: 10px;
    overflow: hidden;
    background: #fff;

    .filter {
        height: 80px;
        display: flex;
        align-items: center;
        padding: 0 20px 0 20px;
    .body-l {
      background-color: #fff;
      border-radius: 12px;
      height: calc(100% - 180px - 20px);
      width: calc(100% - 420px);
      float: left;
      overflow: hidden;
      padding: 10px 10px;

        &-card {
            height: 80px;
            display: flex;
            align-items: center;
            box-sizing: border-box;
            padding: 10px 20px;
            flex: 1;
            border-radius: 12px;
            background-color: #fff;
        }
    }

    .body {
        box-sizing: border-box;
        padding: 10px 10px;
        border-radius: 12px;
        height: calc(100% - 139px - 10px - 20px);
        width: calc(100% - 20px);
        margin: 0 auto;
        margin-top: 10px;
      .form-box {
        width: 100%;
        height: 100%;
        overflow: hidden;
        background: #fff;
      }

        .body-l {
            background-color: #fff;
            border-radius: 12px;
            height: calc(100% - 180px - 20px);
            width: calc(100% - 420px);
            float: left;
            overflow: hidden;
            padding: 10px 10px;
      .form-box {
        width: 100%;
        height: 180px;
        overflow: hidden;

            .form-box {
                width: 100%;
                height: 100%;
                overflow: hidden;
            }
        .form-item {
          width: calc(33% - 10px);
          margin-right: 15px;
          float: left;

            .form-box {
                width: 100%;
                height: 180px;
                overflow: hidden;
          &:nth-of-type(3n) {
            margin-right: 0;
          }

                .form-item {
                    width: calc(33% - 10px);
                    margin-right: 15px;
                    float: left;

                    &:nth-of-type(3n) {
                        margin-right: 0;
                    }

                    .select-width {
                        width: 100%;
                    }
                }
            }

            .list-view {
                height: calc(100% - 0px);
                min-height: 200px;
                overflow: hidden;
            }
          .select-width {
            width: 100%;
          }
        }
      }

        .body-r {
            background-color: #67a0ff;
            color: #333;
            font-size: 28px;
            height: calc(100% - 40px);
            width: 340px;
            float: right;
            padding: 20px 10px;

            p {
                font-size: 32px;
                color: #fff;
            }
        }

        .btn-pager {
            display: flex;
            margin-top: 10px;

            .page {
                margin-left: auto;
            }
        }
      .list-view {
        height: calc(100% - 0px);
        min-height: 200px;
        overflow: hidden;
      }
    }

    .body-two {
        .body-two-t {
            text-align: center;
            width: 100%;
            font-size: 16px;
            line-height: 30px;
            font-weight: bold;
            margin-bottom: 10px;
        }
    .body-r {
      background-color: #67a0ff;
      color: #333;
      font-size: 28px;
      height: calc(100% - 40px);
      width: 340px;
      float: right;
      padding: 20px 10px;

        .form-box {
            width: 100%;
            height: calc(100% - 40px);
            overflow: hidden;
        }

        .form-box-t {
            width: 100%;
            height: 60px;
            overflow: hidden;

            .form-item {
                width: calc(16% - 5px);
                margin-right: 10px;
                float: left;

                &:nth-of-type(6n) {
                    margin-right: 0;
                }
            }
        }

        .list-view {
            max-height: calc(100% - 90px - 10px);
            overflow: hidden;
        }

        .form-box-b {
            width: 100%;
            height: 60px;
            margin-top: 10px;
            overflow: hidden;

            .form-item-two {
                width: 160px;
                float: left;
            }

            .form-item {
                width: calc(10% - 5px);
                margin-right: 10px;
                float: left;

                &:nth-of-type(10n) {
                    margin-right: 0;
                }
            }
        }
      p {
        font-size: 32px;
        color: #fff;
      }
    }

    .btn-pager {
      display: flex;
      margin-top: 10px;

      .page {
        margin-left: auto;
      }
    }
  }

  .body-two {
    .body-two-t {
      text-align: center;
      width: 100%;
      font-size: 16px;
      line-height: 30px;
      font-weight: bold;
      margin-bottom: 10px;
    }

    .form-box {
      width: 100%;
      height: calc(100% - 40px);
      overflow: hidden;
    }

    .form-box-t {
      width: 100%;
      height: 60px;
      overflow: hidden;

      .form-item {
        width: calc(16% - 5px);
        margin-right: 10px;
        float: left;

        &:nth-of-type(6n) {
          margin-right: 0;
        }
      }
    }

    .list-view {
      max-height: calc(100% - 90px - 10px);
      overflow: hidden;
    }

    .form-box-b {
      width: 100%;
      height: 60px;
      margin-top: 10px;
      overflow: hidden;

      .form-item-two {
        width: 160px;
        float: left;
      }

      .form-item {
        width: calc(10% - 5px);
        margin-right: 10px;
        float: left;

        &:nth-of-type(10n) {
          margin-right: 0;
        }
      }
    }
  }
}
</style>
</style>