src/views/productManage/silkRegisterForm/addPage.vue
@@ -1,587 +1,1178 @@
<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="纤度检验表" name="second"></el-tab-pane>
            </el-tabs>
        </div>
        <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="cancelClick">放弃</el-button>
                        <el-button size="small" type="primary" @click="saveClick">保存</el-button>
                    </template>
                </CommonSearch>
            </div>
        </div>
        <div class="body" v-if="activeName == 'first'">
            <div class="body-l">
                <el-form ref="form" class="form-box" :model="form" :rules="rules" label-position="left" label-width="70px">
                    <el-form-item label="编号" prop="clientName" class="form-item">
                        <el-input v-model="form.clientName" placeholder="请输入">
                        </el-input>
                    </el-form-item>
                    <el-form-item label="落丝时间" prop="signTime" class="form-item">
                        <el-date-picker v-model="form.signTime" value-format="yyyy-MM-dd" type="date" placeholder="选择日期"
                            style="width:100%">
                        </el-date-picker>
                    </el-form-item>
                    <el-form-item label="庄口" prop="deliverType" class="form-item">
                        <el-select v-model="form.deliverType" placeholder="请选择">
                            <el-option v-for="item in deliveryTypeList" :key="item.id" :label="item.name" :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="车间" prop="deliverType" class="form-item">
                        <el-select v-model="form.deliverType" placeholder="请选择">
                            <el-option v-for="item in deliveryTypeList" :key="item.id" :label="item.name" :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="规格" prop="deliverType" class="form-item">
                        <el-select v-model="form.deliverType" placeholder="请选择">
                            <el-option v-for="item in deliveryTypeList" :key="item.id" :label="item.name" :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="组别" prop="deliverType" class="form-item">
                        <el-select v-model="form.deliverType" placeholder="请选择" style="width: 100%">
                            <el-option v-for="item in deliveryTypeList" :key="item.id" :label="item.name" :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="回数" prop="amount" class="form-item">
                        <el-row>
                            <el-col :span="11">
                                <el-input v-model.number="form.amount" placeholder="请输入" show-word-limit
                                    style="width: 100%"></el-input>
                            </el-col>
                            <el-col :span="2" style="margin:0 auto;text-align:center;">-</el-col>
                            <el-col :span="11">
                                <el-input v-model.number="form.amount" placeholder="请输入" show-word-limit
                                    style="width: 100%"></el-input>
                            </el-col>
                        </el-row>
                    </el-form-item>
                    <el-form-item label="车号" prop="clientName" class="form-item">
                        <el-input v-model="form.clientName" 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>
                </div>
            </div>
            <div class="body-r">
                纤度:
                <p>19.00</p>
            </div>
        </div>
        <div class="body-two body" v-if="activeName == 'second'">
            <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="clientName" class="form-item">
                        1234546677
                    </el-form-item>
                    <el-form-item label="车间" prop="deliverType" class="form-item">
                        <el-select v-model="form.deliverType" placeholder="请选择">
                            <el-option v-for="item in deliveryTypeList" :key="item.id" :label="item.name" :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="组别" prop="deliverType" class="form-item">
                        <el-select v-model="form.deliverType" placeholder="请选择" style="width: 100%">
                            <el-option v-for="item in deliveryTypeList" :key="item.id" :label="item.name" :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="回数" prop="amount" class="form-item">
                        <el-input v-model.number="form.amount" placeholder="请输入" show-word-limit
                            style="width: 100%"></el-input>
                    </el-form-item>
                    <el-form-item label="规格" prop="clientName" class="form-item">
                        <el-input v-model="form.clientName" placeholder="请输入">
                        </el-input>
                    </el-form-item>
                    <el-form-item label="日期" prop="signTime" class="form-item">
                        <el-date-picker v-model="form.signTime" value-format="yyyy-MM-dd" type="date" placeholder="选择日期"
                            style="width:100%">
                        </el-date-picker>
                    </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="templateName" width="100">
                        </el-table-column>
                        <el-table-column label="下差纤度" prop="name" 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="name" 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="name" 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="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="unit" 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="II度" 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="unit" label="备注" show-overflow-tooltip>
                        </el-table-column>
                    </el-table>
                </div>
                <div class="form-box-b">
                    <el-form-item label="平均纤度" prop="clientName" class="form-item-two" label-width="100px">
                        1234546677
                    </el-form-item>
                    <el-form-item label="公量纤度" prop="deliverType" class="form-item" label-width="100px">
                        <el-input v-model="form.clientName" placeholder="请输入">
                        </el-input>
                    </el-form-item>
                    <el-form-item label="偏差" prop="clientName" class="form-item-two">
                        0.98
                    </el-form-item>
                    <el-form-item label="总差" prop="clientName" class="form-item-two">
                        0.98
                    </el-form-item>
                    <el-form-item label="车组等级" prop="deliverType" class="form-item-two"  label-width="100px">
                        4A
                    </el-form-item>
                    <el-form-item label="II度" prop="amount" class="form-item">
                        <el-input v-model="form.clientName" placeholder="请输入">
                        </el-input>
                    </el-form-item>
                    <el-form-item label="清洁" prop="clientName" class="form-item">
                        <el-input v-model="form.clientName" placeholder="请输入">
                        </el-input>
                    </el-form-item>
                    <el-form-item label="洁净" prop="signTime" class="form-item">
                        <el-input v-model="form.clientName" placeholder="请输入">
                        </el-input>
                    </el-form-item>
                    <el-form-item label="庄口工艺单编号" prop="signTime" class="form-item" label-width="110px">
                        <el-input v-model="form.clientName" placeholder="请输入">
                        </el-input>
                    </el-form-item>
                    <el-form-item label="检验员" prop="signTime" class="form-item">
                        <el-input v-model="form.clientName" placeholder="请输入">
                        </el-input>
                    </el-form-item>
                </div>
            </el-form>
        </div>
  <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>
      </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" :disabled="title=='修改'?true:false" 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"
                :picker-options="pickerOptions"
                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"
                @change="getGroupNumber"
              >
                <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="workshopObj" class="form-item">
              <el-select
                v-model="form.workshopObj"
                placeholder="请选择"
                class="select-width"
                @change="getGroupNumber('workshopObj')"
              >
                <el-option
                  v-for="item in nameList"
                  :key="item.ID"
                  :label="item.name"
                  :value="{ value: item.number, label: 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="请先选择车间"
                no-data-text="请先选择车间"
                class="select-width"
                @change="getGroupNumber()"
              >
                <el-option
                  v-for="item in workshopGroupList"
                  :key="item"
                  :label="item"
                  :value="item"
                >
                </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.number="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"
              :isBorder="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="cancelClickOne"
            >放弃</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="70px"
        >
          <div class="form-box-t">
            <el-form-item label="编号:" prop="number" class="form-item">
              {{ form.number }}
            </el-form-item>
            <el-form-item label="车间:" prop="workshopName" class="form-item">
              {{ form.workshopName }}
            </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-two">
            <el-table
              ref="multipleTable"
              :data="tableTwoList.tableInfomation"
              tooltip-effect="dark"
              style="width: 100%"
              :height="'calc(100% - 0px)'"
              :header-cell-style="{ background: '#f1f3f8',color: '#000009', 'font-size': '12px', 'font-family': 'PingFangSC' }"
              border
            >
              <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="finenessGradeye" label="野纤" width="120">
              </el-table-column>
              <el-table-column
                prop="finenessGradebig"
                label="大野"
                show-overflow-tooltip
              >
              </el-table-column>
              <el-table-column
                prop="finenessGradeSpecial"
                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 { getFollowRecordList } from "@/api/productManage/silkRegisterForm.js"
