erp_fans/src/views/EHSD/saleContract/priceSheetEHSD/index.vue

<template>
  <div class="pageIndexClass">
    <div class="content">
      <byTable :source="sourceList.data" :pagination="sourceList.pagination" :config="config" :loading="loading" :selectConfig="selectConfig"
               highlight-current-row :action-list="[
          {
            text: '新建报价单',
            action: () => newPriceSheet(),
            
          },
        ]" @get-list="getList">

        <template #code="{ item }">
          <div style="width: 100%">
            <!-- <span style="color: #409eff; cursor: pointer; word-break: break-all" @click="getDtl(item,true)">{{ item.code }}</span> -->
            <span style="color: #409eff; cursor: pointer; word-break: break-all" @click="handleOpenDetail(item)">{{ item.code }}</span>

          </div>
        </template>

        <template #status="{ item }">
          <div style="width: 100%">
            <span :style="{color: item.status ==88? 'red' :''}">{{dictValueLabel(item.status, statusData)}}</span>
          </div>
        </template>

        <template #quotationStatus="{item}">
          <div style="width: 100%">
            <span
                  :class="{ 'tag-active-1': item.quotationStatus==1, 'tag-active': item.quotationStatus==2 }">{{dictValueLabel(item.quotationStatus, quotationStatusData)}}</span>
          </div>
        </template>

        <template #amount="{ item }">
          <div style="width:100%">
            <span class="el-click" @click="getConfirmDtl(item,true)">{{ moneyFormat(item.amount, 2) }}</span>
          </div>
        </template>
        <template #product="{ item }">
          <div style="width:100%;">
            <el-popover placement="bottom-start" title="" :width="300" trigger="hover">
              <div default>
                <div v-for="(product,index) in item.quotationProductList">
                  {{index+1}}、{{product.productName}}
                  <!-- <span v-if="index<item.quotationProductList.length-1">,</span> -->
                </div>
              </div>
              <template #reference>
                <div style="overflow:hidden;white-space:nowrap;text-overflow:ellipsis;cursor:pointer">
                  <span v-for="(product,index) in item.quotationProductList">
                    {{product.productName}}
                    <span v-if="index<item.quotationProductList.length-1"> , </span>
                  </span>
                </div>
              </template>
            </el-popover>
          </div>
        </template>

        <template #btn="{item}">
          <div style="width: 100%">
            <div>
              <span v-if="item.status == 0">
                <el-button type="primary" text v-debounce @click="getDtl(item, false)" v-hasPermi="['quotation:edit']">修改</el-button>
                <el-button type="danger" text v-debounce @click="handleRepeal(item,'/saleQuotation/delete')"
                           v-hasPermi="['quotation:del']">删除</el-button>
              </span>
              <span v-if="item.status !=88">
                <!-- <el-button type="primary" text v-debounce v-if="item.status == 30 && item.quotationStatus==2"
                           @click="getDtl(item, false,true)">变更</el-button> -->
                <span v-if="item.quotationStatus==2 && !item.extQuotationId && item.confirmStatus==0">
                  <el-button type="primary" text v-debounce v-hasPermi="['quotation:price:back']" @click="handleBack(item)">退回</el-button>
                </span>
                <span v-if="item.confirmStatus==2&&item.quotationStatus==2 && !item.extQuotationId">
                  <el-button type="primary" text v-debounce v-hasPermi="['quotation:price:change']" @click="handleForeign(item)">转对外</el-button>
                </span>
                <span v-if="item.status !=0 && item.status !=88  && item.confirmStatus==0">
                  <el-button type="danger" text v-debounce v-hasPermi="['quotation:remove']"
                             @click="handleRepeal(item,'/saleQuotation/cancellation')">作废</el-button>
                </span>
              </span>
              <span v-if="item.status !=88">
                <span v-if="item.confirmStatus==0 && item.quotationStatus==2">
                  <el-button type="primary" text v-debounce v-hasPermi="['quotation:price:confirm']"
                             @click="getConfirmDtl(item, false)">价格确认</el-button>
                </span>
              </span>
            </div>
          </div>
        </template>
      </byTable>
    </div>

    <el-dialog v-if="openAddDialog" v-model="openAddDialog" title="报价单" width="90%" append-to-body>
      <byForm :formConfig="formConfig" :formOption="formOption" v-model="formData.data" :rules="rules" ref="formDom" v-loading="submitLoading">
        <template #chart>
          <div style="width:100%;padding-left:25px">
            <div ref="chartDom" style="height:300px"></div>
          </div>
        </template>
        <template #buyer>
          <div style="width: 100%">
            <el-form-item label="客户名称" prop="buyCorporationId" class="wid100">
              <el-select v-model="formData.data.buyCorporationId" filterable remote reserve-keyword placeholder="请输入关键字" remote-show-suffix
                         :remote-method="remoteMethod" :loading="loadingSearch" @input="remoteMethod" style="width: 100%" @change="changeCustomer">
                <el-option v-for="item in customerList" :key="item.value" :label="item.label" :value="item.value" />
              </el-select>
            </el-form-item>
            <!-- <el-row style="width: 100%">
              <el-col :span="12">
                <el-form-item label="地址" class="wid100 margin-b-0">
                  <el-row style="padding-right:5px;width:100%">
                    <el-col :span="6">
                      <el-form-item label="" prop="buyCountryId" class="margin-b-0 wid100" label-width="0px">
                        <el-select v-model="formData.data.buyCountryId" placeholder="国家" style="width:100%" filterable
                                   @change="(val) => getCityData(val, '20', true)">
                          <el-option v-for="item in countryData" :label="item.name" :value="item.id">
                          </el-option>
                        </el-select>
                      </el-form-item>
                    </el-col>
                    <el-col :span="6">
                      <el-form-item label="" prop="provinceName" class="margin-b-0 wid100" label-width="0px">
                        <selectCity placeholder="省/洲" @change="(val) => getCityData(val, '30', true)" addressId="buyProvinceId"
                                    addressName="provinceName" v-model="formData.data" :data="provinceData">
                        </selectCity>
                      </el-form-item>
                    </el-col>
                    <el-col :span="6">
                      <el-form-item label="" prop="cityName" class="margin-b-0 wid100" label-width="0px">
                        <selectCity placeholder="城市" addressId="buyCityId" addressName="cityName" v-model="formData.data" :data="cityData">
                        </selectCity>
                      </el-form-item>
                    </el-col>
                    <el-col :span="6">
                      <el-form-item label="" prop="buyPostalCode" class="margin-b-0" label-width="0px">
                        <el-input v-model="formData.data.buyPostalCode" placeholder="请输入邮编" />
                      </el-form-item>
                    </el-col>
                  </el-row>
                </el-form-item>
              </el-col>
              <el-col :span="12" style="padding-left:5px">
                <el-form-item label="详细地址" prop="buyAddress" class="margin-b-0 wid100">
                  <el-input v-model="formData.data.buyAddress" type="text" placeholder="请输入详细地址">
                  </el-input>
                </el-form-item>
              </el-col>
            </el-row> -->
          </div>
        </template>

        <template #commodity>
          <div style="width: 100%;padding-left:25px">
            <el-button type="warning" @click="clickPushProduct" plain style="margin-bottom: 16px" v-if="!isDetail"
                       :disabled="!formData.data.companyId">定制</el-button>
            <el-button type="primary" @click="openProductCompany = true" plain style="margin-bottom: 16px" v-if="!isDetail"
                       :disabled="!formData.data.companyId">选择产品库</el-button>
            <!-- <el-table :data="formData.data.quotationProductList" style="width: 100%;" default-expand-all>
              <el-table-column type="expand" width="50" align="center">
                <template #default="scope">
                  <div style="padding-left:50px">
                    <div style="margin-bottom:10px; ">
                      <TitleInfo content='BOM单:'></TitleInfo>
                    </div>
                    <el-table :data="scope.row.quotationProductBomList" style="width: 100%;" border class="bom-table">
                      <el-table-column label="图片" width="80">
                        <template #default="{ row }">
                          <div v-if="row.fileUrl">
                            <img :src="row.fileUrl" class="pic" @click="onPicture(row.fileUrl)" />
                          </div>
                          <div v-else></div>
                        </template>
                      </el-table-column>
                      <el-table-column prop="productCode" label="物料编码" width="190" />
                      <el-table-column prop="productName" label="物料名称" min-width="200" />
                      <el-table-column label="尺寸 (cm)" width="150">
                        <template #default="{ row, $index }">
                          <div style="width: 100%">
                            {{row.productLength}} * {{row.productWidth}} * {{row.productHeight}}
                          </div>
                        </template>
                      </el-table-column>
                      <el-table-column label="备注" width="180">
                        <template #default="{ row, $index }">
                          <div style="width: 100%">
                            <el-form-item :prop="'quotationProductList.' + scope.$index + '.quotationProductBomList.' + $index + '.remark'"
                                          :rules="rules.remark" :inline-message="true" class="margin-b-0 wid100">
                              <el-input v-model="row.remark" placeholder="请输入" style="width: 100%" :min="0" />
                            </el-form-item>
                          </div>
                        </template>
                      </el-table-column>
                      <el-table-column label="操作" width="60" align="center" fixed="right" v-if="!isDetail">
                        <template #default="{ row,$index }">
                          <el-button type="primary" link @click="handleDeleteMaterial(scope.$index,$index)" v-if="row.type==2">删除</el-button>
                        </template>
                      </el-table-column>
                    </el-table>
                  </div>

                </template>
              </el-table-column>
              <el-table-column label="图片" width="80">
                <template #default="{ row }">
                  <div v-if="row.fileUrl">
                    <img :src="row.fileUrl" class="pic" @click="onPicture(row.fileUrl)" />
                  </div>
                  <div v-else></div>
                </template>
              </el-table-column>
              <el-table-column prop="productCode" label="商品编码" width="190" />
              <el-table-column prop="productName" label="商品名称" min-width="200" />
              <el-table-column label="尺寸 (cm)" width="150">
                <template #default="{ row, $index }">
                  <div style="width: 100%">
                    {{row.productLength}} * {{row.productWidth}} * {{row.productHeight}}
                  </div>
                </template>
              </el-table-column>
              <el-table-column prop="productColor" label="颜色" width="100" />
              <el-table-column label="数量" width="110">
                <template #default="{ row, $index }">
                  <div style="width: 100%">
                    <el-form-item :prop="'quotationProductList.' + $index + '.quantity'" :rules="rules.quantity" :inline-message="true"
                                  class="margin-b-0 wid100">
                      <el-input-number onmousewheel="return false;" v-model="row.quantity" placeholder="请输入" style="width: 100%" :precision="0"
                                       :controls="false" :min="1" @change="changeQuantity()" />

                    </el-form-item>
                  </div>
                </template>
              </el-table-column>
              <el-table-column label="单价" width="110">
                <template #default="{ row, $index }">
                  <div style="width: 100%">
                    <span v-if="row.price">￥ {{row.price}}</span>
                    <span v-else>待报价</span>
                  </div>
                </template>
              </el-table-column>
              <el-table-column prop="amount" label="小计" width="110">
                <template #default="{ row, $index }">
                  <div style="width: 100%">
                    <span v-if="row.amount">￥ {{row.amount}}</span>
                    <span v-else>一</span>
                  </div>
                </template>
              </el-table-column>
              <el-table-column label="操作" width="140" align="center" fixed="right" v-if="!isDetail">
                <template #default="{ $index }">
                  <el-button type="primary" link @click="handleClickSelectMaterial($index)">包材/配件/辅材</el-button>
                  <el-button type="primary" link @click="handleRemove($index)">删除</el-button>
                </template>
              </el-table-column>
            </el-table> -->

            <el-collapse v-model="activeNames">
              <el-collapse-item :name="index" v-for="(product,index) in formData.data.quotationProductList" :key="index">
                <template #title>
                  <!-- <TitleInfo :content="'主材'"></TitleInfo> -->
                  <div style="font-size:14px;font-weight:700;padding-left:25px;width:300px">
                    产品编码：{{product.productCode || '定制产品'}}
                  </div>
                  <el-form-item label="数量" class="margin-b-0" style="width:300px !important;" :prop="'quotationProductList.' +index + '.quantity'"
                                :rules="rules.quantity" :inline-message="true" @click.stop>
                    <el-input-number v-model="product.quantity" placeholder="请输入" style="width: 100%" :precision="0" :controls="false" :min="1"
                                     onmousewheel="return false;" />
                  </el-form-item>
                  <el-button text type="primary" style="margin-left:10px" @click="handleRemove(index)">删除</el-button>
                </template>
                <div style="width:100%">
                  <div style="margin:10px 0">
                    <TitleInfo :content="'主材'"></TitleInfo>
                  </div>
                  <div style="width: 100%;padding-left:15px">
                    <el-row>
                      <el-col :span="12">
                        <el-form-item :prop="'quotationProductList.' +index + '.rawMaterialId'" :rules="rules.rawMaterialId" :inline-message="true"
                                      label="原材料" class="wid100">
                          <el-select v-model="product.rawMaterialId" placeholder="请选择" style="width:100%">
                            <el-option v-for="item in rawMaterialData" :key="item.value" :label="item.label" :value="item.value" />
                          </el-select>
                        </el-form-item>
                      </el-col>
                      <el-col :span="12">
                        <el-form-item label="颜色" class="margin-b-0 wid100">
                          <el-row style="width: 100%">
                            <el-col :span="12">
                              <el-form-item prop="productColor" label-width="0px" class="margin-b-0 wid100">
                                <el-input v-model="product.productColor" placeholder="颜色" />
                              </el-form-item>
                            </el-col>
                            <el-col :span="12">
                              <el-form-item prop="colorCardCode" label-width="0px" class="margin-b-0 wid100">
                                <el-input v-model="product.colorCardCode" placeholder="色卡号" />
                              </el-form-item>
                            </el-col>
                          </el-row>
                        </el-form-item>
                      </el-col>
                    </el-row>
                    <el-row>
                      <el-col :span="12">
                        <el-form-item label="尺寸" class="margin-b-0 wid100" required>
                          <el-row style="width:100%">
                            <el-col :span="8">
                              <el-form-item :prop="'quotationProductList.' +index + '.productLength'" :rules="rules.productLength"
                                            :inline-message="true" label-width="0px" class="margin-b-0 wid100">
                                <el-input-number v-model="product.productLength" placeholder="长 （cm）" style="width: 100%" :precision="2"
                                                 :controls="false" :min="0" onmousewheel="return false;" />
                              </el-form-item>
                            </el-col>
                            <el-col :span="8">
                              <el-form-item :prop="'quotationProductList.' +index + '.productWidth'" :rules="rules.productWidth"
                                            :inline-message="true" label-width="0px" class="margin-b-0 wid100">
                                <el-input-number v-model="product.productWidth" placeholder="宽 （cm）" style="width: 100%" :precision="2"
                                                 :controls="false" :min="0" onmousewheel="return false;" />
                              </el-form-item>
                            </el-col>
                            <el-col :span="8">
                              <el-form-item :prop="'quotationProductList.' +index + '.productHeight'" :rules="rules.productHeight"
                                            :inline-message="true" label-width="0px" class="margin-b-0 wid100">
                                <el-input-number v-model="product.productHeight" placeholder="高 （cm）" style="width: 100%" :precision="2"
                                                 :controls="false" :min="0" onmousewheel="return false;" />
                              </el-form-item>
                            </el-col>
                          </el-row>
                        </el-form-item>
                      </el-col>
                      <el-col :span="12">
                        <el-form-item label="净重（kg）" prop="netWeight" class="margin-b-0 wid100">
                          <el-input-number v-model="product.netWeight" placeholder="请输入" style="width: 100%" :precision="2" :controls="false" :min="0"
                                           onmousewheel="return false;" />
                        </el-form-item>
                      </el-col>

                    </el-row>
                  </div>

                  <div style="margin:10px 0">
                    <TitleInfo :content="'辅材'"></TitleInfo>
                  </div>
                  <div style="width: 100%;padding-left:15px">
                    <el-button type="primary" @click="handleClickSelectMaterial(index)" plain>选择包材/配件/辅材</el-button>
                    <el-table :data="product.quotationProductBomList" style="width: 100%; margin-top: 16px">
                      <el-table-column prop="materialName" label="物料名称" min-width="130" />
                      <el-table-column prop="materialCode" label="物料编码" width="150" />
                      <el-table-column label="数量" width="150">
                        <template #default="{ row, $index }">
                          <div style="width: 100%">
                            <el-form-item :prop="'quotationProductList.' + index + '.quotationProductBomList.' + $index + '.quantity'"
                                          :rules="rules.quantity" :inline-message="true" class="margin-b-0 wid100">
                              <el-input-number onmousewheel="return false;" v-model="row.quantity" placeholder="请输入" style="width: 100%"
                                               :precision="0" :controls="false" :min="1" />
                            </el-form-item>
                          </div>
                        </template>
                      </el-table-column>
                      <el-table-column label="操作" width="60" align="center" fixed="right">
                        <template #default="{ $index }">
                          <el-button type="primary" link @click="handleRemoveBom(index,$index)">删除</el-button>
                        </template>
                      </el-table-column>
                    </el-table>
                  </div>

                  <div style="margin:10px 0">
                    <TitleInfo :content="'附加工艺要求'"></TitleInfo>
                  </div>

                  <div style="width:100%;padding-left:15px">
                    <div class="small-title">
                      ① 工艺线路
                    </div>
                    <el-row style="width:100%">
                      <el-col :span="12">
                        <el-form-item label="工艺产线" class="wid100" :prop="'quotationProductList.' + index + '.technologyId'"
                                      :rules="rules.technologyId" :inline-message="true">
                          <el-select v-model="product.technologyId" placeholder="请选择" style="width:100%">
                            <el-option v-for="item in technologyData" :key="item.id" :label="item.name" :value="item.id" />
                          </el-select>
                        </el-form-item>
                      </el-col>
                    </el-row>
                    <div class="small-title">
                      ② LOGO
                    </div>
                    <el-row style="width:100%">
                      <el-col :span="12">
                        <el-form-item label="LOGO尺寸" class="wid100">
                          <el-row>
                            <el-col :span="8">
                              <el-form-item label-width="0px" class="margin-b-0 wid100" :prop="'quotationProductList.' +index + '.logoLength'"
                                            :rules="rules.logoLength" :inline-message="true">
                                <el-input-number v-model="product.logoLength" placeholder="长 （cm）" style="width: 100%" :precision="2"
                                                 :controls="false" :min="0" onmousewheel="return false;" />
                              </el-form-item>
                            </el-col>
                            <el-col :span="8">
                              <el-form-item label-width="0px" class="margin-b-0 wid100" :prop="'quotationProductList.' +index + '.logoWidth'"
                                            :rules="rules.logoWidth" :inline-message="true">
                                <el-input-number v-model="product.logoWidth" placeholder="宽 （cm）" style="width: 100%" :precision="2" :controls="false"
                                                 :min="0" onmousewheel="return false;" />
                              </el-form-item>
                            </el-col>
                            <el-col :span="8">
                              <el-form-item label-width="0px" class="margin-b-0 wid100" :prop="'quotationProductList.' +index + '.logoHeight'"
                                            :rules="rules.logoHeight" :inline-message="true">
                                <el-input-number v-model="product.logoHeight" placeholder="高 （cm）" style="width: 100%" :precision="2"
                                                 :controls="false" :min="0" onmousewheel="return false;" />
                              </el-form-item>
                            </el-col>
                          </el-row>
                        </el-form-item>
                      </el-col>
                      <el-col :span="12">
                        <el-form-item label="几色印刷" class="wid100">
                          <el-input-number v-model="product.colorCount" placeholder="请输入" style="width: 100%" :precision="0" :controls="false"
                                           :min="1" onmousewheel="return false;" />
                        </el-form-item>
                      </el-col>
                    </el-row>
                    <div class="small-title">
                      ③ 折叠
                    </div>
                    <el-row style="width:100%">
                      <el-col :span="12">
                        <el-form-item label="是否折叠" class="wid100">
                          <el-select v-model="product.isFold" placeholder="请选择" style="width:100%">
                            <el-option :label="'否'" :value="0" />
                            <el-option :label="'是'" :value="1" />
                          </el-select>
                        </el-form-item>
                      </el-col>
                      <el-col :span="12">
                        <el-form-item label="折叠数" class="wid100" :prop="'quotationProductList.' +index + '.foldWay'" v-if="product.isFold==1"
                                      :rules="product.isFold==1?rules.foldWay:''">
                          <el-select v-model="product.foldWay" placeholder="请选择" style="width:100%">
                            <el-option v-for="item in foldWayData" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey" />
                          </el-select>
                        </el-form-item>
                      </el-col>
                    </el-row>
                    <div class="small-title">
                      ④ 包装要求
                    </div>
                    <el-row style="width:100%">
                      <el-col :span="12">
                        <el-form-item label="包装要求" class="wid100">
                          <el-select v-model="product.packAsk" placeholder="请选择" style="width:100%" multiple>
                            <el-option v-for="item in packAskData" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey" />
                          </el-select>
                        </el-form-item>
                      </el-col>
                    </el-row>
                    <div class="small-title">
                      ⑤ 是否定制
                    </div>
                    <el-row style="width:100%">
                      <el-col :span="12">
                        <el-form-item prop="isCustomized" label="是否定制" class="wid100">
                          <el-select v-model="product.isCustomized" placeholder="请选择" style="width:100%">
                            <el-option :label="'否'" :value="0" />
                            <el-option :label="'是'" :value="1" />
                          </el-select>
                        </el-form-item>
                      </el-col>
                    </el-row>
                    <el-row style="width:100%">
                      <el-form-item label="定制内容" class="wid100" v-if="product.isCustomized==1">
                        <table style="width:100%" border class="table">
                          <tr>
                            <td style="width:20%">
                            </td>
                            <td style="width:40%">附件</td>
                            <td style="width:40%">备注</td>
                          </tr>
                          <tr v-for="(row,sonIndex) in product.quotationProductCustomInfoList" :key="sonIndex">
                            <td>
                              <el-checkbox v-model="row.isCheckBox" label="" /> <span style="position:relative;top:-2px">
                                {{getLabelOne(row.type)}}</span>
                            </td>
                            <td>
                              <el-upload :file-list="row.fileList" :action="uploadUrl" :data="uploadData" :limit="1" :list-type="'text'"
                                         :before-upload="(file)=>handleBeforeUploadOne(file,index,sonIndex)"
                                         :on-success="()=>handleSuccessOne(index,sonIndex)" :on-remove="(file)=>handleRemoveFile(file,index,sonIndex)"
                                         :on-preview="onPreviewFile" :on-exceed="()=>msgTip(`上传文件数量不可大于1`, 2)">
                                <el-button text type="primary">上传附件</el-button>
                              </el-upload>
                            </td>
                            <td>
                              <el-form-item :prop="'quotationProductList.' + index + '.quotationProductCustomInfoList.' + sonIndex + '.remark'"
                                            :rules="row.isCheckBox?rules.remark:''" :inline-message="true" class="margin-b-0 wid100">
                                <el-input v-model="row.remark" placeholder="请输入备注" />
                              </el-form-item>
                            </td>
                          </tr>
                        </table>
                      </el-form-item>
                    </el-row>
                  </div>
                </div>
              </el-collapse-item>

            </el-collapse>
          </div>
        </template>
      </byForm>
      <template #footer v-if="!isDetail">
        <el-button @click="openAddDialog = false" size="default" v-debounce>关 闭</el-button>
        <el-button type="primary" @click="handleSubmit(0)" size="default" v-debounce v-if="!isChange">暂 存</el-button>
        <el-button type="primary" @click="handleSubmit(30)" size="default" v-debounce>提 交</el-button>
      </template>
    </el-dialog>

    <el-dialog v-if="foreignDialog" v-model="foreignDialog" title="转对外报价单" width="90%" append-to-body>
      <byForm :formConfig="formConfigOne" :formOption="formOptionOne" v-model="formData.data" :rules="rulesOne" ref="formDomOne"
              v-loading="submitLoading">
        <template #commodity>
          <div style="width: 100%;padding-left:25px">
            <el-table :data="formData.data.quotationProductList" style="width: 100%;" row-key="productId">
              <el-table-column type="expand" width="50" align="center">
                <template #default="scope">
                  <div style="padding-left:50px">
                    <div style="margin-bottom:10px; ">
                      <TitleInfo content='BOM单:'></TitleInfo>
                    </div>
                    <el-table :data="scope.row.quotationProductBomList" style="width: 100%;" border class="bom-table">
                      <el-table-column label="图片" width="80">
                        <template #default="{ row }">
                          <div v-if="row.fileUrl">
                            <img :src="row.fileUrl" class="pic" @click="onPicture(row.fileUrl)" />
                          </div>
                          <div v-else></div>
                        </template>
                      </el-table-column>
                      <el-table-column prop="productCode" label="物料编码" width="190" />
                      <el-table-column prop="productName" label="物料名称" min-width="200" />
                      <el-table-column label="尺寸 (cm)" width="150">
                        <template #default="{ row, $index }">
                          <div style="width: 100%">
                            {{row.productLength}} * {{row.productWidth}} * {{row.productHeight}}
                          </div>
                        </template>
                      </el-table-column>
                      <!-- <el-table-column label="数量" width="80" prop="quantity">
                      </el-table-column>
                      <el-table-column label="总数量" width="80" prop="allQuantity">
                      </el-table-column>
                      <el-table-column label="原本单价" width="110" prop="priceCopy">
                        <template #default="{ row, $index }">
                          <div style="width: 100%">
                            ￥ {{row.priceCopy}}
                          </div>
                        </template>
                      </el-table-column>
                      <el-table-column label="利润点数" width="110">
                        <template #default="{ row, $index }">
                          <div style="width: 100%">
                            <el-form-item :prop="'quotationProductList.' + scope.$index + '.quotationProductBomList.' + $index + '.coefficient'"
                                          :rules="rules.coefficient" :inline-message="true" class="margin-b-0 wid100">
                              <el-input-number onmousewheel="return false;" v-model="row.coefficient" placeholder="请输入" style="width: 100%"
                                               :precision="2" :controls="false" :min="0" @change="totalAmount()" />
                            </el-form-item>
                          </div>
                        </template>
                      </el-table-column>
                      <el-table-column label="单价" width="110" prop="price">
                        <template #default="{ row, $index }">
                          <div style="width: 100%">
                            ￥ {{row.price}}
                          </div>
                        </template>
                      </el-table-column>
                      <el-table-column prop="amount" label="小计" width="110">
                        <template #default="{ row, $index }">
                          <div style="width: 100%">
                            ￥ {{row.amount}}
                          </div>
                        </template>
                      </el-table-column> -->
                      <el-table-column label="备注" width="180" prop="remark">
                      </el-table-column>
                    </el-table>
                  </div>

                </template>
              </el-table-column>
              <el-table-column label="图片" width="80">
                <template #default="{ row }">
                  <div v-if="row.fileUrl">
                    <img :src="row.fileUrl" class="pic" @click="onPicture(row.fileUrl)" />
                  </div>
                  <div v-else></div>
                </template>
              </el-table-column>
              <el-table-column prop="productCode" label="商品编码" width="190" />
              <el-table-column prop="productName" label="商品名称" min-width="200" />
              <el-table-column label="尺寸 (cm)" width="150">
                <template #default="{ row, $index }">
                  <div style="width: 100%">
                    {{row.productLength}} * {{row.productWidth}} * {{row.productHeight}}
                  </div>
                </template>
              </el-table-column>
              <el-table-column prop="productColor" label="颜色" width="100" />
              <el-table-column label="数量" width="110" prop="quantity">
              </el-table-column>
              <el-table-column label="指导价" width="100" prop="guidePrice">
                <template #default="{ row, $index }">
                  <div style="width: 100%">
                    <span class="tag-active">{{row.guidePrice}}</span>
                  </div>
                </template>
              </el-table-column>
              <el-table-column label="最低价" width="100" prop="minPrice">
                <template #default="{ row, $index }">
                  <div style="width: 100%">
                    <span style="color:red">{{row.minPrice}}</span>
                  </div>
                </template>
              </el-table-column>
              <el-table-column label="最高价" width="100" prop="maxPrice">
                <template #default="{ row, $index }">
                  <div style="width: 100%">
                    <span style="color:red">{{row.maxPrice}}</span>
                  </div>
                </template>
              </el-table-column>
              <el-table-column label="单价" width="110" prop="price">
                <template #default="{ row, $index }">
                  <el-form-item :prop="'quotationProductList.' + $index + '.price'" :rules="rulesOne.price" :inline-message="true"
                                class="margin-b-0 wid100">
                    <el-input-number onmousewheel="return false;" v-model="row.price" placeholder="请输入" style="width: 100%" :precision="2"
                                     :controls="false" :min="row.minPrice" @change="changeForeignQuantity()" :max="row.maxPrice" />

                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column prop="amount" label="小计" width="110">
                <template #default="{ row, $index }">
                  <div style="width: 100%">
                    ￥ {{row.amount}}
                  </div>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </template>
      </byForm>
      <template #footer>
        <el-button @click="foreignDialog = false" size="default" v-debounce>关 闭</el-button>
        <el-button type="primary" @click="handleSubmitOne()" size="default" v-debounce>提 交</el-button>
      </template>
    </el-dialog>

    <el-dialog v-if="confirmDialog" v-model="confirmDialog" title="价格确认" width="90%" append-to-body>
      <byForm :formConfig="formConfigTwo" :formOption="formOptionTwo" v-model="formData.dataTwo" :rules="rulesTwo" ref="formDomTwo"
              v-loading="submitLoading">
        <template #commodity>
          <div style="width: 100%;padding-left:25px">
            <el-table :data="formData.dataTwo.quotationProductList" style="width: 100%;" row-key="id">
              <el-table-column type="expand" width="50" align="center">
                <template #default="scope">
                  <div style="padding-left:50px">
                    <div style="margin-bottom:10px;">
                      <TitleInfo content='BOM单:'></TitleInfo>
                    </div>
                    <el-table :data="scope.row.quotationProductBomList" style="width: 100%;" border class="bom-table">
                      <el-table-column label="图片" width="80">
                        <template #default="{ row }">
                          <div v-if="row.fileUrl">
                            <img :src="row.fileUrl" class="pic" @click="onPicture(row.fileUrl)" />
                          </div>
                          <div v-else></div>
                        </template>
                      </el-table-column>
                      <el-table-column prop="productCode" label="物料编码" width="190" />
                      <el-table-column prop="productName" label="物料名称" min-width="200" />
                      <el-table-column label="尺寸 (cm)" width="150">
                        <template #default="{ row, $index }">
                          <div style="width: 100%">
                            {{row.productLength}} * {{row.productWidth}} * {{row.productHeight}}
                          </div>
                        </template>
                      </el-table-column>
                      <el-table-column label="备注" width="180" prop="remark">
                      </el-table-column>
                    </el-table>
                  </div>
                </template>
              </el-table-column>
              <el-table-column label="图片" width="70" align="center">
                <template #default="{ row }">
                  <div v-if="row.fileUrl">
                    <img :src="row.fileUrl" class="pic" @click="onPicture(row.fileUrl)" />
                  </div>
                  <div v-else></div>
                </template>
              </el-table-column>
              <el-table-column prop="productCode" label="商品编码" width="190" />
              <el-table-column prop="productName" label="商品名称" min-width="200" />
              <el-table-column label="尺寸 (cm)" width="120">
                <template #default="{ row, $index }">
                  <div style="width: 100%">
                    {{row.productLength}} * {{row.productWidth}} * {{row.productHeight}}
                  </div>
                </template>
              </el-table-column>
              <el-table-column prop="productColor" label="颜色" width="100" />
              <el-table-column label="数量" width="80" prop="quantity">
              </el-table-column>
              <el-table-column label="工厂单价" width="100" prop="prodPrice">
              </el-table-column>
              <el-table-column label="指导价" width="120" prop="price">
                <template #default="{ row, $index }">
                  <div style="width: 100%">
                    <el-form-item :prop="'quotationProductList.' + $index + '.price'" :rules="rulesTwo.price" :inline-message="true"
                                  class="margin-b-0 wid100">
                      <el-input-number onmousewheel="return false;" v-model="row.price" placeholder="请输入" style="width: 100%" :precision="2"
                                       :controls="false" :min="0" @change="changeQuantityOne" />
                    </el-form-item>
                  </div>
                </template>
              </el-table-column>
              <el-table-column label="业务员最低报价" width="125" prop="minPrice">
                <template #default="{ row, $index }">
                  <div style="width: 100%">
                    <el-form-item :prop="'quotationProductList.' + $index + '.minPrice'" :rules="rulesTwo.minPrice" :inline-message="true"
                                  class="margin-b-0 wid100">
                      <el-input-number onmousewheel="return false;" v-model="row.minPrice" placeholder="请输入" style="width: 100%" :precision="2"
                                       :controls="false" :min="row.price" @change="changeMinPrice" />
                    </el-form-item>
                  </div>
                </template>
              </el-table-column>
              <el-table-column label="上调比列(%)" width="110" prop="amplifyRatio">
                <template #default="{ row, $index }">
                  <div style="width: 100%">
                    <el-form-item :prop="'quotationProductList.' + $index + '.amplifyRatio'" :rules="rulesTwo.amplifyRatio" :inline-message="true"
                                  class="margin-b-0 wid100">
                      <el-input-number onmousewheel="return false;" v-model="row.amplifyRatio" placeholder="请输入" style="width: 100%" :precision="2"
                                       :controls="false" :min="1" :max="100" @change="changeMinPrice" />
                    </el-form-item>
                  </div>
                </template>
              </el-table-column>
              <el-table-column label="业务员最高报价" width="125" prop="maxPrice">
              </el-table-column>
              <el-table-column prop="amount" label="小计" width="110">
                <template #default="{ row, $index }">
                  <div style="width: 100%">
                    ￥ {{row.amount}}
                  </div>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </template>
      </byForm>
      <template #footer v-if="!isDetailData">
        <el-button @click="confirmDialog = false" size="default" v-debounce>关 闭</el-button>
        <el-button type="primary" size="default" v-debounce @click="confirmSubmit()">提 交</el-button>
      </template>
    </el-dialog>

    <el-dialog v-if="openProductCompany" v-model="openProductCompany" title="产品库" width="90%" append-to-body>
      <SelectProduct @selectProduct="selectProduct" :companyId="companyId" :isRawMaterial="'1'" :disablePerm="'1'"></SelectProduct>
      <template #footer>
        <el-button @click="openProductCompany = false" size="defualt" v-debounce>关 闭</el-button>
      </template>
    </el-dialog>

    <el-dialog :title="'物料选择'" v-model="openSelectMaterial" width="90%" destroy-on-close>
      <SelectMaterial :isNeRawMaterial="'1'" @selectMaterial="selectMaterial"></SelectMaterial>
      <template #footer>
        <el-button @click="openSelectMaterial = false" size="defualt" v-debounce>关 闭</el-button>
      </template>
    </el-dialog>

    <el-dialog v-if="detailDialog" v-model="detailDialog" title="报价详情" width="90%" append-to-body>
      <PriceSheetDetailList :rowData="detailRowData" dataType="1" @changeLeftData="changeLeftData"></PriceSheetDetailList>
      <template #footer>
        <el-button @click="detailDialog = false" size="defualt" v-debounce>关 闭</el-button>
        <!-- <el-button type="primary" v-debounce
                   v-if="leftRowData.quotationStatus==2 && !leftRowData.extQuotationId &&leftRowData.status !=88 &&leftRowData.status !=70"
                   @click="handleBack(leftRowData)">退回</el-button>
        <el-button type="primary" v-debounce
                   v-if="leftRowData.status == 30 && leftRowData.quotationStatus==2 && leftRowData.status !=88 &&leftRowData.status !=70"
                   @click="getDtl(leftRowData, false,true)">变更</el-button>
        <el-button type="primary" v-debounce
                   v-if="leftRowData.quotationStatus==2 && !leftRowData.extQuotationId &&leftRowData.status !=88 &&leftRowData.status !=70"
                   @click="handleForeign(leftRowData)">转对外</el-button>
        <el-button type="danger" v-debounce v-if="leftRowData.status !=0 && leftRowData.status !=88 &&leftRowData.status !=70"
                   @click="handleRepeal(leftRowData,'/saleQuotation/cancellation')">作废</el-button> -->
      </template>
    </el-dialog>

    <el-dialog v-if="backDialog" v-model="backDialog" title="退回" width="50%" append-to-body>
      <byForm :formConfig="backFormConfig" :formOption="backFormOption" v-model="formData.backData" :rules="backRules" ref="backFormDom"
              v-loading="submitLoading">

      </byForm>
      <template #footer>
        <el-button @click="backDialog = false" size="default" v-debounce>关 闭</el-button>
        <el-button type="primary" @click="handleSubmitBack()" size="default" v-debounce>提 交</el-button>
      </template>
    </el-dialog>
  </div>
</template>

<script setup>
import byTable from "@/components/byTable/index";
import moment from "moment";
import byForm from "@/components/byForm/index";
import selectCity from "@/components/selectCity/index.vue";
import SelectProduct from "@/components/product/SelectProduct.vue";
import SelectMaterial from "@/components/product/SelectMaterial.vue";
import * as echarts from "echarts";
import PriceSheetDetailList from "@/views/EHSD/saleContract/PriceSheetDetailList";

const { proxy } = getCurrentInstance();
const uploadData = ref({});
const packAskData = computed(() => proxy.useUserStore().allDict["pack_ask"]);
const foldWayData = computed(() => proxy.useUserStore().allDict["fold_way"]);
const companyId = ref("");
const accountList = ref([]);
const corporationList = ref([]);
const tradeMethods = ref([]);
const accountCurrency = ref([]);
const companyData = ref([]);
const statusData = ref([
  {
    label: "草稿",
    value: 0,
  },
  {
    label: "正常",
    value: 30,
  },
  {
    label: "作废",
    value: 88,
  },
]);
const quotationStatusData = ref([
  {
    label: "未报价",
    value: 0,
  },
  {
    label: "报价中",
    value: 1,
  },
  {
    label: "已报价",
    value: 2,
  },
]);
const typeData = ref([
  {
    label: "内销订单",
    value: 1,
  },
  {
    label: "外贸",
    value: 2,
  },
]);
const sourceList = ref({
  data: [],
  pagination: {
    total: 0,
    pageNum: 1,
    pageSize: 10,
    keyword: "",
    status: "",
    type: "",
    quotationStatus: "",
    companyId: "",
    quotationTimeSta: "",
    quotationTimeEnd: "",
    beginTime: "",
    endTime: "",
  },
});
const loading = ref(false);
const selectConfig = computed(() => {
  return [
    {
      label: "业务公司",
      prop: "ofCompanyId",
      data: proxy.useUserStore().allDict["list_company_data"],
    },
    {
      label: "报价单状态",
      prop: "status",
      data: statusData.value,
    },
    {
      label: "报价单类型",
      prop: "type",
      data: typeData.value,
    },
    {
      label: "工厂报价状态",
      prop: "quotationStatus",
      data: quotationStatusData.value,
    },
    {
      label: "报价工厂",
      prop: "companyId",
      data: companyData.value,
    },
    {
      type: "time",
      label: "报价时间",
      placeholder: "开始日期",
      prop: "quotationTimeSta",
      placeholderOne: "结束日期",
      propOne: "quotationTimeEnd",
    },
    // {
    //   type: "time",
    //   label: "创建时间",
    //   placeholder: "开始日期",
    //   prop: "beginTime",
    //   placeholderOne: "结束日期",
    //   propOne: "endTime",
    // },
  ];
});