import pageMixin from "@/components/makepager/pager/mixin/pageMixin"
// getWorkshopManageList
import {
  saveRegister,
  getDictList,
  getRegisterDetails,
  getCarNumber
} 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 { getWorkshopManageGroup } from "@/api/productManage/productRegisterForm.js";
export default {
    name: "silkRegisterAddPage",
    props: {},
    mixins: [pageMixin],
    components: {
    },
    computed: {},
    data() {
        return {
            tableList: {},
            loading: false,
            activeName: "first",
            searchOptions: [],
            search_map: {},
            is_public: true,
            tableColumn: [
                { label: "车号", prop: "name", min: 100, default: true }, // 客户名称
                { label: "纤度值", prop: "member_name", default: true }, // 销售负责人
                { label: "数量", prop: "client_level", default: true }, // 重要级别
                { label: "纤度合计", prop: "next_visit_time", min: 90, default: true }, // 下次回访日期
            ],
            showCol: ['车号', '纤度值', '数量', '纤度合计'],
            deliveryTypeList: [],
            form: {},
            rules: {
                clientName: [
                    { required: true, message: "请选择客户名称", trigger: "change" },
                ],
            },
            tableTwoList: {
                tableInfomation: [],
                lower: [
                    { label: "14", prop: "name", min: 100, default: true },
                    { label: "14.5", prop: "member_name", default: true },
                    { label: "15", prop: "client_level", default: true },
                    { label: "15.5", prop: "next_visit_time", min: 90, default: true },
                    { label: "16", prop: "name", min: 100, default: true },
                    { label: "16.5", prop: "member_name", default: true },
                    { label: "17", prop: "client_level", default: true },
                    { label: "17.5", prop: "next_visit_time", min: 90, default: true },
                    { label: "18", prop: "client_level", default: true },
                    { label: "18.5", prop: "next_visit_time", min: 90, default: true },
                ],
                objective: [
                    { label: "19", prop: "name", min: 100, default: true },
                    { label: "19.5", prop: "member_name", default: true },
                    { label: "20", prop: "client_level", default: true },
                    { label: "20.5", prop: "next_visit_time", min: 90, default: true },
                    { label: "21", prop: "name", min: 100, default: true },
                ],
                upper: [
                    { label: "21.5", prop: "name", min: 100, default: true },
                    { label: "22", prop: "member_name", default: true },
                    { label: "22.5", prop: "next_visit_time", min: 90, default: true },
                    { label: "23", prop: "name", min: 100, default: true },
                    { label: "23.5", prop: "member_name", default: true },
                    { label: "24", prop: "client_level", default: true },
                    { label: "24.5", prop: "next_visit_time", min: 90, default: true },
                    { label: "25", prop: "client_level", default: true },
                    { label: "25.5", prop: "next_visit_time", min: 90, default: true },
                    { label: "26", prop: "client_level", default: true },
                    { label: "26.5", prop: "next_visit_time", min: 90, default: true },
                ],
            },
        }
    },
    created() {
        let query = this.$route.query;
        if (query) {
            this.activeName = query.activeName ? query.activeName : "first";
        }
        this.setTable()
        this.search_map = {
            is_public: this.is_public
        }
        this.getData()
    },
    methods: {
        setTable() {
            this.tableList = {
                selectIndex: false,
                headerColor: 'red',
                tableInfomation: [],
                allcol: [],
                showcol: this.showCol,
                tableColumn: this.setColumnVisible(this.showCol)
            }
            this.tableList.allcol = this.tableList.tableColumn.filter(ele => !ele.default).map(ele => ele.label);
            this.searchOptions = []
            for (let i = 0; i < this.tableList.tableColumn.length; i++) {
                const label = this.tableList.tableColumn[i].label
                const value = this.tableList.tableColumn[i].prop
                this.searchOptions.push({ value: value, label: label })
            }
  name: "silkRegisterAddPage",
  props: {},
  mixins: [pageMixin],
  components: {
    CommonFormTableView,
  },
  computed: {},
  data() {
    return {
      title:'',
      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"] },
        ],
        // 庄口
        market: [
          { required: true, message: "请选择", trigger: ["change", "blur"] },
        ],
        // 车间 应该true
        workshopObj: [
          { required: true, message: "请选择", trigger: ["change", "blur"] },
        ],
        spec: [
          { required: true, message: "请填写", trigger: ["change", "blur"] },
        ],
        // 组别 应该true
        workshopGroup: [
          { required: true, 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"] },
        ],
      },
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() < new Date().getTime() - 86400000;
        },
        setColumnVisible(showCol) {
            return this.tableColumn.map(ele => {
                return {
                    ...ele,
                    isShowColumn: showCol.includes(ele.label)
                }
            })
        },
        selTableCol(val) {
            this.showcol = val;
            this.tableList.tableColumn = this.setColumnVisible(val);
        },
        // 请求数据
        async getData() {
            this.loading = true
            await getFollowRecordList({
                search_map: this.search_map,
                page: this.pagerOptions.currPage,
                pageSize: this.pagerOptions.pageSize
            })
                .then((res) => {
                    console.log(res)
                    if (res.code === 200) {
                        if (res.data.list && res.data.list.length > 0) {
                            const list = res.data.list.map((item) => {
                                let contact_name = ""
                                let contact_phone = ""
                                let contact_id = 0
                                let contact_wechat = ""
                                let contact_email = ""
                                let position = ""
                                if (item.contacts.length !== 0) {
                                    for (let i = 0; i < item.contacts.length; i++) {
                                        if (item.contacts[i].is_first) {
                                            contact_name = item.contacts[i].name
                                            contact_phone = item.contacts[i].phone
                                            contact_id = item.contacts[i].id
                                            contact_wechat = item.contacts[i].wechat
                                            contact_email = item.contacts[i].email
                                            position = item.contacts[i].position
                                        }
                                    }
                                }
                                return {
                                    ...item,
                                    contact_name: contact_name,
                                    contact_phone: contact_phone,
                                    client_level: item.client_level.name,
                                    client_status: item.client_status.name,
                                    contact_id: contact_id,
                                    member_name: item.member.username,
                                    contact_wechat: contact_wechat,
                                    contact_email: contact_email,
                                    position: position
                                }
                            })
                            this.tableList.tableInfomation = list || []
                            this.tableTwoList.tableInfomation = []
                            this.pagerOptions.totalCount = res.data.count
                        } else {
                            this.tableList.tableInfomation = []
                        }
                    } else {
                        this.tableList.tableInfomation = []
                        this.tableTwoList.tableInfomation = []
                    }
                    this.loading = false
                })
                .catch((err) => {
                    console.log(err)
                    this.tableList.tableInfomation = []
                    this.loading = false
                })
        },
        tabsClick(tab) {
            console.log(tab.name)
            if (tab.name === "first") {
                this.is_public = true
            } else {
                this.is_public = false
            }
            this.search_map = {
                is_public: this.is_public
            }
            this.pagerOptions.currPage = 1
            this.getData()
        },
        // 搜索
        onFilterSearch(searchText) {
            this.search_map = {
                is_public: this.is_public,
                name: searchText
            }
            this.pagerOptions.currPage = 1
            this.getData()
        },
        // 放弃
        cancelClick() {
        },
        saveClick() {
        },
      },
      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,
            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",
          }, // 下次回访日期
        ],
      },
      tableData: [
        {
            productId: 1,
            position: null,
            fineness: null,
            quantity: null,
            sum: null,
          }
        ],
      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.title= query.title ? query.title : "";
    }
}
    this.getSelectDataList();
    this.keyword = "";
    this.getDetailsData();
  },
  methods: {
    async getDetailsData(id) {
      if (this.activeName == "first") {
        this.form = {
          number: "",
          finishDate: "",
          market: "",
          workshopObj: "",
          spec: "",
          workshopGroup: "",
          circleTwo: "",
          circle: "",
          totalCircle: "",
          position: "",
        };
        if (this.registerId) {
         await 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.form.workshopObj={
                  value:config.workshopNumber,
                  label:config.workshopName,
                }
                this.getGroupNumber('','edit')
                let finenessList=config.finenessList
                  ? config.finenessList
                  : [];
                if(finenessList.length>0){
                  finenessList.map((item,index)=>{
                    item.productId=index+1
                  })
                }
                this.tableList.tableData = finenessList
                this.tableData = this.tableList.tableData;
              }
            }
          );
        }
      } else {
        this.form = {
          number: "",
          workshopObj: "",
          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.workshopName = config.finenessRegister.workshopName;
              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 (arr[i].finenessGrade) {
                  if (arr[i].finenessGrade.indexOf("野纤") > -1) {
                    arr[i].finenessGradeye = arr[i].finenessGrade;
                  } else if (arr[i].finenessGrade.indexOf("大野") > -1) {
                    arr[i].finenessGradebig = arr[i].finenessGrade;
                  } else if (arr[i].finenessGrade.indexOf("特野") > -1) {
                    arr[i].finenessGradeSpecial = arr[i].finenessGrade;
                  }
                }
                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 || [];
        }
      });
    },
    async getGroupNumber(val,type) {
      if (Object.keys(this.form.workshopObj).length>0) {
        if(this.form.workshopObj.value){
          await getWorkshopManageGroup({ number: this.form.workshopObj.value }).then((res) => {
            if (res.code == 200) {
              this.workshopGroupList = [];
              let workshopGroupList = res.data || {};
              this.workshopGroupList=[]
              if(val=='workshopObj'){
                this.form.workshopGroup=''
              }
              if (Object.keys(workshopGroupList).length > 0) {
                for (let i in workshopGroupList) {
                  this.workshopGroupList.push(workshopGroupList[i]);
                }
              }
            }
          })
        }
        if(this.form.workshopGroup&&this.form.market&&type!='edit'){
          await  getCarNumber({
              workshopName:this.form.workshopObj.label,
              marketName:this.form.market,
              groupNumber:this.form.workshopGroup,
            }).then((res) => {
              if (res.code == 200) {
                this.tableData=[]
                let data = res.data?JSON.parse(JSON.stringify(res.data)) : [];
               if(Object.keys(data).length>0){
                for(let i in data){
                    this.tableData.push({position:data[i],productId:Number(i)*2+1})
                    this.tableData.push({position:data[i],productId:Number(i)*2+2})
                }
               }
               this.tableList.tableData = this.tableData
              }else{
                this.tableData=[]
              }
            });
          }
      } else {
        this.workshopGroupList = [];
      }
    },
    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;
        }
        if(item.fineness&&item.quantity){
          item.sum=Number(item.fineness)*Number(item.quantity).toFixed(2)
        }
      });
      this.tableList.tableData= this.tableData
    },
    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: "",
          workshopObj: "",
          spec: "",
          workshopGroup: "",
          circleTwo: "",
          circle: "",
          totalCircle: "",
          position: "",
        };
        this.$refs.form.resetFields();
        this.productId = 1;
        this.tableList.tableData = [
          {
            productId: 1,
            position: "",
            fineness: 0,
            quantity: 0,
            sum: "",
          },
        ];
        this.tableData =this.tableList.tableData
      } else {
        this.form.measureFineness = "";
        this.form.twiceChange = "";
        this.form.cleanliness = "";
        this.form.purity = "";
        this.form.marketProcessOrderNumber = "";
        this.form.inspector = "";
      }
    },
    // 保存
    saveClickOne(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          let form = JSON.parse(JSON.stringify(this.form));
          // params.workshopGroup=Number(params.workshopGroup)
          if (this.activeName == "first") {
            delete form.circleTwo;
            let finenessList = JSON.parse(
              JSON.stringify(this.tableList.tableData)
            );
            let isContinue=false
            for (let i in finenessList) {
              if(!finenessList[i].position||!finenessList[i].fineness||!finenessList[i].quantity||!finenessList[i].sum){
                isContinue=true
                break;
              }
            }
            if(isContinue){
              this.$message.error('请填写完整再保存!')
              return true;
            }
            for (let i in finenessList) {
              delete finenessList[i].productId;
            }
            this.isAddloading = true;
            let params = {
              finenessList: finenessList,
              ...form,
            };
            // 编辑
            if (this.inspectID) {
              params.ID = this.form.ID ? this.form.ID : Number(this.inspectID);
            }
            params.workshopName=this.form.workshopObj.label;
            params.workshopNumber=this.form.workshopObj.value;
            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,
              info:form,
              items:this.tableTwoList.tableInfomation,
            };
            // 编辑
            if (this.registerId) {
              paramsTwo.ID = this.form.ID
                ? this.form.ID
                : Number(this.registerId);
            }
            this.isAddloading = true;
            saveCheck(paramsTwo)
              .then((res) => {
                if (res.code == 200) {
                  this.$message({
                    message: "保存成功!",
                    type: "success",
                  });
                  this.getDetailsData();
                }
                this.isAddloading = false;
              })
              .catch(() => {
                setTimeout(() => {
                  this.isAddloading = false;
                }, 3000);
              });
          }
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
  },
};
</script>
  <!-- Add "scoped" attribute to limit CSS to this component only -->
<!-- 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;
  }
}
::v-deep .el-table .el-table__cell {
  padding: 6px 0 !important;
  height: 35px;
  text-align: center;
}
.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% - 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);
        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;
                    }
                }
            }
            .list-view {
                height: calc(100% - 0px);
                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% - 180px);
        min-height: 200px;
        overflow-y: auto;
      }
    }
    .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-two {
      height: calc(100% - 120px);
      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>