const config = computed(() => {
  return [
    {
      attrs: {
        label: "业务公司",
        prop: "ofCompanyName",
        width: 110,
      },
    },
    {
      attrs: {
        label: "报价单号",
        slot: "code",
        width: 180,
      },
    },
    {
      attrs: {
        label: "报价单状态",
        slot: "status",
        width: 100,
      },
    },
    {
      attrs: {
        label: "报价单类型",
        prop: "type",
        width: 100,
      },
      render(val) {
        return proxy.dictValueLabel(val, typeData.value);
      },
    },
    {
      attrs: {
        label: "报价工厂",
        prop: "companyName",
        width: 100,
      },
    },
    {
      attrs: {
        label: "客户名称",
        prop: "buyCorporationName",
        "min-width": 170,
      },
    },
    {
      attrs: {
        label: "工厂报价状态",
        slot: "quotationStatus",
        width: 130,
      },
    },
    {
      attrs: {
        label: "报价金额",
        slot: "amount",
        width: 120,
      },
    },
    {
      attrs: {
        label: "报价时间",
        prop: "quotationTime",
        width: 160,
      },
    },
    {
      attrs: {
        label: "报价单产品",
        slot: "product",
        "min-width": 180,
      },
    },
    {
      attrs: {
        label: "创建时间",
        prop: "createTime",
        width: 160,
      },
    },
    {
      attrs: {
        label: "创建人",
        prop: "userName",
        width: 80,
      },
    },
    {
      attrs: {
        label: "操作",
        width: 220,
        slot: "btn",
        align: "right",
        fixed: "right",
      },
    },
  ];
});

const getDict = () => {
  proxy
    .post("/customer/selPage", {
      pageNum: 1,
      pageSize: 50,
    })
    .then((res) => {
      customerList.value = res.rows.map((x) => ({
        ...x,
        label: x.name,
        value: x.id,
      }));
    });

  proxy
    .get("/tenantDept/list", {
      pageNum: 1,
      pageSize: 9999,
      keyword: "",
      tenantId: proxy.useUserStore().user.tenantId,
      type: 0,
    })
    .then((res) => {
      companyData.value = res.data.map((x) => ({
        ...x,
        label: x.deptName,
        value: x.deptId,
      }));
      treeData.value = proxy.handleTree(res.data, "deptId");
    });
};
const getList = async (req) => {
  sourceList.value.pagination = { ...sourceList.value.pagination, ...req };
  loading.value = true;
  proxy.post("/saleQuotation/page", sourceList.value.pagination).then((res) => {
    sourceList.value.data = res.rows;
    sourceList.value.pagination.total = res.total;
    setTimeout(() => {
      loading.value = false;
    }, 200);
  });
};
getDict();
getList();
const rawMaterialData = ref([]);
const technologyData = ref([]);
const getRawMaterialData = () => {
  proxy.post("/productInfo/page", { productClassifyId: 100 }).then((res) => {
    rawMaterialData.value = res.rows.map((x) => ({
      ...x,
      label:
        x.name +
        "，" +
        x.customCode +
        "，" +
        `${x["length"]}*${x.width}*${x.height}（cm）` +
        "，" +
        x.color,
      value: x.id,
    }));
  });
  proxy.post("/technology/page", { pageNum: 1, pageSize: 999 }).then((res) => {
    technologyData.value = res.rows;
  });
};
getRawMaterialData();
const openAddDialog = ref(false);
const submitLoading = ref(false);
const modalType = ref("add");
const newPriceSheet = () => {
  formOption.disabled = false;
  isDetail.value = false;
  isChange.value = false;
  isShowChart.value = false;
  modalType.value = "add";
  openAddDialog.value = true;
  formData.data = {
    type: 1,
    quotationProductList: [],
  };
};

const isDetail = ref(false);
const isChange = ref(false);
const getFileData = () => {
  let ids = [];
  formData.data.quotationProductList.map((x) => {
    // ids.push(x.productId);
    x.quotationProductBomList.map((y) => {
      ids.push(y.materialId);
    });
  });
  ids = Array.from(new Set(ids));
  proxy
    .post("/fileInfo/getList", {
      businessIdList: ids,
    })
    .then((fileObj) => {
      formData.data.quotationProductList.map((x) => {
        // x.fileList = fileObj[x.productId] || [];
        // if (x.fileList && x.fileList.length > 0) {
        //   x.fileUrl = x.fileList[0].fileUrl;
        // }
        x.quotationProductBomList.map((y) => {
          y.fileList = fileObj[y.materialId] || [];
          if (y.fileList && y.fileList.length > 0) {
            y.fileUrl = y.fileList[0].fileUrl;
          }
        });
      });
    });
};
const getDtl = (row, flag, change = false) => {
  formOption.disabled = flag;
  modalType.value = "edit";
  isChange.value = change;
  isDetail.value = flag;
  isShowChart.value = flag;
  openAddDialog.value = true;
  proxy.post("/saleQuotation/detail", { id: row.id }).then((res) => {
    formData.data = res;
    // 城市数据回显
    if (formData.data.buyCountryId) {
      getCityData(formData.data.buyCountryId, "20");
    }
    if (formData.data.buyProvinceId) {
      getCityData(formData.data.buyProvinceId, "30");
    }
    // 文件数据回显
    getFileData();
    let productIds = formData.data.quotationProductList.map((x) => x.productId);
    proxy.getFileData({
      businessIdList: productIds,
      data: formData.data.quotationProductList,
      att: "productId",
      businessType: "0",
      fileAtt: "productFile",
      filePathAtt: "fileUrl",
    });
    // 价格计算
    changeQuantity();

    //折线图
    if (flag && res.quotationTrendList && res.quotationTrendList.length >= 2) {
      nextTick(() => {
        myChart = echarts.init(chartDom.value);
        window.addEventListener("resize", () => {
          myChart.resize();
        });
        chartData.value = res.quotationTrendList;
        chartOption.data.xAxis.data = chartData.value.map((item) => {
          return item.createTime.slice(0, 10);
        });
        chartOption.data.series[0].data = chartData.value.map((item, index) => {
          if (item.code == row.code) {
            return {
              value: item.amount || 0,
              itemStyle: { color: "red" },
            };
          } else {
            return item.amount || 0;
          }
        });
        myChart.setOption(chartOption.data);
        myChart.resize();
      });
    } else {
      isShowChart.value = false;
    }
  });
};

const openPrint = ref(false);
const printDetails = ref({});
const clickPrint = (row) => {
  printDetails.value = {};
  openPrint.value = true;
  proxy.post("/saleQuotation/detail", { id: row.id }).then((res) => {
    printDetails.value = res;
    if (printDetails.value.ehsdJson) {
      let ehsdJson = JSON.parse(printDetails.value.ehsdJson);
      printDetails.value.deliveryTime = ehsdJson.deliveryTime;
    }
  });
};
const clickDownload = () => {
  proxy.getPdf("报价单PDF文件");
};
const statistics = (label, index) => {
  let num = 0;
  if (
    printDetails.value.quotationProductList &&
    printDetails.value.quotationProductList.length > 0
  ) {
    printDetails.value.quotationProductList.map((item) => {
      if (item[label]) {
        num = parseFloat(Number(num) + Number(item[label])).toFixed(index);
      }
    });
  }
  return num;
};
const getLabel = (key, list, label) => {
  let text = "";
  if (list && list.length > 0) {
    let data = list.filter((item) => item.id === key);
    if (data && data.length > 0) {
      text = data[0][label];
    }
  }
  return text;
};
const getAllMoney = (num) => {
  let money = num;
  if (
    printDetails.value.quotationPayList &&
    printDetails.value.quotationPayList.length > 0
  ) {
    printDetails.value.quotationPayList.map((item) => {
      if (item.amount) {
        money = parseFloat(Number(money) + Number(item.amount)).toFixed(2);
      }
    });
  }
  return money;
};

const currencyData = computed(
  () => proxy.useUserStore().allDict["account_currency"]
);
const fundsPaymentMethod = computed(
  () => proxy.useUserStore().allDict["funds_payment_method"]
);
const shippingMethod = computed(
  () => proxy.useUserStore().allDict["shipping_method"]
);
const treeData = ref([]);
const customerList = ref([]);
const customerUserList = ref([]);
const countryData = ref([]);
const provinceData = ref([]);
const cityData = ref([]);
const openProductCompany = ref(false);
const copyType = ref(1);
const copyContract = ref(false);
const indexValue = ref(-1);
const openSelectMaterial = ref(false);
const formData = reactive({
  data: {
    type: "1",
    quotationProductList: [],
  },
  backData: {},
  dataTwo: {},
});
const formDom = ref(null);
const formOption = reactive({
  inline: true,
  labelWidth: 100,
  itemWidth: 100,
  disabled: false,
});
let myChart = null;
const chartDom = ref(null);
const chartData = ref([]);
const isShowChart = ref(false);
const formConfig = computed(() => {
  return [
    {
      type: "title1",
      title: "报价趋势",
      isShow: isShowChart.value,
    },
    {
      type: "slot",
      slotName: "chart",
      isShow: isShowChart.value,
    },
    {
      type: "title1",
      title: "基本信息",
    },
    // {
    //   type: "select",
    //   prop: "type",
    //   label: "报价类型",
    //   data: typeData.value,
    //   itemWidth: 50,
    // },
    {
      type: "treeSelect",
      prop: "ofCompanyId",
      label: "业务公司",
      data: proxy.useUserStore().allDict["tree_company_data"],
      propsTreeLabel: "deptName",
      propsTreeValue: "deptId",
      itemWidth: 50,
    },
    {
      type: "treeSelect",
      prop: "companyId",
      label: "报价公司",
      data: treeData.value,
      propsTreeLabel: "deptName",
      propsTreeValue: "deptId",
      itemWidth: 50,
      fn: (val) => {
        companyId.value = val;
        formData.data.quotationProductList = [];
      },
    },
    {
      type: "title1",
      title: "贸易信息",
    },
    {
      type: "slot",
      slotName: "buyer",
      label: "",
      itemWidth: 100,
    },
    // {
    //   type: "input",
    //   itemType: "text",
    //   label: "联系人",
    //   prop: "buyContactName",
    //   itemWidth: 50,
    // },
    // {
    //   type: "input",
    //   itemType: "text",
    //   label: "联系人电话",
    //   prop: "buyContactNumber",
    //   itemWidth: 50,
    // },
    {
      type: "title1",
      title: "商品信息",
    },
    {
      type: "slot",
      slotName: "commodity",
      label: "",
    },
    {
      type: "title1",
      title: "报价总金额",
    },
    {
      type: "input",
      prop: "amount",
      label: "报价总金额",
      itemWidth: 25,
      disabled: true,
    },
  ];
});
const rules = ref({
  // type: [{ required: true, message: "请选择报价类型", trigger: "change" }],
  ofCompanyId: [
    { required: true, message: "请选择业务公司", trigger: "change" },
  ],
  companyId: [{ required: true, message: "请选择报价公司", trigger: "change" }],
  buyCorporationId: [
    { required: true, message: "请选择客户公司", trigger: "change" },
  ],
  quantity: [{ required: true, message: "请输入数量", trigger: "blur" }],
  productLength: [
    { required: true, message: "请输入长 （cm）", trigger: "blur" },
  ],
  productWidth: [
    { required: true, message: "请输入宽 （cm）", trigger: "blur" },
  ],
  productHeight: [
    { required: true, message: "请输入高 （cm）", trigger: "blur" },
  ],
  rawMaterialId: [
    { required: true, message: "请选择原材料", trigger: "change" },
  ],
  technologyId: [
    { required: true, message: "请选择工艺产线", trigger: "change" },
  ],
  foldWay: [{ required: true, message: "请选择折叠数", trigger: "change" }],
  remark: [{ required: true, message: "请输入备注", trigger: "blur" }],
});

const getCityData = (id, type, isChange = false) => {
  proxy.post("/customizeArea/list", { parentId: id }).then((res) => {
    if (type === "20") {
      provinceData.value = res;
      if (isChange) {
        formData.data.buyProvinceId = "";
        formData.data.provinceName = "";
        formData.data.buyCityId = "";
        formData.data.cityName = "";
      }
    } else if (type === "30") {
      cityData.value = res;
      if (isChange) {
        formData.data.buyCityId = "";
        formData.data.cityName = "";
      }
    } else {
      countryData.value = res;
    }
  });
};
getCityData("0");

const changeCustomer = (val) => {
  formData.data.quotationProductList = [];
  if (val) {
    proxy.post("/customer/detail", { id: val }).then(
      (res) => {
        formData.data.buyCorporationName = res.name;
        if (res.customerUserList && res.customerUserList.length > 0) {
          formData.data.buyContactName = res.customerUserList[0].name;
          if (res.customerUserList[0].contactJson) {
            let contactJson = JSON.parse(res.customerUserList[0].contactJson);
            if (contactJson && contactJson.length > 0) {
              formData.data.buyContactNumber = contactJson[0].contactNo;
            }
          }
          customerUserList.value = res.customerUserList.map((item) => {
            return {
              ...item,
              value: item.name,
            };
          });
        }
        // 回填客户的账户信息
        // formData.data.beneficiaryName = res.beneficiaryName;
        // formData.data.beneficiaryBank = res.beneficiaryBank;
        // formData.data.beneficiaryBankAddress = res.beneficiaryBankAddress;
        // formData.data.beneficiaryAccountNumber = res.beneficiaryAccountNumber;
        // formData.data.swiftCode = res.swiftCode;
        // formData.data.beneficiaryAddress = res.beneficiaryAddress;

        formData.data.buyCountryId = res.countryId;
        formData.data.buyProvinceId = res.provinceId;
        formData.data.buyCityId = res.cityId;
        formData.data.buyPostalCode = res.zipCode;
        formData.data.buyAddress = res.address;
        getCityData(formData.data.buyCountryId, "20");
        if (formData.data.buyProvinceId) {
          getCityData(formData.data.buyProvinceId, "30");
        }
      },
      (err) => {
        formData.data.buyCountryId = "";
        formData.data.buyProvinceId = "";
        formData.data.buyCityId = "";
        formData.data.buyPostalCode = "";
        formData.data.buyAddress = "";
      }
    );
  } else {
    formData.data.buyCountryId = "";
    formData.data.buyProvinceId = "";
    formData.data.buyCityId = "";
    formData.data.buyPostalCode = "";
    formData.data.buyAddress = "";
  }
};

const handlePerson = (item) => {
  if (item.contactJson) {
    let data = JSON.parse(item.contactJson);
    formData.data.buyContactNumber = data[0].contactNo;
  }
};
const quotationProductBomList = ref([]);
const productCustomInfoListData = ref([
  {
    type: 1,
    isCheck: 0,
    isCheckBox: false,
    fileList: [],
    remark: "",
  },
  {
    type: 2,
    isCheck: 0,
    isCheckBox: false,
    fileList: [],
    remark: "",
  },
  {
    type: 3,
    isCheck: 0,
    isCheckBox: false,
    fileList: [],
    remark: "",
  },
]);
const selectProduct = (row) => {
  if (row && row.id) {
    proxy.post("/productInfo/detail", { id: row.id }).then((res) => {
      let goods = res;
      if (goods.productBomDetailList && goods.productBomDetailList.length > 0) {
        let quotationProductCustomInfoList = goods.productCustomInfoList.map(
          (x) => {
            if (x.fileList) {
              x.fileList = x.fileList.map((y) => ({
                ...y,
                url: y.fileUrl,
                name: y.fileName,
              }));
            } else {
              x.fileList = [];
            }
            x.isCheckBox = x.isCheck == 1;
            delete x.id;
            return x;
          }
        );
        if (goods.isCustomized == 0) {
          quotationProductCustomInfoList = productCustomInfoListData.value;
        }
        let packAsk = goods.packAsk;
        if (packAsk) {
          packAsk = packAsk.split(",");
        }
        formData.data.quotationProductList.push({
          productId: goods.id,
          productName: goods.name,
          productCode: goods.customCode,
          productLength: goods["length"],
          productWidth: goods.width,
          productHeight: goods.height,
          productColor: goods.color,
          colorCardCode: goods.colorCardCode,
          netWeight: goods.netWeight,
          quantity: null,
          price: null,
          amount: "",
          fileList: [],
          rawMaterialId: goods.rawMaterialId,
          technologyId: goods.technologyId,
          logoLength: goods.logoLength,
          logoWidth: goods.logoWidth,
          logoHeight: goods.logoHeight,
          colorCount: goods.colorCount,
          isFold: goods.isFold || 0,
          foldWay: goods.foldWay,
          packAsk: packAsk,
          isCustomized: goods.isCustomized || 0,
          quotationProductBomList: goods.productBomDetailList,
          quotationProductCustomInfoList: quotationProductCustomInfoList,
        });
        activeNames.value.push(formData.data.quotationProductList.length - 1);
        proxy.msgTip("添加成功", 1);
      } else {
        return proxy.msgTip("该产品未配置BOM", 2);
      }
    });
  } else {
    return proxy.msgTip("选择错误", 2);
  }
};
const clickPushProduct = () => {
  let quotationProductCustomInfoList = productCustomInfoListData.value;
  formData.data.quotationProductList.push({
    productId: "",
    productName: "",
    productCode: "",
    productLength: null,
    productWidth: null,
    productHeight: null,
    productColor: "",
    colorCardCode: "",
    netWeight: null,
    quantity: null,
    price: null,
    amount: "",
    fileList: [],
    rawMaterialId: "",
    technologyId: "",
    logoLength: null,
    logoWidth: null,
    logoHeight: null,
    colorCount: null,
    isFold: 0,
    foldWay: "",
    packAsk: [],
    isCustomized: 0,
    quotationProductBomList: [],
    quotationProductCustomInfoList: quotationProductCustomInfoList,
  });
  proxy.msgTip("添加成功", 1);
  activeNames.value.push(formData.data.quotationProductList.length - 1);
};
// const selectProduct = (goods) => {
//   if (goods && goods.id) {
//     let fileUrl = "";
//     if (goods.fileList && goods.fileList.length > 0) {
//       fileUrl = goods.fileList[0].fileUrl;
//     }
//     proxy.post("/productBomInfo/detail", { id: goods.id }).then((res) => {
//       if (res.productBomDetailList && res.productBomDetailList.length > 0) {
//         quotationProductBomList.value = res.productBomDetailList.map((x) => ({
//           fileUrl: "",
//           materialId: x.materialId,
//           productName: x.materialName,
//           productCode: x.materialCode,
//           productLength: x["materialLength"],
//           productWidth: x.materialWidth,
//           productHeight: x.materialHeight,
//           quantity: x.quantity || null,
//           allQuantity: "",
//           price: null,
//           amount: "",
//           fileList: [],
//           type: x.type,
//         }));
//         formData.data.quotationProductList.push({
//           fileUrl: fileUrl,
//           productId: goods.id,
//           productName: goods.name,
//           productCode: goods.customCode,
//           productLength: goods["length"],
//           productWidth: goods.width,
//           productHeight: goods.height,
//           productColor: goods.color,
//           quantity: null,
//           price: null,
//           amount: "",
//           fileList: [],
//           quotationProductBomList: quotationProductBomList.value,
//         });
//         proxy.msgTip("添加成功", 1);
//         let ids = quotationProductBomList.value.map((x) => x.materialId);
//         proxy.getFile(
//           ids,
//           quotationProductBomList.value,
//           "materialId",
//           "fileList",
//           "fileUrl"
//         );
//       } else {
//         return proxy.msgTip("该产品未配置BOM", 2);
//       }
//     });
//   } else {
//     return proxy.msgTip("选择错误", 2);
//   }
// };

const handleClickSelectMaterial = (index) => {
  indexValue.value = index;
  openSelectMaterial.value = true;
};

const handleRemoveBom = (index, sonIndex) => {
  formData.data.quotationProductList[index].quotationProductBomList.splice(
    sonIndex,
    1
  );
};

const selectMaterial = (goods) => {
  let flag = formData.data.quotationProductList[
    indexValue.value
  ].quotationProductBomList.some((x) => x.materialId == goods.id);
  if (!flag) {
    let fileUrl = "";
    if (goods.fileList && goods.fileList.length > 0) {
      fileUrl = goods.fileList[0].fileUrl;
    }
    formData.data.quotationProductList[
      indexValue.value
    ].quotationProductBomList.push({
      fileUrl: fileUrl,
      materialId: goods.id,
      materialName: goods.name,
      materialCode: goods.customCode,
      // productLength: goods["length"],
      // productWidth: goods.width,
      // productHeight: goods.height,
      quantity: null,
      price: null,
      amount: "",
      fileList: [],
      type: 2,
    });
    proxy.msgTip("选择成功");
  } else {
    proxy.msgTip("该物料已选择", 2);
  }
};

// const selectMaterial = (goods) => {
//   let flag = formData.data.quotationProductList[
//     indexValue.value
//   ].quotationProductBomList.some((x) => x.materialId == goods.id);
//   if (!flag) {
//     let fileUrl = "";
//     if (goods.fileList && goods.fileList.length > 0) {
//       fileUrl = goods.fileList[0].fileUrl;
//     }
//     formData.data.quotationProductList[
//       indexValue.value
//     ].quotationProductBomList.push({
//       fileUrl: fileUrl,
//       materialId: goods.id,
//       productName: goods.name,
//       productCode: goods.customCode,
//       productLength: goods["length"],
//       productWidth: goods.width,
//       productHeight: goods.height,
//       quantity: null,
//       price: null,
//       amount: "",
//       fileList: [],
//       type: 2,
//     });
//     proxy.msgTip("选择成功");
//   } else {
//     proxy.msgTip("该物料已选择", 2);
//   }
// };

const onPicture = (path) => {
  window.open(path, "_blank");
};
const handleRemove = (index) => {
  formData.data.quotationProductList.splice(index, 1);
  changeQuantity();
};

const handleDeleteMaterial = (index, sonIndex) => {
  formData.data.quotationProductList[index].quotationProductBomList.splice(
    sonIndex,
    1
  );
  changeQuantity();
};
const loadingSearch = ref(false);
const remoteMethod = (keyword) => {
  if (keyword && typeof keyword === "string") {
    loadingSearch.value = true;
    proxy.post("/customer/selPage", { keyword }).then((res) => {
      customerList.value = res.rows.map((x) => ({
        ...x,
        label: x.name,
        value: x.id,
      }));
      loadingSearch.value = false;
    });
  }
  return;
};

const changeQuantity = () => {
  let money = 0;
  if (
    formData.data.quotationProductList &&
    formData.data.quotationProductList.length > 0
  ) {
    // 单个产品的价格
    for (let i = 0; i < formData.data.quotationProductList.length; i++) {
      let iele = formData.data.quotationProductList[i];
      let productPrice = 0;
      for (let j = 0; j < iele.quotationProductBomList.length; j++) {
        const jele = iele.quotationProductBomList[j];
        productPrice += Number(
          parseFloat(Number(jele.quantity) * Number(jele.price)).toFixed(2)
        );
      }
      iele.price = parseFloat(productPrice).toFixed(2);
    }

    // 计算数量以及小计
    for (let i = 0; i < formData.data.quotationProductList.length; i++) {
      let iele = formData.data.quotationProductList[i];
      if (iele.quantity) {
        if (iele.price) {
          iele.amount = parseFloat(
            Number(iele.quantity) * Number(iele.price)
          ).toFixed(2);
          money += Number(iele.amount);
        }
        for (let j = 0; j < iele.quotationProductBomList.length; j++) {
          const jele = iele.quotationProductBomList[j];
          jele.allQuantity = iele.quantity * jele.quantity;
          if (jele.price) {
            jele.amount = parseFloat(
              Number(jele.allQuantity) * Number(jele.price)
            ).toFixed(2);
          }
        }
      }
    }
    formData.data.amount = parseFloat(money).toFixed(2);
  }
};

const handleSubmit = (type) => {
  formDom.value.handleSubmit(() => {
    if (
      formData.data.quotationProductList &&
      formData.data.quotationProductList.length > 0
    ) {
      let data = proxy.deepClone(formData.data);
      for (let i = 0; i < data.quotationProductList.length; i++) {
        const iele = data.quotationProductList[i];
        if (
          !(
            iele.quotationProductBomList &&
            iele.quotationProductBomList.length > 0
          )
        ) {
          return proxy.msgTip("请添加辅材", 2);
        }
        iele.quotationProductBomList.push({
          materialId: iele.rawMaterialId,
          type: 1,
        });
        if (iele.packAsk) {
          iele.packAsk = iele.packAsk.join(",");
        }

        if (
          iele.quotationProductCustomInfoList &&
          iele.quotationProductCustomInfoList.length > 0
        ) {
          let checkNum = 0;
          for (let j = 0; j < iele.quotationProductCustomInfoList.length; j++) {
            let jele = iele.quotationProductCustomInfoList[j];
            jele.isCheck = jele.isCheckBox ? 1 : 0;
            if (jele.isCheckBox) {
              checkNum += 1;
            }
            if (jele.isCheckBox) {
              if (!(jele.fileList && jele.fileList.length > 0)) {
                return proxy.msgTip(
                  `请上传第${i + 1}条数据的${getLabel(jele.type)}附件`,
                  2
                );
              }
            }
          }
          if (checkNum == 0) {
            return proxy.msgTip(`请至少勾选一个第${i + 1}条数据的定制内容`, 2);
          }
        }
      }
      submitLoading.value = true;
      data.status = type;
      if (isChange.value) {
        proxy.post("/saleQuotation/change", data).then(
          (res) => {
            proxy.msgTip("操作成功", 1);
            openAddDialog.value = false;
            submitLoading.value = false;
            detailDialog.value = false;
            getList();
          },
          (err) => {
            submitLoading.value = false;
          }
        );
      } else {
        proxy.post("/saleQuotation/" + modalType.value, data).then(
          (res) => {
            proxy.msgTip("操作成功", 1);
            openAddDialog.value = false;
            submitLoading.value = false;
            detailDialog.value = false;
            getList();
          },
          (err) => {
            submitLoading.value = false;
          }
        );
      }
    } else {
      return proxy.msgTip("请添加至少一件商品", 2);
    }
  });
};

const chartOption = reactive({
  data: {
    tooltip: {
      trigger: "axis",
    },
    // legend: {
    //   data: ["价格"],
    // },
    grid: {
      left: "3%",
      right: "6%",
      top: "10%",
      bottom: "3%",
      containLabel: true,
    },
    tooltip: {
      show: true,
      trigger: "axis",
      // 格式化函数
      // valueFormatter: (val) => {
      //   return val + "aaa";
      // },
      formatter: (params, ticket, callback) => {
        return `
        ${params[0].seriesName}：${params[0].value}
        <br/>
         报价单号：${chartData.value[params[0].dataIndex].code}
        `;
      },
      textStyle: {
        fontSize: 12,
      },
    },
    // toolbox: {
    //   feature: {
    //     saveAsImage: {},
    //   },
    // },
    xAxis: {
      type: "category",
      boundaryGap: false,
      data: [],
    },
    yAxis: {
      type: "value",
    },
    series: [
      {
        name: "报价金额",
        type: "line",
        data: [],
      },
    ],
  },
});

const handleRepeal = (row, url) => {
  proxy
    .msgConfirm()
    .then((res) => {
      proxy
        .post(url, {
          id: row.id,
        })
        .then((res) => {
          proxy.msgTip("操作成功", 1);
          detailDialog.value = false;
          getList();
        });
    })
    .catch((err) => {});
};
const formDomOne = ref(null);
const foreignDialog = ref(false);
const formConfigOne = computed(() => {
  return [
    // {
    //   type: "title1",
    //   title: "利润点数",
    // },
    // {
    //   type: "number",
    //   prop: "coefficient",
    //   label: "利润点数",
    //   precision: 2,
    //   min: 0.01,
    //   controls: false,
    //   itemWidth: 25,
    //   fn: (val) => {
    //     publicTotalAmount(val);
    //   },
    // },
    {
      type: "title1",
      title: "商品信息",
    },
    {
      type: "slot",
      slotName: "commodity",
      label: "",
    },
    {
      type: "title1",
      title: "报价总金额",
    },
    {
      type: "input",
      prop: "amount",
      label: "报价总金额",
      itemWidth: 25,
      disabled: true,
    },
  ];
});

const formOptionOne = reactive({
  inline: true,
  labelWidth: 100,
  itemWidth: 100,
  disabled: false,
});
const rulesOne = ref({
  price: [{ required: true, message: "请输入单价", trigger: "blur" }],
  // coefficient: [{ required: true, message: "请输入系数", trigger: "blur" }],
});
const handleForeign = (row) => {
  foreignDialog.value = true;
  proxy.post("/saleQuotation/detail", { id: row.id }).then((res) => {
    formData.data = res;
    formData.data.saleQuotationId = res.id;
    delete formData.data.code;
    delete formData.data.id;
    // 复制原本价格
    for (let i = 0; i < formData.data.quotationProductList.length; i++) {
      const iele = formData.data.quotationProductList[i];
      iele.quotationProductId = iele.id;
      delete iele.id;
      iele.guidePrice = iele.price;
      iele.maxPrice = Number(
        parseFloat((iele.amplifyRatio / 100 + 1) * iele.minPrice).toFixed(2)
      );
      iele.price = iele.minPrice;
      for (let j = 0; j < iele.quotationProductBomList.length; j++) {
        const jele = iele.quotationProductBomList[j];
        jele.quotationProductBomId = jele.id;
        delete jele.id;
        // jele.priceCopy = jele.price;
        // jele.price = Number(parseFloat(jele.price * 1.1)).toFixed(2);
        // 默认系数
        // jele.coefficient = 1.1;
      }
    }
    // changeQuantity();
    // 城市数据回显
    // if (formData.data.buyCountryId) {
    //   getCityData(formData.data.buyCountryId, "20");
    // }
    // if (formData.data.buyProvinceId) {
    //   getCityData(formData.data.buyProvinceId, "30");
    // }
    changeForeignQuantity();
    // 文件数据回显
    getFileData();
    let productIds = formData.data.quotationProductList.map((x) => x.productId);
    proxy.getFileData({
      businessIdList: productIds,
      data: formData.data.quotationProductList,
      att: "productId",
      businessType: "0",
      fileAtt: "productFile",
      filePathAtt: "fileUrl",
    });
  });
};

const totalAmount = () => {
  let money = 0;
  if (
    formData.data.quotationProductList &&
    formData.data.quotationProductList.length > 0
  ) {
    for (let i = 0; i < formData.data.quotationProductList.length; i++) {
      let iele = formData.data.quotationProductList[i];
      let productPrice = 0;
      for (let j = 0; j < iele.quotationProductBomList.length; j++) {
        const jele = iele.quotationProductBomList[j];
        // 计算新单价
        jele.price = parseFloat(
          Number(jele.priceCopy) * Number(jele.coefficient)
        ).toFixed(2);
        // 计算物料总计
        jele.amount = parseFloat(
          Number(jele.allQuantity) *
            Number(jele.priceCopy) *
            Number(jele.coefficient)
        ).toFixed(2);
        // 单个产品的一个物料的钱
        productPrice += Number(
          parseFloat(
            Number(jele.quantity) *
              Number(jele.priceCopy) *
              Number(jele.coefficient)
          ).toFixed(2)
        );
      }
      iele.price = parseFloat(productPrice).toFixed(2);
      iele.amount = parseFloat(
        Number(iele.quantity) * Number(iele.price)
      ).toFixed(2);
      money += Number(iele.amount);
    }
  }
  formData.data.amount = parseFloat(money).toFixed(2);
};

const publicTotalAmount = (val) => {
  if (val) {
    let money = 0;
    if (
      formData.data.quotationProductList &&
      formData.data.quotationProductList.length > 0
    ) {
      for (let i = 0; i < formData.data.quotationProductList.length; i++) {
        let iele = formData.data.quotationProductList[i];
        let productPrice = 0;
        for (let j = 0; j < iele.quotationProductBomList.length; j++) {
          const jele = iele.quotationProductBomList[j];
          // 系数赋值
          jele.coefficient = val;
          // 计算新单价
          jele.price = parseFloat(
            Number(jele.priceCopy) * Number(jele.coefficient)
          ).toFixed(2);
          // 计算物料总计
          jele.amount = parseFloat(
            Number(jele.allQuantity) *
              Number(jele.priceCopy) *
              Number(jele.coefficient)
          ).toFixed(2);
          // 单个产品的一个物料的钱
          productPrice += Number(
            parseFloat(
              Number(jele.quantity) *
                Number(jele.priceCopy) *
                Number(jele.coefficient)
            ).toFixed(2)
          );
        }
        iele.price = parseFloat(productPrice).toFixed(2);
        iele.amount = parseFloat(
          Number(iele.quantity) * Number(iele.price)
        ).toFixed(2);
        money += Number(iele.amount);
      }
    }
    formData.data.amount = parseFloat(money).toFixed(2);
  }
};

const handleSubmitOne = () => {
  formDomOne.value.handleSubmit(() => {
    proxy
      .msgConfirm()
      .then((res) => {
        submitLoading.value = true;
        proxy.post("/extQuotation/add", formData.data).then((res) => {
          proxy.msgTip("操作成功", 1);
          submitLoading.value = false;
          foreignDialog.value = false;
          getList();
        });
      })
      .catch((err) => {
        submitLoading.value = false;
      });
  });
};

const detailDialog = ref(false);
const detailRowData = ref({});
const handleOpenDetail = (item) => {
  detailRowData.value = item;
  detailDialog.value = true;
};

const leftRowData = ref({});
const changeLeftData = (i) => {
  leftRowData.value = i;
};

const backFormDom = ref(null);
const backDialog = ref(false);
const backFormConfig = computed(() => {
  return [
    {
      type: "input",
      itemType: "textarea",
      rows: 10,
      prop: "backRemark",
      label: "退回原因",
      itemWidth: 100,
      disabled: false,
    },
  ];
});

const backFormOption = reactive({
  inline: true,
  labelWidth: 100,
  itemWidth: 100,
  disabled: false,
});

const backRules = ref({
  backRemark: [{ required: true, message: "请输入退回原因", trigger: "blur" }],
});

const handleBack = (row) => {
  formData.backData = {
    id: row.id,
    quotationStatus: 1,
    backRemark: "",
  };
  backDialog.value = true;
};

const handleSubmitBack = () => {
  backFormDom.value.handleSubmit(() => {
    submitLoading.value = true;
    proxy
      .msgConfirm()
      .then((res) => {
        proxy.post("/saleQuotation/edit", formData.backData).then((res) => {
          proxy.msgTip("操作成功", 1);
          submitLoading.value = false;
          backDialog.value = false;
          getList();
          detailDialog.value = false;
        });
      })
      .catch((err) => {
        submitLoading.value = false;
      });
  });
};

const getFileDataOne = () => {
  let ids = [];
  formData.dataTwo.quotationProductList.map((x) => {
    // ids.push(x.productId);
    x.quotationProductBomList.map((y) => {
      ids.push(y.materialId);
    });
  });
  ids = Array.from(new Set(ids));
  proxy
    .post("/fileInfo/getList", {
      businessIdList: ids,
    })
    .then((fileObj) => {
      formData.dataTwo.quotationProductList.map((x) => {
        // x.fileList = fileObj[x.productId] || [];
        // if (x.fileList && x.fileList.length > 0) {
        //   x.fileUrl = x.fileList[0].fileUrl;
        // }
        x.quotationProductBomList.map((y) => {
          y.fileList = fileObj[y.materialId] || [];
          if (y.fileList && y.fileList.length > 0) {
            y.fileUrl = y.fileList[0].fileUrl;
          }
        });
      });
    });
};

const changeQuantityOne = () => {
  let money = 0;
  if (
    formData.dataTwo.quotationProductList &&
    formData.dataTwo.quotationProductList.length > 0
  ) {
    // 单个产品的价格
    for (let i = 0; i < formData.dataTwo.quotationProductList.length; i++) {
      let iele = formData.dataTwo.quotationProductList[i];
      iele.amount = Number(
        parseFloat(Number(iele.quantity) * Number(iele.price)).toFixed(2)
      );
      money += iele.amount;
    }
    formData.dataTwo.amount = parseFloat(money).toFixed(2);
  }
};

const changeQuantityTwo = () => {
  let money = 0;
  if (
    formData.dataTwo.quotationProductList &&
    formData.dataTwo.quotationProductList.length > 0
  ) {
    // 单个产品的价格
    for (let i = 0; i < formData.dataTwo.quotationProductList.length; i++) {
      let iele = formData.dataTwo.quotationProductList[i];
      money += Number(
        parseFloat(Number(iele.quantity) * Number(iele.prodPrice)).toFixed(2)
      );
    }
    formData.dataTwo.amountTwo = parseFloat(money).toFixed(2);
  }
};

const changeMinPrice = () => {
  if (
    formData.dataTwo.quotationProductList &&
    formData.dataTwo.quotationProductList.length > 0
  ) {
    // 单个产品的价格
    for (let i = 0; i < formData.dataTwo.quotationProductList.length; i++) {
      let iele = formData.dataTwo.quotationProductList[i];
      if (iele.minPrice && iele.amplifyRatio) {
        iele.maxPrice = Number(
          parseFloat(
            Number(iele.minPrice) * (1 + Number(iele.amplifyRatio) / 100)
          ).toFixed(2)
        );
      }
    }
  }
};

const isDetailData = ref(false);
const getConfirmDtl = (row, flag) => {
  if (!proxy.useUserStore().roles.includes("GM")) {
    return;
  }
  isDetailData.value = flag;
  formOptionTwo.disabled = flag;
  modalType.value = "edit";
  confirmDialog.value = true;
  proxy.post("/saleQuotation/detail", { id: row.id }).then((res) => {
    formData.dataTwo = res;
    if (!flag) {
      formData.dataTwo.quotationProductList =
        formData.dataTwo.quotationProductList.map((x) => ({
          ...x,
          price: x.prodPrice,
        }));
    }
    // 文件数据回显
    getFileDataOne();
    let productIds = formData.dataTwo.quotationProductList.map(
      (x) => x.productId
    );
    proxy.getFileData({
      businessIdList: productIds,
      data: formData.dataTwo.quotationProductList,
      att: "productId",
      businessType: "0",
      fileAtt: "productFile",
      filePathAtt: "fileUrl",
    });
    // 价格计算
    changeQuantityOne();
    changeQuantityTwo();
    changeMinPrice();
  });
};

const formDomTwo = ref(null);
const confirmDialog = ref(false);
const formConfigTwo = computed(() => {
  return [
    {
      type: "title1",
      title: "商品信息",
    },
    {
      type: "slot",
      slotName: "commodity",
      label: "",
    },
    {
      type: "title1",
      title: "报价总金额",
    },
    {
      type: "input",
      prop: "amountTwo",
      label: "工厂报价总额",
      itemWidth: 25,
      disabled: true,
    },
    {
      type: "input",
      prop: "amount",
      label: "调整报价总额",
      itemWidth: 25,
      disabled: true,
    },
  ];
});

const formOptionTwo = reactive({
  inline: true,
  labelWidth: 100,
  itemWidth: 100,
  disabled: false,
});
const rulesTwo = ref({
  price: [{ required: true, message: "请输入单价", trigger: "blur" }],
  // coefficient: [{ required: true, message: "请输入系数", trigger: "blur" }],
  minPrice: [{ required: true, message: "业务员最低报价", trigger: "blur" }],
  amplifyRatio: [{ required: true, message: "上调比例", trigger: "blur" }],
});

const confirmSubmit = () => {
  formDomTwo.value.handleSubmit(() => {
    formData.dataTwo.quotationStatus = 2;
    proxy
      .msgConfirm()
      .then((res) => {
        submitLoading.value = true;
        proxy.post("/saleQuotation/edit", formData.dataTwo).then((res) => {
          proxy.msgTip("操作成功", 1);
          submitLoading.value = false;
          confirmDialog.value = false;
          getList();
          detailDialog.value = false;
        });
      })
      .catch((err) => {
        submitLoading.value = false;
      });
  });
};

const changeForeignQuantity = () => {
  let money = 0;
  if (
    formData.data.quotationProductList &&
    formData.data.quotationProductList.length > 0
  ) {
    // 单个产品的价格
    for (let i = 0; i < formData.data.quotationProductList.length; i++) {
      let iele = formData.data.quotationProductList[i];
      iele.amount = Number(parseFloat(iele.price * iele.quantity).toFixed(2));
      money += Number(iele.amount);
    }
    formData.data.amount = parseFloat(money).toFixed(2);
  }
};

const activeNames = ref([]);

let obj = {
  1: "定制刀模",
  2: "定制纹路",
  3: "定制模具",
};
const getLabelOne = (type) => {
  return obj[type];
};

const handleBeforeUploadOne = async (file, index, sonIndex) => {
  const res = await proxy.post("/fileInfo/getSing", { fileName: file.name });
  file.id = res.id;
  file.fileUrl = res.fileUrl;
  uploadData.value = res.uploadBody;
  formData.data.quotationProductList[index].quotationProductCustomInfoList[
    sonIndex
  ].fileData = res;
  return true;
};

const handleSuccessOne = (index, sonIndex) => {
  if (
    formData.data.quotationProductList[index].quotationProductCustomInfoList[
      sonIndex
    ].fileData &&
    formData.data.quotationProductList[index].quotationProductCustomInfoList[
      sonIndex
    ].fileData.fileUrl
  ) {
    let file =
      formData.data.quotationProductList[index].quotationProductCustomInfoList[
        sonIndex
      ].fileData;
    formData.data.quotationProductList[index].quotationProductCustomInfoList[
      sonIndex
    ].fileList.push({
      id: file.id,
      fileName: file.fileName,
      name: file.fileName,
      url: file.fileUrl,
      fileUrl: file.fileUrl,
    });
    formData.data.quotationProductList[index].quotationProductCustomInfoList[
      sonIndex
    ].fileData = {};
  }
};

const handleRemoveFile = (file, index, sonIndex) => {
  formData.data.quotationProductList[index].quotationProductCustomInfoList[
    sonIndex
  ].fileList.splice(sonIndex, 1);
};

const onPreviewFile = (file) => {
  if (file && file.fileUrl) {
    window.open(file.fileUrl, "_blank");
  } else {
    window.open(file.raw.fileUrl, "_blank");
  }
};
</script>

<style lang="scss" scoped>
.tenant {
  padding: 20px;
}
::v-deep(.el-input-number .el-input__inner) {
  text-align: left;
}
.baseRow {
  min-height: 24px;
  border-top: 1px solid black;
  border-left: 1px solid black;
}
.contentRow {
  border-right: 1px solid black;
  line-height: 24px;
  padding-left: 4px;
}
.pic {
  object-fit: contain;
  width: 50px;
  height: 50px;
  cursor: pointer;
  vertical-align: middle;
}

:deep(.bom-table .el-table__body-wrapper .el-table__body .el-table__row) {
  background: #f4f4f5 !important;
}

.table {
  border-collapse: collapse;
  border-spacing: 0;

  td {
    text-align: center;
    padding: 2px 4px;
    // padding: 5px 10px;
  }
}
.small-title {
  padding-left: 15px;
  margin-bottom: 10px;
  color: #3366ff;
  font-size: 14px;
}
:deep(.el-checkbox) {
  margin-right: 0px;
}
</style>