mec-cloud_-intelligent-manufacturing_client/zkqy-ui/src/views/orderMange/retailMange/index.vue

<template>
  <el-card shadow="always" :body-style="{ padding: '10px' }">
    <div class="app-container">
      <el-dialog
        :title="upload.title"
        :visible.sync="upload.open"
        width="400px"
        append-to-body
      >
        <el-upload
          ref="upload"
          :limit="1"
          accept=".xlsx, .xls"
          :headers="upload.headers"
          :action="
            upload.url +
            '?updateSupport=' +
            upload.updateSupport +
            '&tableName=' +
            tableName +
            '&sqlKey=' +
            tableKey
          "
          v-loading="upload.isUploading"
          :disabled="upload.isUploading"
          :on-progress="handleFileUploadProgress"
          :on-success="handleFileSuccess"
          :auto-upload="false"
          :onChange="handleChange"
          drag
        >
          <i class="el-icon-upload"></i>
          <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
          <div class="el-upload__tip text-center" slot="tip">
            <!--          <div class="el-upload__tip" slot="tip">-->
            <!--            <el-checkbox v-model="upload.updateSupport"/>-->
            <!--            是否更新已经存在的用户数据-->
            <!--          </div>-->
            <span>仅允许导入xls、xlsx格式文件。</span>
            <el-link
              type="primary"
              :underline="false"
              style="font-size: 12px; vertical-align: baseline"
              @click="importTemplate"
              >下载模板
            </el-link>
          </div>
        </el-upload>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitFileForm">确 定</el-button>
          <el-button @click="upload.open = false">取 消</el-button>
        </div>
      </el-dialog>
      <Queryfrom
        :form-vals="templateInfo.where"
        :statisticList="statisticList"
        :showCount="showCount"
        :showSearch="showSearch"
        @getList="getList"
        ref="mychild"
      />
      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button
            type="primary"
            plain
            icon="el-icon-plus"
            size="mini"
            v-hasPermi="['system:RetailOrder:insert']"
            @click="addHandler"
            >新增
          </el-button>
        </el-col>
        <!-- <el-col :span="1.5" v-if="false">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          >修改
        </el-button>
      </el-col> -->
        <el-col :span="1.5">
          <el-button
            type="danger"
            plain
            icon="el-icon-delete"
            size="mini"
            :disabled="multiple"
            v-hasPermi="['system:RetailOrder:remove']"
            @click="myDeleteHandler"
            >删除
          </el-button>
        </el-col>
        <!-- <el-col :span="1.5">
          <el-button
            plain
            icon="el-icon-upload2"
            size="mini"
            @click="upload.open = true"
            >导入
          </el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button
            type="warning"
            plain
            icon="el-icon-download"
            size="mini"
            @click="handleExport"
            >导出
          </el-button>
        </el-col>
        <right-toolbar
          style="float: right"
          :showCount.sync="showCount"
          :showSearch.sync="showSearch"
          :counts="true"
          @queryTable="pageList"
        ></right-toolbar> -->
        <el-radio-group
          style="float: right; margin-right: 100px"
          v-model="queryParams.status"
          @change="orderStartChange"
          size="mini"
        >
          <!--        未提交/和待出库  -->
          <el-radio-button :label="100">未完成</el-radio-button>
          <el-radio-button :label="200">已完成</el-radio-button>
        </el-radio-group>
      </el-row>

      <el-table
        v-loading="loading"
        :data="tableList"
        @selection-change="handleSelectionChange"
        ref="tableRef"
        :cell-style="cellStyle"
        row-key="id"
      >
        <el-table-column
          type="selection"
          width="55"
          :reserve-selection="true"
          align="center"
        >
        </el-table-column>
        <!-- <el-table-column type="selection" width="55" /> -->
        <el-table-column prop="saleNo" align="center" label="合同号" />
        <el-table-column prop="saleDate" align="center" label="日期" />
        <el-table-column prop="customName" align="center" label="客户名称" />
        <el-table-column prop="deliveryDate" align="center" label="交货日期" />
        <el-table-column prop="saleLeadTime" align="center" label="交货天数" />
        <el-table-column
          prop="saleAmountInWords"
          align="center"
          label="合计金额(大写)"
        />
        <el-table-column label="付款方式" align="center" prop="salePayType">
          <template slot-scope="scope">
            {{ getDictLabel(scope.row.salePayType, "payment_method") }}
          </template>
        </el-table-column>
        <el-table-column prop="status" align="center" label="状态">
          <template slot-scope="scope">
            <el-tag :type="scope.row.listClass">{{
              getDictLabel(scope.row.status, "sales_order_status")
            }}</el-tag>
          </template>
        </el-table-column>

        <el-table-column prop="salesman" align="center" label="销售员" />
        <el-table-column prop="remark" align="center" label="备注" />
        <el-table-column label="操作" align="center">
          <template slot-scope="scope">
            <el-dropdown>
              <el-button type="warning" plain size="small">
                操作<i class="el-icon-arrow-down el-icon--right"></i>
              </el-button>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item v-show="scope.row.status != 6">
                  <el-button
                    size="mini"
                    type="text"
                    icon="el-icon-edit"
                    v-hasPermi="['system:RetailOrder:update']"
                    @click="handleUpdate(scope.row)"
                    >修改
                  </el-button>
                </el-dropdown-item>
                <el-dropdown-item v-show="scope.row.status == 9">
                  <el-button
                    size="mini"
                    type="text"
                    icon="el-icon-edit"
                    v-hasPermi="['system:RetailOrder:update']"
                    @click="handleComplate(scope.row)"
                    >完成
                  </el-button>
                </el-dropdown-item>
                <el-dropdown-item>
                  <el-button
                    size="mini"
                    type="text"
                    icon="el-icon-tickets"
                    v-hasPermi="['system:RetailOrder:info']"
                    @click="handlePrint(scope.row)"
                    >详情
                  </el-button>
                </el-dropdown-item>
                <!-- <el-dropdown-item>
                  <el-button
                    size="mini"
                    type="text"
                    icon="el-icon-folder-checked"
                    v-hasPermi="['system:RetailOrder:submit']"
                    @click="handleSubmit(scope.row)"
                    >提交
                  </el-button>
                </el-dropdown-item> -->
                <!-- <el-dropdown-item v-show="scope.row.status == 5">
                  <el-button
                    size="mini"
                    type="text"
                    icon="el-icon-folder-delete"
                    v-hasPermi="['system:RetailOrder:update']"
                    @click="handleSubmitCancel(scope.row)"
                    >撤销
                  </el-button>
                </el-dropdown-item> -->
                <el-dropdown-item v-show="scope.row.status != 1">
                  <el-button
                    size="mini"
                    type="text"
                    icon="el-icon-folder-delete"
                    @click="handleOutDetail(scope.row)"
                    >出库明细
                  </el-button>
                </el-dropdown-item>
                <el-dropdown-item v-show="scope.row.status == 5">
                  <el-button
                    size="mini"
                    type="text"
                    icon="el-icon-folder-delete"
                    @click="myPrintOutBoundHandler(scope.row)"
                    >打印出库单
                  </el-button>
                </el-dropdown-item>
                <el-dropdown-item v-show="scope.row.status != 6">
                  <el-button
                    size="mini"
                    type="text"
                    icon="el-icon-delete"
                    v-hasPermi="['system:RetailOrder:remove']"
                    @click="myDeleteHandler(scope.row)"
                    >删除
                  </el-button>
                </el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </template>
        </el-table-column>
      </el-table>
      <pagination
        v-show="total > 0"
        :total="total"
        :page.sync="queryParams.pageNum"
        :limit.sync="queryParams.pageSize"
        @pagination="pageList"
      />

      <!-- 添加或修改销售出库单：- 过磅记录生成数据对话框 -->
      <el-dialog
        :title="title"
        width="1400px"
        :visible.sync="open"
        append-to-body
      >
        <el-row :gutter="20">
          <el-form
            :model="formData"
            ref="formDataRef"
            :rules="rules"
            label-width="100px"
            :inline="true"
            size="normal"
          >
            <el-col :span="12">
              <el-form-item prop="saleNo" label="合同号:">
                <!-- <el-input size="small" v-model="formData.saleNo"></el-input> -->
                {{ formData.saleNo }}
              </el-form-item>
            </el-col>
            <!-- <el-col :span="12">
              <el-form-item prop="lotNumber" label="批号:">
                <el-input size="small" v-model="formData.lotNumber"></el-input>
              </el-form-item>
            </el-col> -->
            <el-col :span="12">
              <el-form-item prop="saleDate" label="日期:">
                <!-- <el-date-picker
                  size="small"
                  v-model="formData.saleDate"
                  value-format="yyyy-MM-dd"
                  format="yyyy-MM-dd"
                  type="date"
                  placeholder="选择日期"
                >
                </el-date-picker> -->
                {{ formData.saleDate }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="saleCustomNo" label="客户名称:">
                <el-select
                  size="small"
                  v-model="formData.saleCustomNo"
                  placeholder="请选择客户"
                  clearable
                  filterable
                  @change="customChangeHandler"
                >
                  <el-option
                    v-for="item in customerOptions"
                    :key="item.customNo"
                    :label="item.customName"
                    :value="item.customNo"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>

            <el-col :span="12">
              <el-form-item v-if="isLeader" label="业务员:">
                <el-select
                  size="small"
                  v-model="formData.salesman"
                  placeholder="请选择业务员"
                  clearable
                  filterable
                  @change="salemanChange"
                >
                  <el-option
                    v-for="item in salesmanList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item v-else label="业务员:">
                <!-- <el-input
            v-model="formData.salesman"
            size="small"
            clearable
          ></el-input> -->
                {{ nickName }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="联系人:" size="normal">
                {{ formData.contactPerson }}
              </el-form-item>
              <el-form-item label="客户地址:" size="normal">
                {{ formData.customAddress }}
              </el-form-item>
              <el-form-item label="客户国别:" size="normal">
                {{ formData.customCountryType }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label-width="120px" label="合计金额(大写):">
                <!-- <el-input
                  v-model="formData.saleAmountInWords"
                  size="small"
                  clearable
                ></el-input> -->
                {{ formData.saleAmountInWords }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label-width="120px" label="货车登记:">
                <el-input
                  v-model="form.truckRegistration"
                  size="small"
                  clearable
                ></el-input>
                <!-- {{ formData.saleAmountInWords }} -->
              </el-form-item>
            </el-col>

            <el-col :span="12">
              <el-form-item prop="salePayType" label="付款方式">
                <!-- <el-input
                v-model="formData.salePayType"
                size="small"
                clearable
              ></el-input> -->
                <el-select
                  v-model="formData.salePayType"
                  size="small"
                  clearable
                  filterable
                >
                  <el-option
                    v-for="item in dict.type.payment_method"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>

            <!-- <el-col :span="12">
              <el-form-item label="付款方式:">
                <el-select
                  v-model="formData.salePayType"
                  size="small"
                  clearable
                  filterable
                >
                  <el-option
                    v-for="item in dict.type.retail_order_pay_method"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  ></el-option>
                </el-select>
                零售单
              </el-form-item>
            </el-col> -->

            <!-- <el-col :span="12">
              <el-form-item
                label-width="120px"
                prop="saleOrderEstimatedTime"
                label="预计下单时间:"
              >
                {{ formData.saleOrderEstimatedTime }}
              </el-form-item>
            </el-col> -->

            <!-- <el-col :span="12">
              <el-form-item label="交货日期:" size="normal" prop="deliveryDate">
                {{ formData.deliveryDate }}
              </el-form-item>
            </el-col> -->
            <!-- <el-col :span="12">
              <el-form-item label="交货天数:" size="normal" prop="saleLeadTime">
                {{ formData.saleLeadTime }}
              </el-form-item>
            </el-col> -->
            <el-col :span="24">
              <el-divider>货品明细</el-divider>
            </el-col>
            <el-table
              ref="productionTableRef"
              :data="productionTableData"
              border
              show-summary
              :summary-method="getSummaries"
              sum-text="小计"
              style="width: 100%"
            >
              <el-table-column prop="productName" label="品名" width="180">
                <template slot-scope="scope">
                  <!-- <el-input
                v-model="scope.row.productName"
                size="small"
                clearable
              ></el-input> -->
                  <el-form-item
                    :prop="'productName-' + scope.$index"
                    :name="'productName-' + scope.$index"
                    style="margin: 0px; padding: 0px"
                  >
                    <!--
                    @change="
                        handleProductChange(scope.row.productNo, scope.row)
                      "
                      @blur="handleProductBlur(productNo)"
                   -->
                    <el-select
                      v-model="scope.row.productName"
                      placeholder=""
                      filterable
                      @change="
                        newProductChange(scope.row.productName, scope.row)
                      "
                    >
                      <el-option
                        v-for="item in productionOptions"
                        :key="item.productName"
                        :label="item.productName"
                        :value="item.productName"
                      >
                        <!-- <span class="discribe" style="float: left">{{
                          item.productName
                        }}</span>
                        <span
                          style="float: right; color: #8492a6; font-size: 13px"
                          >{{ item.productSpecifications }}</span
                        > -->
                      </el-option>
                    </el-select>
                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column prop="productSpecifications" label="规格">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.productSpecifications"
                    @change="handleSpecificationsChange(scope.row)"
                    placeholder=""
                    filterable
                  >
                    <el-option
                      v-for="item in scope.row.specificationsList"
                      :key="item.productSpecifications"
                      :label="item.productSpecifications"
                      :value="item.productSpecifications"
                    >
                      <span class="discribe" style="float: left">{{
                        item.productSpecifications
                      }}</span>
                      <span
                        style="float: right; color: #8492a6; font-size: 13px"
                        >{{ item.productType }}</span
                      >
                    </el-option>
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column prop="colours" width="150" label="色号">
                <template slot-scope="scope">
                  <el-form-item
                    :prop="'colours-' + scope.$index"
                    :name="'colours-' + scope.$index"
                    style="margin: 0px; padding: 0px"
                  >
                    <el-select
                      v-model="scope.row.colours"
                      placeholder=""
                      clearable
                      filterable
                      @change="colourNumberChangeHandler(scope.row)"
                    >
                      <el-option
                        v-for="item in colourNumberOptions"
                        :key="item.colour"
                        :label="item.colour"
                        :value="item.colour"
                      >
                        <!-- <span class="discribe" style="float: left">{{
                          item.materieEncoding + item.materieColorNumber
                        }}</span> -->
                        <!-- <span
                        style="float: right; color: #8492a6; font-size: 13px"
                        >{{ item.materielCode }}</span
                      > -->
                      </el-option>
                    </el-select>
                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column prop="productType" label="类型">
              </el-table-column>

              <el-table-column prop="lotNumber" width="120" label="批号">
                <template slot-scope="scope">
                  <el-input
                    v-model="scope.row.lotNumber"
                    placeholder=""
                    size="small"
                    clearable
                    @blur="updateStorage(scope.row, 'lotNumber')"
                  ></el-input>
                </template>
              </el-table-column>

              <!-- <el-table-column prop="sliceType" label="切片型号">
                <template slot-scope="scope">
                  <el-form-item
                    :prop="'sliceType-' + scope.$index"
                    :name="'sliceType-' + scope.$index"
                    style="margin: 0px; padding: 0px"
                  >
                    <el-select
                      v-model="scope.row.sliceType"
                      placeholder=""
                      clearable
                      filterable
                      @change="sliceTypeChangeHandler(scope.row)"
                    >
                      <el-option
                        v-for="item in sliceTypeOptions"
                        :key="item.materielCode"
                        :label="item.materielName"
                        :value="item.materielCode"
                      >
                      </el-option>
                    </el-select>
                  </el-form-item>
                </template>
              </el-table-column> -->

              <el-table-column prop="productNumber" label="箱数">
                <template slot-scope="scope">
                  <el-form-item
                    :prop="'productNumber-' + scope.$index"
                    :name="'productNumber-' + scope.$index"
                    style="margin: 0px; padding: 0px"
                  >
                    <el-input
                      v-model="scope.row.productNumber"
                      oninput="value=value.replace(/[^0-9.]/g,'')"
                      size="small"
                      clearable
                      @change="computedPrice(scope.row)"
                    ></el-input>
                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column prop="productUnitPrice" label="单价">
                <template slot-scope="scope">
                  <el-form-item
                    :prop="'productUnitPrice-' + scope.$index"
                    :name="'productUnitPrice-' + scope.$index"
                    style="margin: 0px; padding: 0px"
                  >
                    <el-input
                      v-model="scope.row.productUnitPrice"
                      size="small"
                      oninput="value=value.replace(/[^0-9.]/g,'')"
                      @change="computedPrice(scope.row)"
                      clearable
                    ></el-input>
                  </el-form-item>
                </template>
              </el-table-column>
              <!--              <el-table-column prop="productAmounts" label="金额">-->
              <!--                <template slot-scope="scope">-->
              <!--                  {{ scope.row.productAmounts }}-->
              <!--                </template>-->
              <!--              </el-table-column>-->
              <el-table-column prop="inventoryBoxNum" label="库存箱数">
                <template slot-scope="scope">
                  {{ scope.row.inventoryBoxNum }}
                </template>
              </el-table-column>
              <el-table-column prop="inventoryWeight" label="库存重量/kg">
                <template slot-scope="scope">
                  {{ scope.row.inventoryWeight }}
                </template>
              </el-table-column>
              <el-table-column prop="remark" label="备注">
                <template slot-scope="scope">
                  <el-input
                    v-model="scope.row.remark"
                    size="small"
                    clearable
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column label="操作">
                <template slot-scope="scope">
                  <el-button
                    type="danger"
                    size="small"
                    @click="deleteProduct(scope.$index)"
                    >删除</el-button
                  >
                </template>
              </el-table-column>
            </el-table>
            <el-button
              class="mt5"
              type="primary"
              style="width: 100%"
              size="small"
              @click="addProduct"
              >添加货品</el-button
            >

            <!-- <el-col :span="12" v-show="formData.salePayType == '1'">
              <el-form-item prop="earnestMoney" label="定金">
                <el-input
                  v-model="formData.earnestMoney"
                  clearable
                  size="small"
                />
              </el-form-item>
            </el-col> -->
            <el-col :span="24">
              <el-divider>备注</el-divider>
            </el-col>
            <el-col :span="24">
              <el-input
                type="textarea"
                v-model="formData.orderRemark"
                placeholder=""
                size="normal"
                clearable
              ></el-input>
            </el-col>
            <!-- <el-col :span="24">
              <el-divider>审计人员数据</el-divider>
            </el-col> -->
          </el-form>
        </el-row>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="editConfirm">确 定</el-button>
          <el-button @click="cancel">取 消</el-button>
        </div>
      </el-dialog>

      <!-- 自定义弹窗 -->
      <el-dialog title="提交" :visible.sync="deliverShow" width="1200px">
        <!-- <DialogTemplate
        ref="dialogRef"
        :groupKey="groupKey"
        :rowobj="rowobj"
        :subCount="subCount"
        :tableCount="tableCount"
        :subTableName="subTableName"
        @addList="addListHandler"
      >
      </DialogTemplate> -->
        <RetailProvide ref="deliverRef"></RetailProvide>
        <span slot="footer" class="dialog-footer">
          <el-button @click="deliverShow = false">取 消</el-button>
          <!-- <el-button @click="btnSave">保 存</el-button> -->
          <el-button type="primary" @click="btnComfirm">确 定</el-button>
        </span>
      </el-dialog>
      <!-- 详情弹窗 -->
      <el-dialog title="详情" :visible.sync="detailShow" width="1250px">
        <div ref="detailTable" id="detail"></div>
        <span slot="footer" class="dialog-footer">
          <el-button @click="detailShow = false">取 消</el-button>
          <el-button type="primary" @click="detailPrintHandler"
            >打 印</el-button
          >
        </span>
      </el-dialog>
      <!-- 销售出库弹窗 -->
      <el-dialog
        title="打印-销售出库单"
        :visible.sync="outBoundShow"
        width="1000px"
      >
        <OutBound ref="outBoundRef" :currentRow="currentRow"></OutBound>
        <span slot="footer" class="dialog-footer">
          <el-button @click="outBoundShow = false">取 消</el-button>
          <el-button type="primary" @click="outBoundPrintHandler">
            打印</el-button
          >
        </span>
      </el-dialog>
      <!-- 出库详情 -->
      <el-dialog title="出库明细" :visible.sync="outStockShow" width="1200px">
        <OutStock ref="outStockRef"></OutStock>
        <span slot="footer" class="dialog-footer">
          <el-button @click="outStockShow = false">关 闭</el-button>
          <!-- <el-button @click="btnSave">保 存</el-button> -->
          <!-- <el-button type="primary" @click="btnComfirm">确 定</el-button> -->
        </span>
      </el-dialog>
      <div id="printDom"></div>
    </div>
  </el-card>
</template>
<script>
import {
  delTableData,
  dragTableInfo,
  listTable,
  unionListTableData,
  getInfoBySqlKey,
  btnCommonApi,
  addTableData,
  batchEdit,
  getStatisticList,
  getTableList1,
  checkOrderNo,
  delOrder,
  productInvoiceInfo,
  addProductInvoice,
  updateProductInvoice,
  queryMaterielList,
  getSaleOrderProductionListDistinct,
  getProductSpecificationsByProductName,
  productColourList,
} from "@/api/tablelist/commonTable";
import {
  saleOrderList,
  getRoleUser,
  addRetailOrder,
  getRetailOrderInfo,
  editRetailOrder,
  retailProductInvoiceInfo,
  submitRetailOrder,
  cancelRetailOrder,
  deleRetailOrder,
  submitProductInvoice,
  getProductInventory,
  updateOrder,
} from "@/api/system/retailMange.js";
import { listData } from "@/api/system/tenant/data";
import { getToken } from "@/utils/auth";
import Queryfrom from "@/views/tablelist/commonTable/queryfrom.vue";
import { camelCase, toUnderline } from "@/utils";
import { inputDisableComplete } from "@/utils/other";
import Menu from "@/views/tablelist/commonTable/BtnMenu.vue";
import { checkRole } from "@/utils/permission";
import DialogTemplate from "@/views/dialogTemplate/components/index.vue";
import {
  queryDropDownBoxData,
  getSaleOrderProductionList,
} from "@/api/dragform/form";
import { v4 as uuidv4 } from "uuid";
import { mapState } from "vuex";
import moment from "moment";
import Deliver from "@/views/orderMange/components/dialogForm/Deliver.vue";
import RetailProvide from "@/views/orderMange/components/dialogForm/RetailProvide.vue";
import OutStock from "@/views/orderMange/components/dialogForm/OutStock.vue";
import OutBound from "@/views/orderMange/components/dialogForm/OutBound.vue";
import outBoundPrint from "@/utils/print/outBoundPrint";
import { listCustomer } from "@/api/system/customer";
import { numToCapital } from "@/utils/other";
export default {
  name: "retailMange",
  dicts: [
    "payment_method",
    "direction_of_twist",
    "retail_order_pay_method",
    "sales_order_status",
  ],
  components: {
    Queryfrom,
    Menu,
    DialogTemplate,
    Deliver,
    OutBound,
    RetailProvide,
    OutStock,
  },
  data() {
    return {
      // 提交  表单数据  start
      form: {
        noticeNumber: "", //通知单号
        noticeDate: "", //通知日期
        salesman: "", //销售员
        customerId: "", //客户编号
        drawer: "", //开票员
        dispatchNoteRemark: "", //发货单备注
        billingType: "", //开票类型
        truckRegistration: "", //货车登记
        documentType: "", //单据类型
        sellingUnit: "", //售货单位
        auditOpinion: "", //审核意见
        inventoryBoxNum: "", //库存箱数
        inventoryWeight: "", //库存重量

        batchNumberType: 1, //批次类型
        computeType: 1, //计算方式
      },
      // 提交  表单数据  end
      outStockShow: false, //出库详情弹窗
      totalMoney: "", //合计金额  小写
      createById: "", //创建者id
      salesmanList: [], //销售员列表
      isLeader: false, //当前登录用户是否为领导
      selection: [], //勾选的数据
      // 出库单 start
      outBoundShow: false,
      // 出库单 end
      // 发货 start
      deliverShow: false,
      // 发货 end

      // 出库单  start

      // 出库单  end
      myDelIds: [], //新增接口 删除的id
      // 详情弹窗数据
      detailShow: false,
      printDomData: "",
      // k-form-build组件渲染弹窗
      kOpen: false,
      // 新的自定义数据 start
      orderType: 0, //新的条件查询参数
      productIds: [], //货品Ids
      isEdit: false,
      formData: {
        //订单表数据
        saleNo: "", //合同号
        saleCustomNo: "", //客户编号
        saleDate: "", //销售单日期
        saleOrderEstimatedTime: "", //预计下单时间
        saleLeadTime: "1", //交货周期
        deliveryDate: "", //交货日期
        saleAmounts: "", //合计金额 小写
        saleAmountInWords: "", //合计金额 大写
        salePayType: "2", //支付方式
        earnestMoney: "", //定金
        salesman: "", //业务员
        saleLeader: "", //业务主管
        finance: "", //财务部
        production: "", //生产部
        saleApprover: "", //批准人
        customAddress: "", //客户地址
        customCountryType: "", //国家类型
        contactPerson: "", //联系人
        // 货品明细表数据
        lotNumber: "", //批号
        productNo: "", //货品号
        productName: "", //货品名称
        productNumber: "", //销售数量
        productWeight: "", //销售重量kg
        productUnitPrice: "", //单价
        productAmounts: "", //金额
        sliceType: "", //切片类型
        sliceTypeLabel: "",
        colourNumberLabel: "",
        colours: "", //色号
        remark: "", //备注
        // 工艺表
        orderRemark: "",
      },
      sliceTypeOptions: [], //切片型号选项
      colourNumberOptions: [], //色号选项
      allProductionOptions: [], //所有产品选项
      productionOptions: [],
      customerOptions: [],
      productionTableData: [
        // {
        //   productNo: "", //货品名称
        //   productNumber: 2, //销售数量
        //   productWeight: 1, //销售重量kg
        //   productUnitPrice: 20, //单价
        //   productAmounts: 20, //金额
        //   remark: "", //备注
        // },
      ],
      rules: {
        saleNo: [
          {
            required: true,
            message: "请输入合同号",
            trigger: "blur",
          },
          // {
          //   validator: this.validateOrderNo,
          //   trigger: "blur",
          // },
        ],
        saleDate: [
          {
            required: true,
            message: "请选择日期",
            trigger: "change",
          },
        ],
        // lotNumber: [
        //   {
        //     required: true,
        //     message: "请输入批号",
        //     trigger: "blur",
        //   },
        // ],
        saleCustomNo: [
          {
            required: true,
            message: "请选择客户",
            trigger: "change",
          },
        ],
        salePayType: [
          {
            required: true,
            message: "请选择付款方式",
            trigger: "change",
          },
        ],
        saleOrderEstimatedTime: [
          {
            required: true,
            message: "请选择预计下单时间",
            trigger: "change",
          },
        ],
        saleLeadTime: [
          {
            required: true,
            message: "请输入交货天数",
            trigger: "blur",
          },
        ],
        // earnestMoney: [
        //   {
        //     validator: this.validateEarnestMoney,
        //     trigger: "blur",
        //   },
        // ],
      },

      // end
      // 绑定按钮dialog
      btnDialogVisible: false,
      // 绑定修改dialog
      groupKey: "",
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示统计
      showCount: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 用户表格数据
      tableList: [],
      // 弹出层标题
      title: "",
      // 日期范围
      dateRange: [],
      // cru 弹窗
      open: false,
      // excel共通导入数据
      upload: {
        // 是否显示弹出层
        open: false,
        // 弹出层标题（
        title: "",
        // 是否禁用上传
        isUploading: false,
        // 是否更新已经存在的数据
        updateSupport: 0,
        // 设置上传的请求头部
        headers: { Authorization: "Bearer " + getToken() },
        // 上传的地址
        url: process.env.VUE_APP_BASE_API1 + "common/uploadData",
      },
      // 排序方式 默认降序
      sortOrder: true,
      // 共通查询参数接受子组件的参数
      queryParams: {
        saleOrderTechnologyNo: "retailOrder",
        pageNum: 1, // 第几页
        pageSize: 10, // 每页大小
        orderByColumn: "", // 根据某列排序
        isAsc: "", // desc（降序）或 asc（升序）
        saleOrderOrderType: "",
        status: 100, //订单是否已完成/为完成
        // 基本查询参数
        basicMap: {
          tableName: "drag_form",
        },
        // 当前表字段筛选参数
        queryMap: {
          queryCriteriaValue: "",
        },
      },
      // 列信息
      columns: {},
      // 当前模版信息
      templateInfo: {},
      // 查询条件
      queryFromWhere: {},
      // 当前table唯一标识
      tableKey: null,
      // 当前表名称
      tableName: null,
      //存放html代码块
      iframeUrl: "",
      //存放表单渲染数据
      jsonData: {},
      // 回显表格数据,
      defaultValue: {},
      // 统计card
      statisticList: [],
      // 样式表
      styleList: [],
      // 字典样式对象
      dictStyleObj: {},
      // 操作列 按钮数据
      excuteBtnArr: [],
      // 下拉框动态数据
      dynamicData: {},
      // 当前点击按钮的数据
      currentBtnData: {},
      // 修改选中行
      rowobj: {},
      // 该行的统计信息
      subCount: [],
      tableCount: [],
      // 弹窗新增数据
      addLists: [],
      subTableName: "",
      // 当前点击行的数据
      currentRow: {},
    };
  },

  created() {
    // 得到当前展示的table的唯一标识
    this.tableKey = this.$route.query.tableKey;
    this.getList(this.queryParams);
  },
  watch: {
    totalMoney: {
      handler(newVal, oldVal) {
        if (isNaN(Number(newVal))) {
          this.formData.saleAmountInWords = "零";
        } else {
          const ntc = new numToCapital();
          this.formData.saleAmountInWords = ntc.uppercase(newVal);
        }
      },
      deep: true,
      immediate: true,
    },
  },
  async mounted() {
    await this.getDropDownData();
  },
  computed: {
    isShowExcuteCol() {
      return !this.excuteBtnArr?.every((arr) => arr.children.length == 0);
    },
    ...mapState({
      nickName: (state) => state.user.nickName,
      userInfo: (state) => state.user,
      username: (state) => state.user.name,
    }),
  },
  methods: {
    orderStartChange(status) {
      this.getList(false, status);
    },
    // 零售订单完成回调
    async handleComplate(row) {
      console.log(row);
      let payload = {
        id: row.id,
        status: 6,
        saleNo: row.saleNo,
        completionTime: new Date(),
      };
      let res = await updateOrder(payload);
      if (res.code == 200) {
        this.$message({
          type: "success",
          message: "订单已完成",
        });
        this.getList();
      } else {
        this.$message({
          type: "error",
          message: "订单已完成失败,请稍后再试",
        });
        console.log(res);
      }
    },
    // 更新库存箱数和重量
    async updateStorage(row) {
      let {
        productNo,
        productType,
        lotNumber,
        productName,
        productSpecifications,
        colours,
        specificationsList,
      } = row;

      let productColour = "";
      let targetColor = this.colourNumberOptions.find((item) => {
        return item.colour == colours;
      });
      let productId = "";
      if (specificationsList && specificationsList.length > 0) {
        let targetItem = specificationsList.find(
          (item) => item.productSpecifications == productSpecifications
        );
        productId = targetItem.id;
      }
      if (targetColor) {
        productColour =
          targetColor.materieEncoding + "" + targetColor.materieColorNumber;
      }
      productColour =colours;
      let payload = {
        productId,
        productType,
        lotNum: lotNumber,
        productName,
        productSpecifications,
        productColour,
      };
      if (
        !lotNumber &&
        !productId &&
        !productType &&
        !productName &&
        !productSpecifications &&
        !productColour
      )
        return;
      let res = await getProductInventory(payload);
      if ((res.code = 200)) {
        console.log(res);
        row.inventoryWeight = res.data.inventoryWeight || 0;
        row.inventoryBoxNum = res.data.inventoryBoxNum || 0;
      } else {
        console.log(res);
      }
    },
    // 规格变化回调
    handleSpecificationsChange(row) {
      let { productSpecifications, specificationsList } = row;
      if (productSpecifications) {
        let targetItem = specificationsList.find(
          (item) => item.productSpecifications == productSpecifications
        );
        console.log(targetItem);
        row.productNo = targetItem?.productNo;
        row.productType = targetItem?.productType;
      } else {
        row.productNo = "";
        row.productType = "";
      }
      this.updateStorage(row);
    },
    // 新的产品改变回调
    async newProductChange(productName, row) {
      // 发请求获取对应的规格数据
      if (!productName) {
        row.specificationsList = [];
        (row.productNo = ""), (row.productType = "");
        row.productSpecifications = "";
        return;
      }
      // let targetItem = this.productionOptions.find(
      //   (item) => item.productNo == productNo
      // );
      // row.productName = targetItem?.productName;
      // row.productType = targetItem?.productType;
      // 获取规格数据
      let res = await getProductSpecificationsByProductName({
        productName: productName,
      });
      if (res.code == 200) {
        row.specificationsList = res.data;
        console.log(row.specificationsList);
        let defaultItem = row.specificationsList.find(
          (item) => item.isDefaultSpecifications
        );
        if (defaultItem) {
          row.productSpecifications = defaultItem.productSpecifications;
          row.productNo = defaultItem.productNo;
          row.productType = defaultItem.productType;
        } else {
          row.productSpecifications =
            row.specificationsList[0]?.productSpecifications || "";
          row.productNo = row.specificationsList[0]?.productNo || "";
          row.productType = row.specificationsList[0]?.productType || "";
        }
      } else {
        row.specificationsList = [];
      }
      this.updateStorage(row);
    },
    // 出库单回调
    async myPrintOutBoundHandler(row) {
      console.log("row", row);
      this.currentRow = row;
      this.outBoundShow = true;
      this.$nextTick(() => {
        this.$refs.outBoundRef.getTableData(row);
      });
    },
    // 出库详情回调
    handleOutDetail(row) {
      this.outStockShow = true;
      this.$nextTick(() => {
        this.$refs.outStockRef.getOutStockDetail(row);
      });
    },
    // 业务员改变回调
    salemanChange(val) {
      if (!val) {
        this.createById = "";
        return;
      } else {
        this.createById = this.salesmanList.find(
          (item) => item.value == val
        ).id;
      }
    },
    // 生成合同号
    getSaleNo() {
      let timeStr = moment().format("YYYYMMDD");
      for (var i = 0; i < 5; i++) {
        timeStr += parseInt(Math.random() * 10);
      }
      return timeStr;
    },
    // 自定义筛选方法
    mySelectFilter(value, row) {
      console.log(value);
      // row.productNo = value;
      if (value) {
        let target = [];
        // 在全部列表中查找
        target = this.allProductionOptions.filter((item) =>
          item.productName.includes(value)
        );
        console.log(target);
        if (target.length) {
          this.productionOptions = target;
          return true;
        } else {
          return false;
        }
      } else {
        this.productionOptions = this.allProductionOptions.slice(0, 500);
      }
    },

    // // 出库单回调
    // async myPrintOutBoundHandler(row, data) {
    //   console.log("row", row);
    //   this.currentRow = row;
    //   this.outBoundShow = true;
    //   this.$nextTick(() => {
    //     this.$refs.outBoundRef.getTableData(row);
    //   });
    // },
    // 出库单打印回调
    async outBoundPrintHandler() {
      let res = await this.$refs.outBoundRef.getPrintData();
      console.log(res);
      if (res.flag) {
        res.data.form.printUser = this.nickName;
        outBoundPrint(res.data, "printDom", true);
      }
    },
    // 产品名失焦
    handleProductBlur(productNo) {
      console.log("blur", productNo);
      // if (!productNo) {
      //   this.productionOptions = this.allProductionOptions.slice(0, 500);
      // }
    },
    // 产品名称改变
    handleProductChange(productNo, row) {
      if (!productNo) {
        this.productionOptions = this.allProductionOptions.slice(0, 500);
        return;
      }
      row.productName = this.productionOptions.find(
        (item) => item.productNo == productNo
      )?.productName;
      row.productType = this.productionOptions.find(
        (item) => item.productNo == productNo
      )?.productType;
      this.productionOptions = this.allProductionOptions.slice(0, 500);
    },

    // 重置审计表单数据
    resetFormData() {
      Object.assign(this.formData, {
        //订单表数据
        saleNo: this.getSaleNo(), //合同号
        saleCustomNo: "", //客户编号
        saleDate: moment(new Date()).format("YYYY-MM-DD"), //销售单日期
        saleOrderEstimatedTime: moment(new Date()).format("YYYY-MM-DD"), //预计下单时间
        saleLeadTime: "1", //交货周期
        deliveryDate: moment(new Date()).format("YYYY-MM-DD"),
        saleAmounts: "", //合计金额 小写
        saleAmountInWords: "", //合计金额 大写
        salePayType: "2", //支付方式
        earnestMoney: "",
        salesman: "", //业务员
        saleLeader: "", //业务主管
        finance: "", //财务部
        production: "", //生产部
        saleApprover: "", //批准人
        customAddress: "", //客户地址
        customCountryType: "", //国家类型
        contactPerson: "", //联系人
        // 货品明细表数据
        lotNumber: "", //批号
        productNo: "", //货品号
        productName: "", //货品名称
        productNumber: "", //销售数量
        productWeight: "", //销售重量kg
        productUnitPrice: "", //单价
        productAmounts: "", //金额
        sliceType: "", //切片类型
        sliceTypeLabel: "",
        colourNumberLabel: "",
        colours: "", //色号
        remark: "", //备注
        // 工艺表
        craftGrid: "", //网络
        craftOil: "", //油剂
        craftPackage: "", //卷装
        craftColorFastness: "", //色牢度
        directionOfTwist: "",
        craftOther: "", //其它工艺要求
        craftMark: "", //包装/贴唛
        shippingMethod: "", //运输方式
      });
      this.productionTableData = [];
    },
    // 自定义的小计计算方法
    getSummaries(param) {
      const { columns, data } = param;
      console.log(columns, data);
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "小计";
          return;
        }
        const values = data.map((item) => Number(item[column.property]));
        if (
          index === 1 ||
          index === 2 ||
          index === 3 ||
          index === 4 ||
          index === 7 ||
          index === 8 ||
          index === 9 ||
          index === 10 ||
          index === 11
        ) {
          sums[index] = "";
        } else if (!values.every((value) => isNaN(value))) {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          if (index == 7 || index == 6) {
            sums[index] = sums[index]?.toFixed(2);
          }
          console.log(sums[index], index);
          if (index == 7) {
            this.totalMoney = sums[index];
          }
        } else {
          sums[index] = "N/A";
        }
      });

      return sums;
    },
    // 货品表格数据删除回调
    deleteProduct(index) {
      this.productionTableData.splice(index, 1);
      this.initTableValidate();
    },
    // 货品表格数据新增回调
    addProduct() {
      this.productionTableData.push({
        saleProductNo: uuidv4(),
        productNo: "", //货品编号
        productType: "", //类型
        lotNumber: "", //批号
        productName: "", //货品名称
        productNumber: 0, //销售数量
        productWeight: "", //销售重量kg
        productUnitPrice: 0, //单价
        productAmounts: "", //金额
        sliceType: "022", //切片类型  初始为  切片
        sliceTypeLabel: "",
        colourNumberLabel: "",
        colours: "", //色号
        remark: "", //备注
        specificationsList: [],
        productSpecifications: "", //型号

        inventoryBoxNum: "", //库存箱数
        inventoryWeight: "", //库存重量
      });
      // 添加校验规则
      this.initTableValidate();
    },
    // 自定义校验规则
    validateTableField(rule, value, callback) {
      let { message, field } = rule;
      let index = field.split("-")[1],
        fieldName = field.split("-")[0];
      console.log(
        index,
        fieldName,
        this.productionTableData[Number(index)][fieldName]
      );
      console.log(this.productionTableData);
      if (
        !this.productionTableData[Number(index)][fieldName] &&
        this.productionTableData[Number(index)][fieldName] !== 0 &&
        this.productionTableData[Number(index)][fieldName] !== "0"
      ) {
        callback(new Error(message));
      } else {
        callback();
      }
    },
    // 初始化校验规则
    initTableValidate() {
      let length = this.productionTableData.length;
      for (let i = 0; i < length; i++) {
        this.rules["productNo-" + i] = [
          {
            // required: true,
            message: "请选择货品",
            trigger: "change",
            validator: this.validateTableField,
          },
        ];
        this.rules["productNumber-" + i] = [
          {
            // required: true,
            message: "请输入数量",
            trigger: "blur",
            validator: this.validateTableField,
          },
        ];
        this.rules["productUnitPrice-" + i] = [
          {
            // required: true,
            message: "请输入单价",
            trigger: "blur",
            validator: this.validateTableField,
          },
        ];
        this.rules["sliceType-" + i] = [
          {
            // required: true,
            message: "请选择切片类型",
            trigger: "change",
            validator: this.validateTableField,
          },
        ];
        this.rules["colours-" + i] = [
          {
            // required: true,
            message: "请选择色号",
            trigger: "change",
            validator: this.validateTableField,
          },
        ];
      }
      console.log(this.rules);
    },
    // 客户名称改变回调
    customChangeHandler(val) {
      // if (!val) return;
      let customData = this.customerOptions.find(
        (item) => item.customNo == val
      );
      this.formData.customAddress = customData?.customAddress || "无";
      this.formData.customCountryType = customData?.customCountryType || "无";
      this.formData.contactPerson = customData?.contactPerson || "无";
    },
    // 获取销售员角色列表
    async getRoleUser() {
      try {
        let res = await getRoleUser("salesman");
        if (res.code == 200) {
          this.salesmanList = res.data.map((item) => {
            return {
              label: item.nickName,
              value: item.nickName,
              id: item.userId,
            };
          });
        } else {
          this.$message.error("获取销售员角色列表失败");
        }
      } catch (error) {
        console.log(error);
      }
    },
    //审计新增
    async addHandler() {
      this.isEdit = false;

      await this.getDropDownData();
      // 判断是否是销售员
      console.log(this.userInfo);
      this.isLeader = !this.userInfo.roles.includes("salesman");
      if (!this.isLeader) {
        this.createById = this.userInfo.userId;
      }
      await this.getRoleUser();
      this.resetFormData();

      this.title = "新增零售单";
      this.open = true;
      this.$nextTick(() => {
        this.$refs.formDataRef.resetFields();
        this.formData.orderRemark = "";
        // this.$refs["formDataRef"].clearValidate();
      });
    },
    // 获取下拉框数据
    async getDropDownData() {
      try {
        // let payLoad = [
        //   {
        //     basicMap: {
        //       tableName: "production",
        //     },
        //   },
        //   {
        //     basicMap: {
        //       tableName: "customer",
        //     },
        //   },
        // ];
        // let res = await queryDropDownBoxData(payLoad);

        // 新的获取客户选项数据的接口
        let res = await listCustomer({ isEnablePaging: false });
        if (res.code == 200) {
          // let { customer } = res.data.resultMap;
          // this.allProductionOptions = production || [];
          // this.productionOptions =
          //   this.allProductionOptions.slice(0, 100) || [];
          this.customerOptions = res.rows || [];
        } else {
          throw Error("获取下拉框数据失败");
        }
        let proRes = await getSaleOrderProductionListDistinct();
        if (proRes.code == 200) {
          // let { production, customer } = proRes.data.resultMap;
          this.productionOptions = proRes.data;
        } else {
          throw Error("获取下拉框数据失败");
        }
        let allProRes = await getSaleOrderProductionList();
        if (allProRes.code == 200) {
          this.allProductionOptions = allProRes.data || [];
        } else {
          console.log(allProRes);
        }
      } catch (error) {
        console.log(error);
      }
      // 色号数据
      try {
        let payLoad = [
          {
            basicMap: {
              tableName: "materiel",
            },
            conditionMap: {
              materiel_species: ["1"],
            },
          },
        ];
        // let res = await queryDropDownBoxData(payLoad);
        // let res = await queryMaterielList();
        let res = await productColourList({ isEnablePaging: false });
        if (res.code == 200) {
          // let { materiel } = res.data;
          this.colourNumberOptions = res.rows || [];
        } else {
          throw Error("获取下拉框数据失败");
        }
      } catch (error) {
        console.log(error);
      }
      // 切片型号
      try {
        let payLoad = [
          {
            basicMap: {
              tableName: "materiel",
            },
            conditionMap: {
              materiel_species: ["6"],
            },
          },
        ];
        let res = await queryDropDownBoxData(payLoad);
        if (res.code == 200) {
          console.log(res.data.resultMap);
          let { materiel } = res.data.resultMap;
          this.sliceTypeOptions = materiel || [];
        } else {
          throw Error("获取下拉框数据失败");
        }
      } catch (error) {
        console.log(error);
      }
    },
    //
    // 获取row-key
    getRowKey(row) {
      return row[
        camelCase(this.tableName + "_" + this.templateInfo.template?.primaryKey)
      ];
    },
    /** 查询列表 */
    async getList() {
      this.loading = true;
      try {
        let res = await saleOrderList(this.queryParams);
        console.log(res);
        if (res.code == 200) {
          this.tableList = res.rows;
          console.log(this.dict.type.sales_order_status);
          this.tableList.forEach((item) => {
            item.listClass = this.dict.type.sales_order_status.find(
              (i) => i.value == item.status
            ).raw.listClass;
          });
          this.total = res.total;
        } else {
          this.$message.error(res.msg);
        }
        this.loading = false;
      } catch (error) {
        console.log(error);
        this.loading = false;
      }
    },
    // 校验定金
    validateEarnestMoney(rule, value, callback) {
      console.log(value);
      if (this.formData.salePayType == "1") {
        if (value == "" || value == null || value == undefined) {
          callback(new Error("请输入定金金额"));
        } else {
          callback();
        }
      } else {
        callback();
      }
    },
    // 校验订单号是否有效
    async validateOrderNo(rule, value, callback) {
      console.log(value);
      // let saleNo = this.formData.orderNo;
      // 检验订单号合法
      let checkNoPayload = {
        saleNo: value,
      };
      if (this.isEdit) {
        checkNoPayload.id = this.formData.id;
      }
      let result = await checkOrderNo(checkNoPayload);
      if (result.code == 200) {
        if (result.data) {
          callback();
        } else {
          callback(new Error("合同号已存在"));
        }
      } else {
        callback(new Error("校验失败,请稍后再试"));
      }
    },
    // 校验表格数据
    validateTableData() {
      if (this.productionTableData.length == 0) {
        return {
          res: false,
          msg: "请添加货品明细",
        };
      }
      let res = this.productionTableData.every((item) => {
        return (
          item.productNo &&
          item.productNumber &&
          item.productUnitPrice &&
          item.productAmounts &&
          item.sliceType &&
          item.colours
        );
      });
      if (!res) {
        return {
          res: false,
          msg: "请填写完整货品明细",
        };
      }
      return {
        res: true,
        msg: "",
      };
    },
    // 审计   提交编辑结果按钮回调
    async editConfirm() {
      // let tableValidate = this.validateTableData();
      // if (!tableValidate.res) {
      //   this.$message.warning(tableValidate.msg);
      // }
      this.$refs.formDataRef.validate(async (valid) => {
        if (valid) {
          console.log(valid);

          let {
            id,
            //订单表数据
            saleNo,
            saleCustomNo,
            saleDate,
            saleOrderEstimatedTime,
            saleLeadTime,
            deliveryDate,
            saleAmounts,
            saleAmountInWords,
            salePayType,
            salesman,
            customAddress,
            customCountryType, //国家类型
            contactPerson, //联系人

            // 工艺表数据
            orderRemark,
          } = this.formData;
          let payload = {
            createById: this.createById,
            saleOrderTechnologyNo: "retailOrder",
            saleNo,
            saleCustomNo,
            saleDate,
            saleOrderEstimatedTime,
            saleLeadTime,
            deliveryDate,
            saleAmounts,
            saleAmountInWords,
            salePayType,
            customAddress, //客户地址
            customCountryType, //国家类型
            contactPerson, //联系人
            remark: orderRemark,
            salesman: this.isLeader ? salesman : this.nickName,
            status: 1,
          };
          payload.saleProductsList = this.productionTableData;

          // 准备  提交  数据 start
          this.form.saleCustomNo = saleCustomNo;
          this.form.salesman = salesman;
          this.form.noticeDate = moment(new Date()).format("YYYY-MM-DD");
          this.form.drawer = this.username;
          this.form.documentType = "1";
          this.form.billingType = "1";
          this.form.saleOrderNo = saleNo;
          this.form.dispatchNoteRemark = orderRemark;
          this.form.customerId = this.customerOptions.find(
            (item) => item.customNo == saleCustomNo
          )?.id;
          // 准备  提交  数据 end
          if (this.isEdit) {
            payload.id = id;
            payload.truckRegistration = this.form.truckRegistration;
            delete payload.status;
            let res = await editRetailOrder(payload);
            if (res.code === 200) {
              this.$message.success("修改成功");
              this.open = false;
              this.getList();
            } else {
              this.$message.error("修改失败");
            }
          } else {
            //新增
            payload.orderType = 1;
            let res = await addRetailOrder(payload);
            if (res.code == 200) {
              // 准备新增时 提交  数据 start
              this.form.noticeNumber = this.getOrderNo();
              this.form.status = 5;
              this.form.id = res.data;
              // 提交 新增接口
              let result = await submitRetailOrder({
                ...this.form,
                saleProductInfoList: this.productionTableData,
              });
              if (result.code == 200) {
                this.$message.success("提交成功");
                this.open = false;
                this.getList();
              } else {
                this.$message.error("提交失败");
              }
              // 准备新增时 提交  数据 end
            } else {
              this.$message.error("添加失败");
            }
          }
          // Object.keys(saleValue).map((k) => {
          //   saleData.commMap[k] = saleValue[k];
          // });
        } else {
          this.$message.warning("请填写完整信息");
        }
      });
    },
    // 单号生成
    getOrderNo() {
      let year = new Date().getFullYear();
      let month = new Date().getMonth() + 1;
      let day = new Date().getDate();
      if (month < 10) {
        month = "0" + month;
      }
      if (day < 10) {
        day = "0" + day;
      }
      let hour = new Date().getHours();
      let minute = new Date().getMinutes();
      let second = new Date().getSeconds();
      if (hour < 10) {
        hour = "0" + hour;
      }
      if (minute < 10) {
        minute = "0" + minute;
      }
      if (second < 10) {
        second = "0" + second;
      }
      let orderNo = year + month + day + hour + minute + second;
      return orderNo;
    },
    // 审计   编辑回调
    async handleEdit(index, row) {
      console.log(row);
      let { saleOrderSaleNo } = row;
      try {
        let payLoad = [
          {
            basicMap: {
              tableName: "sale_order",
            },
            conditionMap: {
              sale_no: [saleOrderSaleNo],
            },
          },
          {
            basicMap: {
              tableName: "sale_products",
            },
            conditionMap: {
              sale_order_no: [saleOrderSaleNo],
            },
          },
          {
            basicMap: {
              tableName: "sale_craft",
            },
            conditionMap: {
              sale_order_no: [saleOrderSaleNo],
            },
          },
        ];
        let res = await queryDropDownBoxData(payLoad);
        if (res.code == 200) {
          this.isEdit = true;
          let { sale_craft, sale_order, sale_products } = res.data.resultMap;

          Object.assign(this.formData, {
            ...sale_craft[0],
            ...sale_order[0],
          });
          let { saleDate, saleOrderEstimatedTime, deliveryDate } =
            sale_order[0];
          saleDate && (this.formData.saleDate = new Date(saleDate));
          saleOrderEstimatedTime &&
            (this.formData.saleOrderEstimatedTime = saleOrderEstimatedTime);
          deliveryDate && (this.formData.deliveryDate = new Date(deliveryDate));

          this.productIds = sale_products.map((item) => item.saleProductNo);

          await this.getDropDownData();
          this.productionTableData = sale_products.map((item) => {
            item.productType = this.allProductionOptions.find(
              (i) => item.productNo == i.productNo
            )?.productType;
            return item;
          });
          if (this.formData.saleCustomNo) {
            this.customChangeHandler(this.formData.saleCustomNo);
          }
          this.title = "编辑审计单";
          this.open = true;
        }
      } catch (error) {
        console.log(error);
      }
    },
    // 审计   批量删除回调
    async batchDelete() {
      if (!this.ids.length) return;
      try {
        await this.$confirm("是否确认删除选中的数据？", "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        });
        let orderPayload = {
          basicMap: {
            tableName: "sale_order",
          },
          conditionMap: {
            saleNo: this.ids,
          },
        };
        let productsPayload = {
          basicMap: {
            tableName: "sale_products",
          },
          conditionMap: {
            saleOrderNo: this.ids,
          },
        };
        let craftPayload = {
          basicMap: {
            tableName: "sale_craft",
          },
          conditionMap: {
            saleOrderNo: this.ids,
          },
        };
        let orderRes = await delTableData(orderPayload);
        // let productRes = await delTableData(productsPayload);
        // let craftRes = await delTableData(craftPayload);
        if (orderRes.code == 200) {
          this.$message.success("删除成功");
          this.getList();
        } else {
          this.$message.error("删除失败");
          throw Error("删除失败");
        }
        this.ids = [];
        this.$refs.tableRef.clearSelection();
      } catch (error) {
        console.log(error);
      }
    },
    // 计算金额
    computedPrice(row) {
      let { productNumber, productUnitPrice } = row;
      console.log(
        "productNumber, productUnitPrice",
        productNumber,
        productUnitPrice
      );
      row.productAmounts = (
        Number(productNumber) * Number(productUnitPrice)
      ).toFixed(2);
    },
    isUpperCase(char) {
      return char === char.toUpperCase();
    },
    // 下划线命名转驼峰命名
    toUnderScoreCase(str) {
      if (str === null) {
        return null;
      }
      let sb = "";
      // 前置字符是否大写
      let preCharIsUpperCase = true;
      // 当前字符是否大写
      let curreCharIsUpperCase = true;
      // 下一字符是否大写
      let nexteCharIsUpperCase = true;
      for (let i = 0; i < str.length; i++) {
        let c = str.charAt(i);
        if (i > 0) {
          preCharIsUpperCase = isUpperCase(str.charAt(i - 1));
        } else {
          preCharIsUpperCase = false;
        }

        curreCharIsUpperCase = isUpperCase(c);

        if (i < str.length - 1) {
          nexteCharIsUpperCase = isUpperCase(str.charAt(i + 1));
        }

        if (
          preCharIsUpperCase &&
          curreCharIsUpperCase &&
          !nexteCharIsUpperCase
        ) {
          sb += SEPARATOR;
        } else if (i !== 0 && !preCharIsUpperCase && curreCharIsUpperCase) {
          sb += SEPARATOR;
        }
        sb += c.toLowerCase();
      }

      return sb;
    },
    // 处理列表信息
    columnsHandler(columns) {
      let resArr = [];
      console.log(columns, 111);
      columns.forEach((item) => {
        for (const key in item) {
          let tempObj = {};
          tempObj.key = camelCase(key);
          tempObj.value = item[key];
          resArr.push(tempObj);
        }
      });
      console.log(resArr, 222);
      return resArr;
    },
    // 取消按钮
    cancel() {
      this.open = false;
      // this.reset();
    },
    // k-form-build 取消按钮
    kCancel() {
      this.kOpen = false;
      // this.reset();
    },
    // 分页查询
    pageList(row) {
      // 调用子组件-》携带子组件参数请求后台
      this.$refs.mychild.pageList(
        row == undefined
          ? {
              limit: this.queryParams.pageSize,
              page: this.queryParams.pageNum,
            }
          : row
      );
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      // this.ids = selection.map(
      //   (item) =>
      //     item[
      //       camelCase(
      //         this.tableName + "_" + this.templateInfo.template?.primaryKey
      //       )
      //     ]
      // );
      this.selection = selection;
      this.myDelIds = selection.map((item) => item.id);
      console.log(this.myDelIds);
      this.ids = selection.map((item) => item.saleOrderSaleNo);
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },

    // 更多操作触发
    handleCommand(command, row) {
      switch (command) {
        case "handleResetPwd":
          this.handleResetPwd(row);
          break;
        case "handleAuthRole":
          this.handleAuthRole(row);
          break;
        default:
          break;
      }
    },
    /** 新增按钮操作 */
    handleAdd(row) {
      // this.reset();
      this.defaultValue = {};
      getInfoBySqlKey(this.templateInfo.template.sqlKey).then(({ data }) => {
        if (!data || !data.dfVueTemplate) {
          this.jsonData = false;
          this.$message.error("当前表格未绑定表单!");
          return;
        }
        if (data.dfFormSql) {
          let dynamicData = JSON.parse(data.dfFormSql);
          Object.assign(this.dynamicData, dynamicData);
        }
        this.jsonData = JSON.parse(data.dfVueTemplate);
        this.open = true;
        this.title = "添加信息";
        this.form.password = this.initPassword;
        this.$nextTick(() => {
          this.$refs.addFromRef.reset();
          inputDisableComplete();
        });
      });
    },
    longestCommonSubstring(strs) {
      if (!strs || strs.includes("")) return "";
      let str1_Length = strs[0].length;
      let str_Nums = strs.length;
      let flag = 0;
      for (let i = 0; i < str1_Length && flag == 0; i++) {
        let char = strs[0][i];
        for (var j = 1; j < str_Nums; j++) {
          if (char !== strs[j][i] || i == strs[j].length) {
            return strs[1].substring(0, i);
          }
        }
      }
      return strs[0];
    },
    // 绑定dialog对话框关闭
    handleClose() {
      this.btnDialogVisible = false;
    },
    getLastUppercaseWord(text) {
      const pattern = /\b[A-Z][a-z]*\b/g;
      const matches = [...text.matchAll(pattern)];
      if (matches.length > 0) {
        const lastMatch = matches[matches.length - 1][0];
        return lastMatch;
      } else {
        return null;
      }
    },
    // 初始化数据
    async initData(data) {
      let {
        id,
        //订单表数据
        saleNo,
        saleCustomNo,
        saleDate,
        saleOrderEstimatedTime,
        saleLeadTime,
        deliveryDate,
        saleAmounts,
        saleAmountInWords,
        salePayType,
        salesman,
        customAddress,
        customCountryType, //国家类型
        contactPerson, //联系人
        truckRegistration, //货车登记

        // 工艺表数据
        remark,

        // 产品列表
        saleProductsList,
      } = data;
      this.form.truckRegistration = truckRegistration;
      Object.assign(this.formData, {
        id,
        //订单表数据
        saleNo,
        saleCustomNo,
        saleDate,
        saleOrderEstimatedTime,
        saleLeadTime,
        deliveryDate,
        saleAmounts,
        saleAmountInWords,
        salePayType,
        salesman,
        customAddress,
        customCountryType, //国家类型
        contactPerson, //联系人

        // 工艺表数据
        orderRemark: remark,
      });
      this.customChangeHandler(saleCustomNo);
      let promiseArr = [],
        promiseArr2 = [];
      this.productionTableData = saleProductsList.map((item, index) => {
        let {
          id,
          saleProductNo,
          productNo, //货品编号
          productName, //货品名称
          productNumber, //销售数量
          productWeight, //销售重量kg
          productUnitPrice, //单价
          productAmounts, //金额
          sliceType, //切片类型  初始为  切片
          sliceTypeLabel,
          colourNumberLabel,
          colours, //色号
          remark, //备注
          lotNumber, //批号
        } = item;
        let targetItem = this.allProductionOptions.find(
          (i) => item.productNo == i.productNo
        );
        // item.productType = targetItem?.productType;
        let productType = targetItem?.productType;
        let productSpecifications = targetItem?.productSpecifications;
        promiseArr[index] = getProductSpecificationsByProductName({
          productName: item.productName,
        });
        promiseArr2[index] = getProductInventory({
          productNo,
          productType,
          lotNumber,
          productName,
          productSpecifications,
        });
        return {
          id,
          saleProductNo,
          productSpecifications, //规格
          productNo, //货品编号
          productType, //类型
          productName, //货品名称
          productNumber, //销售数量
          productWeight, //销售重量kg
          productUnitPrice, //单价
          productAmounts, //金额
          sliceType, //切片类型  初始为  切片
          sliceTypeLabel,
          colourNumberLabel,
          colours, //色号
          remark,
          lotNumber,
          inventoryBoxNum: 0,
          inventoryWeight: 0,
          specificationsList: [],
        };
      });
      let promiseRes = await Promise.all(promiseArr);
      promiseRes.forEach((item, index) => {
        this.productionTableData[index].specificationsList = item.data;
      });
      let promiseRes2 = await Promise.all(promiseArr2);
      promiseRes2.forEach((item, index) => {
        this.productionTableData[index].inventoryWeight =
          item.data.inventoryWeight || 0;
        this.productionTableData[index].inventoryBoxNum =
          item.data.inventoryBoxNum || 0;
      });
      // this.productionTableData.forEach((item, index) => {
      //   item.inventoryWeight=promiseArr2[index].
      // });

      this.initTableValidate();
    },
    /** 修改按钮操作 */
    async handleUpdate(row) {
      console.log(row);
      this.isEdit = true;
      await this.getDropDownData();
      this.isLeader = !this.userInfo.roles.includes("salesman");
      if (!this.isLeader) {
        this.createById = this.userInfo.userId;
      }
      await this.getRoleUser();
      this.title = "修改零售单";
      try {
        let res = await getRetailOrderInfo(row.id);
        console.log(res);
        if (res.code == 200) {
          this.initData(res.data);
          this.open = true;
        } else {
          this.$message.error(res.msg);
        }
      } catch (error) {
        console.log(error);
      }
    },
    //详情  打印回调
    async handlePrint(row) {
      await this.getDropDownData();
      this.isLeader = !this.userInfo.roles.includes("salesman");
      if (!this.isLeader) {
        this.createById = this.userInfo.userId;
      }
      await this.getRoleUser();
      try {
        let res = await getRetailOrderInfo(row.id);
        console.log(res);
        if (res.code == 200) {
          await this.initData(res.data);
          this.printDomData = this.getPrintDom(res.data);
          this.detailShow = true;
          this.$nextTick(() => {
            this.$refs.detailTable.innerHTML = this.printDomData;
          });
        } else {
          this.$message.error(res.msg);
        }
      } catch (error) {
        console.log(error);
      }
    },
    // 提交  回调
    async handleSubmit(row) {
      this.deliverShow = true;
      this.$nextTick(() => {
        this.$refs.deliverRef.productInvoiceInfo(row);
      });
    },
    // 取消提交
    async handleSubmitCancel(row) {
      console.log(row);
      this.$confirm("此操作将撤回该次提交, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(async () => {
          // this.$message({
          //   type: 'success',
          //   message: '删除成功!'
          // });
          try {
            let { saleNo } = row;
            let payLoad = {
              saleOrderNo: saleNo,
              status: 1,
            };
            let res = await cancelRetailOrder(payLoad);
            if (res.code == 200) {
              this.$message.success("取消成功");
              this.getList();
            } else {
              this.$message.error("取消失败");
              console.log(res);
            }
          } catch (error) {
            console.log(error);
          }
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消",
          });
        });
    },
    // 获取打印dom
    getPrintDom(data) {
      let {
        id,
        //订单表数据
        saleNo,
        saleCustomNo,
        saleDate,
        saleOrderEstimatedTime,
        saleLeadTime,
        deliveryDate,
        saleAmounts,
        saleAmountInWords,
        salePayType,
        salesman,
        customAddress,
        customCountryType, //国家类型
        contactPerson, //联系人

        // 工艺表数据
        orderRemark,
      } = this.formData;
      console.log(this.form, this.productionTableData);
      let { truckRegistration } = this.form;
      let customData = this.customerOptions.find(
        (item) => item.customNo == saleCustomNo
      );
      let customerName = customData ? customData.customName : "";
      let printStr = `
        <table style="width:1200px; border-collapse:collapse;" border="1" cellpadding="10" align="center">
            <div style="text-align:center;font-size: 20px;">诸暨市新丝维纤维有限公司</div>
            <div style="text-align:center;">销售合同审计单</div>
            <tbody>
                <tr>
                    <td width="600px" colspan="4">合同号：${saleNo}</td>
                    <td width="600px" colspan="5">日期：${saleDate.replace(
                      "T",
                      " "
                    )}</td>
                </tr>
                <tr align="center">
                    <td width="300px" colspan="2">客户名称：</td>
                    <td width="300px" colspan="3">${customerName}</td>
                    <td colspan="2">业务员：</td>
                    <td colspan="2">${salesman}</td>

                </tr>
                <tr align="center">
                    <td width="300px" colspan="2">客户地址：</td>
                    <td width="300px" colspan="3">${customAddress}</td>
                    <td width="300px" colspan="2">客户国别：</td>
                    <td width="300px" colspan="2">${customCountryType}</td>
                </tr>
                <tr align="center">
                    <td width="300px" colspan="2">联系人：</td>
                    <td width="150px" colspan="2">${contactPerson}</td>
                    <td  colspan="2">合计金额（大写）：</td>
                    <td colspan="3">${saleAmountInWords}</td>
                </tr>
                <tr align="center">
                    <td colspan="9">货品明细</td>
                </tr>
                <tr align="center">
                    <td width="150px">品名</td>
                    <td width="100px">规格</td>
                    <td width="100px">色号</td>
                    <td width="100px">类型</td>
                    <td width="100px">批号</td>
                    <td width="100px">箱数</td>
                    <td width="100px">单价</td>
                    <td width="100px">金额</td>
                    <td width="100px">备注</td>
                </tr>`;
      let amountTotal = 0,
        singlTotal = 0,
        moneyTotal = 0;
      for (let i = 0; i < this.productionTableData.length; i++) {
        let item = this.productionTableData[i];
        amountTotal += Number(item.productNumber);
        singlTotal += Number(item.productUnitPrice);
        moneyTotal += Number(item.productAmounts);
        let productData = this.allProductionOptions.find(
          (pro) => pro.productNo == item.productNo
        );
        item.sliceTypeLabel =
          this.sliceTypeOptions.find((k) => k.materielCode == item.sliceType)
            ?.materielName || "";
        // item.colourNumberLabel = this.colourNumberOptions.find(
        //   (k) => k.colour == item.colours
        // )?.colour;
        item.colourNumberLabel = item.colours;
        let productName = productData ? productData.productName : "";
        let productType = productData ? productData.productType : "";
        printStr += `<tr align="center">
                    <td>${item.productName}</td>
                    <td>${item.productSpecifications}</td>
                    <td>${item.colourNumberLabel}</td>
                    <td>${item.productType}</td>
                    <td>${item.lotNumber}</td>
                    <td>${item.productNumber}</td>
                    <td>${item.productUnitPrice}</td>
                    <td>${item.productAmounts}</td>
                    <td>${item.remark}</td>
                </tr>`;
      }
      // 计算小计
      amountTotal = amountTotal;
      singlTotal = singlTotal.toFixed(2);
      moneyTotal = moneyTotal.toFixed(2);
      printStr += `
        <tr align="center">
          <td>小计：</td>
           <td></td>
           <td></td>
          <td></td>
          <td></td>
          <td>${amountTotal}</td>
          <td>${singlTotal}</td>
          <td>${moneyTotal}</td>
          <td></td>
        </tr>`;
      printStr += `<tr align="left">
                    <td colspan="9">订单备注:${orderRemark}</td>
                </tr>
                </tbody>
        </table>`;
      return printStr;
    },
    // 添加真正的字段名
    addRealFieldName(row) {
      let fieldList = Object.keys(row);
      // let tableName = this.longestCommonSubstring(fieldList);
      let tableName = camelCase(this.tableName);
      fieldList.forEach((field) => {
        let realField = field.replace(tableName, "");
        realField = realField[0].toLocaleLowerCase() + realField.substring(1);
        row[realField] = row[field];
      });
    },

    /** 提交按钮 */
    submitForm: function () {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.userId != undefined) {
            updateUser(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addUser(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 删除按钮操作
     *
     * 删除提示信息语句（标识）
     * */
    handleDelete(row, btnData) {
      let delIds = this.ids;
      let primary = camelCase(this.templateInfo.template?.primaryKey);
      // let realyKey=
      this.addRealFieldName(row);
      if (row[primary] != undefined && row[primary] != null) {
        delIds = [];
        delIds.push(row[primary]);
      }
      let data = {
        basicMap: {
          btnType: btnData.btnType,
          btnKey: btnData.btnKey,
          tableName: this.tableName,
        },
        conditionMap: {
          // id: delIds,
        },
        btnParametersMap: {},
      };
      if (this.currentBtnData.btnParams) {
        let btnParams =
          JSON.parse(this.currentBtnData.btnParams)?.commonFieldData || [];
        let conditionData =
          JSON.parse(this.currentBtnData.btnParams).conditionData || [];
        conditionData.forEach((item) => {
          data.conditionMap[item.fieldName.split(".")[1]] = item.fieldValue
            ? item.fieldValue
            : this.currentRow[camelCase(item.fieldName.replace(".", "_"))];
        });
        btnParams.forEach((item) => {
          data.btnParametersMap[item.fieldName.split(".")[1]] = item.fieldValue
            ? item.fieldValue
            : this.currentRow[camelCase(item.fieldName.replace(".", "_"))];
        });
      }
      // data.conditionMap[this.templateInfo.template?.primaryKey] = delIds;
      this.$modal
        .confirm('是否确认删除"' + delIds + '"的数据项？')
        .then(function () {
          // return delTableData(data);
          return btnCommonApi(data);
        })
        .then(() => {
          // 调用子组件查询方法 目的是携带上子组件中的查询参数
          this.$refs.mychild.pageList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    // 批量删除接口
    handleBatchDelete() {
      let delIds = this.ids;
      let primary = camelCase(this.templateInfo.template?.primaryKey);
      // if (row && row[primary] != undefined && row[primary] != null) {
      //   delIds = [];
      //   delIds.push(row[primary]);
      // }
      let data = {
        basicMap: {
          tableName: this.tableName,
        },
        conditionMap: {
          // id: delIds,
        },
      };
      // if (this.currentBtnData.btnParams) {
      //   let btnParams = JSON.parse(this.currentBtnData.btnParams);
      //   btnParams.forEach((item) => {
      //     data.btnParametersMap[
      //       this.formatField(item.fieldName, camelCase(this.tableName))
      //     ] = item.fieldValue
      //       ? item.fieldValue
      //       : this.currentRow[item.fieldName];
      //   });
      // }
      data.conditionMap[this.templateInfo.template?.primaryKey] = delIds;
      this.$modal
        .confirm('是否确认删除"' + delIds + '"的数据项？')
        .then(function () {
          return delTableData(data);
          // return btnCommonApi(data);
        })
        .then(() => {
          // 调用子组件查询方法 目的是携带上子组件中的查询参数
          this.$refs.mychild.pageList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    /** 导出按钮操作 */
    handleExport() {
      let primary = "saleOrderId";
      let realyKey = "saleOrderId";
      if (this.myDelIds.length > 0) {
        this.queryParams["execlMap"] = [];
        this.myDelIds.forEach((item) => {
          this.queryParams.execlMap.push(
            this.tableList.find((ttem) => {
              return ttem[realyKey] === item;
            })
          );
        });
      } else {
        this.$message.warning("请至少勾选一条导出数据");
        return;
      }
      this.queryParams.execlMap = JSON.stringify(this.queryParams.execlMap);
      this.download(
        process.env.VUE_APP_BASE_API1 + "common/export",
        {
          ...this.queryParams,
        },
        `文件名称_${new Date().getTime()}.xlsx`
      );
    },
    /** 导入按钮操作 */
    handleImport() {
      this.upload.title = "当前导入";
      this.upload.open = true;
    },
    /** 下载模板操作 */
    importTemplate() {
      this.download(
        process.env.VUE_APP_BASE_API1 +
          `common/exportTemplate?tableName=${this.tableName}&sqlkey=${this.templateInfo.template.sqlKey}`,
        {},
        `下载模版名称${new Date().getTime()}.xlsx`
      );
    },
    // 文件上传中处理
    handleFileUploadProgress(event, file, fileList) {
      this.upload.isUploading = true;
    },
    // 文件上传成功处理
    handleFileSuccess(response, file, fileList) {
      this.upload.open = false;
      this.upload.isUploading = false;
      this.$refs.upload.clearFiles();
      this.$alert(
        "<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" +
          response.msg +
          "</div>",
        "导入结果",
        { dangerouslyUseHTMLString: true }
      );
      this.$refs.mychild.pageList({
        limit: this.queryParams.pageSize,
        page: this.queryParams.pageNum,
      });
    },
    //重点在这里
    handleChange(file, fileList) {
      file.name = this.tableName + "." + file.name.split(".")[1];
      fileList.forEach((item) => {
        item.name = this.tableName + "." + file.name.split(".")[1];
      });
      let newFile = new File(
        [file],
        this.tableName + "." + file.name.split(".")[1]
      ); //创建出来也是不可编辑的file对象
    },
    // 提交上传文件
    submitFileForm() {
      this.$refs.upload.submit();
    },
    // 弹窗新增的数
    addListHandler(val) {
      this.addLists.push(...val);
    },
    // 绑定弹窗Dialog确定按钮
    async btnComfirm() {
      let res = await this.$refs.deliverRef.getAllData();
      let { flag, isEdit, data } = res;
      if (flag) {
        // if (isEdit) {
        //   //编辑
        //   let payLoad = {
        //     ...data.formData,
        //     saleProductInfoList: data.tableData,
        //   };
        //   let res = await updateProductInvoice(payLoad);
        //   if (res.code == 200) {
        //     this.$message.success("修改成功");
        //     this.deliverShow = false;
        //     this.getList();
        //   } else {
        //     this.$message.error("网络异常");
        //   }
        // } else {
        //新增
        let payLoad = {
          ...data.formData,
          saleProductInfoList: data.tableData,
        };

        // let res = await addProductInvoice(payLoad);
        let reqAPI = isEdit ? submitProductInvoice : submitRetailOrder;
        if (!isEdit) {
          payLoad.status = 5;
        }
        let res = await reqAPI(payLoad);
        if (res.code == 200) {
          this.$message.success("提交成功");
          this.deliverShow = false;
          this.getList();
        } else {
          this.$message.error("网络异常");
        }
        // }
      }
    },
    // 保存提交数据
    async btnSave() {
      let res = await this.$refs.deliverRef.getAllData();
      let { flag, isEdit, data } = res;
      if (flag) {
        let payLoad = {
          ...data.formData,
          saleProductInfoList: data.tableData,
        };
        payLoad.status = 1;
        let res = await updateProductInvoice(payLoad);
        if (res.code == 200) {
          this.$message.success("保存成功");
          this.deliverShow = false;
          this.getList();
        } else {
          this.$message.error("网络异常");
        }
        // }
      }
    },
    // 去掉表名 开头字母小写
    formatField(field = "", tableName) {
      let temp = field.replace(tableName, "");
      return toUnderline(temp[0].toLowerCase() + temp.slice(1));
    },
    //提交编辑结果按钮回调
    async editConfirmHandler() {
      if (this.$refs.addFromRef) {
        this.$refs.addFromRef
          .getData()
          .then(async (values) => {
            let data = {
              basicMap: {
                tableName: this.tableName,
                // btnKey: btnData.btnKey,
                btnKey: this.currentBtnData.btnKey,
              },
              addListMap: [values],
              conditionMap: {},
              commMap: {},
              btnParametersMap: {},
            };
            if (this.currentBtnData.btnParams) {
              let btnParams =
                JSON.parse(this.currentBtnData.btnParams)?.commonFieldData ||
                [];
              let conditionData =
                JSON.parse(this.currentBtnData.btnParams).conditionData || [];
              // let
              btnParams.forEach((item) => {
                data.btnParametersMap[item.fieldName.split(".")[1]] =
                  item.fieldValue
                    ? item.fieldValue
                    : this.currentRow[
                        camelCase(item.fieldName.replace(".", "_"))
                      ];
              });
              conditionData.forEach((item) => {
                data.conditionMap[item.fieldName.split(".")[1]] =
                  item.fieldValue
                    ? item.fieldValue
                    : this.currentRow[
                        camelCase(item.fieldName.replace(".", "_"))
                      ];
              });
            }
            if (Object.keys(this.defaultValue).length) {
              // data.conditionMap[this.templateInfo.template?.primaryKey] =
              //   this.defaultValue[this.templateInfo.template?.primaryKey];
              Object.keys(values).map((k) => {
                data.commMap[k] = values[k];
              });
              data.basicMap.btnType = this.currentBtnData.btnType;
              data.basicMap.visible = true;
            } else {
              data.basicMap.btnType = "INSERT";
              data.basicMap.visible = true;
            }
            try {
              let res = await btnCommonApi(data);
              if (res.code == 200) {
                this.$message.success("操作成功");
              } else {
                this.$message.error("网络异常,请稍后再试");
              }
            } catch (error) {
              console.log(error);
              this.$message.error("网络异常,请稍后再试");
            }
            this.getList();
            this.defaultValue = {};
            this.kOpen = false;
          })
          .catch((res) => {
            console.log(res);
            this.$modal.msgError("表单校验失败,请规范填写数据");
          });
      } else {
        // 没有绑定表单
        let data = {
          basicMap: {
            tableName: this.tableName,
            // btnKey: btnData.btnKey,
            btnKey: this.currentBtnData.btnKey,
            btnType: this.currentBtnData.btnType,
            visible: true,
          },
          addListMap: [],
          conditionMap: {},
          commMap: {},
          btnParametersMap: {},
        };
        if (this.currentBtnData.btnParams) {
          let btnParams =
            JSON.parse(this.currentBtnData.btnParams)?.commonFieldData || [];
          let conditionData =
            JSON.parse(this.currentBtnData.btnParams).conditionData || [];
          conditionData.forEach((item) => {
            data.conditionMap[item.fieldName.split(".")[1]] = item.fieldValue
              ? item.fieldValue
              : this.currentRow[camelCase(item.fieldName.replace(".", "_"))];
          });
          btnParams.forEach((item) => {
            data.btnParametersMap[item.fieldName.split(".")[1]] =
              item.fieldValue
                ? item.fieldValue
                : this.currentRow[camelCase(item.fieldName.replace(".", "_"))];
          });
        }
        // data.basicMap.btnType = this.currentBtnData.btnType;
        // data.basicMap.visible = true;
        try {
          let res = await btnCommonApi(data);
          if (res.code == 200) {
            this.$message.success("操作成功");
          } else {
            this.$message.error("网络异常,请稍后再试");
          }
        } catch (error) {
          console.log(error);
          this.$message.error("网络异常,请稍后再试");
        }
        this.getList();
        this.defaultValue = {};
        this.kOpen = false;
      }
    },
    // 使用提交数据类型的按钮获取数据
    tempSubBtn(getData) {
      getData()
        .then((values) => {
          console.log("验证通过", values);
        })
        .catch(() => {
          console.log("验证未通过，获取失败");
        });
    },
    // 判断是否生效行样式
    cellStyle({ row, column, rowIndex, columnIndex }) {
      let rowStyleList = this.styleList.filter((item) => item.styleType == 0);
      if (!rowStyleList.length) return "";
      let mainTableName = this.templateInfo.querySql.tableAlias; //主表名
      for (let i = 0; i < rowStyleList.length; i++) {
        let item = rowStyleList[i];
        let judgeRes = this.determineCondition(item.styleCondtion, row);
        if (judgeRes) {
          let styleCode = JSON.parse(item.styleCode);
          return `background-color:${styleCode.rowBgColor};`;
        }
      }
    },

    // 获取生效条件组结果
    determineCondition(conditionStr, row) {
      let conditionList = JSON.parse(conditionStr);
      if (!conditionList.length) return false;
      return conditionList.every((item) => this.judgeOneCondition(item, row));
    },

    // 获取单个判断条件结果
    judgeOneCondition(item, row) {
      let fullField = camelCase(item.tableName + "_" + item.fieldName);
      switch (item.condition) {
        case 1:
          return row[fullField] > item.flagValue;
        case 2:
          return row[fullField] < item.flagValue;
        case 3:
          return row[fullField] == item.flagValue;
        case 4:
          return row[fullField] >= item.flagValue;
        case 5:
          return row[fullField] <= item.flagValue;
        default:
          return true; //默认为true
      }
    },

    // 设置表格字段样式
    async setFieldStyleData(tableList) {
      console.log(JSON.parse(JSON.stringify(tableList)));
      let fieldConditionList = this.styleList.filter(
        (item) => item.styleType == 1 || item.styleType == 2
      );
      if (!fieldConditionList.length) return tableList;
      let res = await this.setDictStyleData();

      this.dictStyleObj = res.reduce((pre, item) => {
        return {
          ...pre,
          ...item,
        };
      }, {});
      // console.log("this.dictStyleObj", this.dictStyleObj);
      tableList.forEach((row) => {
        // if (!row.styleFieldObj) row.styleFieldObj = {};
        for (let i = 0; i < fieldConditionList.length; i++) {
          let item = fieldConditionList[i];
          if (item.styleType == 1) {
            //字段样式
            let judgeRes = this.determineCondition(item.styleCondtion, row);
            if (judgeRes) {
              let styleCode = JSON.parse(item.styleCode);
              if (!row.styleFieldObj) row.styleFieldObj = {};
              row.styleFieldObj[item.styleField] = {
                styleType: item.styleType,
                fieldStyleType: styleCode.fieldStyleType,
                fontColor: styleCode.fontColor,
                isTagFullBg: styleCode.isTagFullBg,
                tagType: styleCode.tagType,
              };
              // row.styleField = item.styleField; //样式生效字段
              // row.styleType = item.styleType; //0:行样式 1:字段样式 2:字典样式
              // row.fieldStyleType = styleCode.fieldStyleType; //0:文本  1:标签
              // row.fontColor = styleCode.fontColor;
              // row.isTagFullBg = styleCode.isTagFullBg; //true/false
              // row.tagType = styleCode.tagType; //string
            }
          } else {
            //字典样式
            let dicStyle = this.dictStyleObj[item.styleField]?.find((dict) => {
              return dict.dictValue == row[item.styleField];
            });
            if (dicStyle) {
              if (!row.styleFieldObj) row.styleFieldObj = {};
              row.styleFieldObj[item.styleField] = dicStyle; //设置该字段应该显示的字典样式
              row.styleFieldObj[item.styleField].styleType = 2;
            }
          }
        }
      });
      return tableList;
    },

    //设置表格字典相关数据
    setDictStyleData() {
      let fieldConditionList = this.styleList.filter(
        (item) => item.styleType == 2
      );
      if (!fieldConditionList.length) return;
      let PromiseList = fieldConditionList.map((item) => {
        return new Promise((resolve, reject) => {
          let temp = {};
          try {
            listData({
              isEnablePaging: false,
              dictType: item.styleCondtion,
            }).then((res) => {
              temp[item.styleField] = res.rows;
              resolve(temp);
            });
          } catch (error) {
            reject(error);
          }
        });
      });
      return Promise.all(PromiseList);
    },

    // 内链页面跳转
    routerHandler(btnData, type) {
      let { url, commonFieldData } = JSON.parse(btnData.btnParams);
      let tempArr = [];
      if (commonFieldData) {
        let queryArr = JSON.parse(commonFieldData);

        tempArr = queryArr.map((item) => {
          let key = this.formatField(item.fieldName, camelCase(this.tableName));
          let value = item.fieldValue
            ? item.fieldValue
            : this.currentRow[item.fieldName];
          return key + "=" + value;
        });
      }
      if (tempArr.length) {
        url += "?" + tempArr.join("&");
      }
      // let link = btnData.btnParams;
      if (type == "INNERLINK") {
        this.$router.push(url);
      } else {
        window.open("http://" + url, "_blank");
      }
    },
    async handleDetail(row) {
      this.printDomData = await this.getDetailTableString(row);
      this.detailShow = true;
      this.$nextTick(() => {
        this.$refs.detailTable.innerHTML = this.printDomData;
      });
    },
    // 切片类型改变回调
    sliceTypeChangeHandler(row) {
      let { sliceType } = row;
      if (sliceType) {
        row.sliceTypeLabel = this.sliceTypeOptions.find(
          (item) => item.materielCode == sliceType
        )?.materielName;
      }
    },
    // 色号改变回调
    colourNumberChangeHandler(row) {
      let { colours } = row;
      if (colours) {
        let target = this.colourNumberOptions.find(
          (item) => item.colour == colours
        );
        if (target) {
          row.colourNumberLabel =
            target.materieEncoding + target.materieColorNumber;
        }
        // row.colourNumberLabel = this.colourNumberOptions.find(
        //   (item) => item.materielCode == colours
        // )?.materieColorNumber;
        this.updateStorage(row);
      }
    },
    // 打印回调
    detailPrintHandler() {
      document.body.innerHTML = document.getElementById("printDom").innerHTML =
        this.printDomData;
      window.print(); //打印
      window.location.reload();
      return false;
    },
    // 根据字典value获取字典label
    getDictLabel(value, dict) {
      return (
        this.dict.type[dict].find((item) => {
          return item.value === value;
        })?.label || ""
      );
    },
    // 获取详情html字符串
    async getDetailTableString(row) {
      let { saleOrderSaleNo } = row;
      let payLoad = [
        {
          basicMap: {
            tableName: "sale_order",
          },
          conditionMap: {
            sale_no: [saleOrderSaleNo],
          },
        },
        {
          basicMap: {
            tableName: "sale_products",
          },
          conditionMap: {
            sale_order_no: [saleOrderSaleNo],
          },
        },
        {
          basicMap: {
            tableName: "sale_craft",
          },
          conditionMap: {
            sale_order_no: [saleOrderSaleNo],
          },
        },
      ];
      let res = await queryDropDownBoxData(payLoad);
      if (res.code == 200) {
        console.log(res);
        let { sale_craft, sale_order, sale_products } = res.data.resultMap;
        let {
          //订单表数据
          saleNo, //合同号
          lotNumber, //批号
          saleCustomNo, //客户编号
          saleDate, //销售单日期
          saleOrderEstimatedTime, //预计下单时间
          saleLeadTime, //交货周期
          deliveryDate,
          saleAmounts, //合计金额 小写
          saleAmountInWords, //合计金额 大写
          salePayType, //支付方式
          earnestMoney,
          salesman, //业务员
          saleLeader, //业务主管
          finance, //财务部
          production, //生产部
          saleApprover, //批准人
          // customAddress, //客户地址
          // customCountryType, //国家类型
          // contactPerson, //联系人
          // 货品明细表数据
          // productNo, //货品号
          // productName, //货品名称
          // productNumber: "", //销售数量
          // productWeight: "", //销售重量kg
          // productUnitPrice: "", //单价
          // productAmounts: "", //金额
          // remark: "", //备注
          // 工艺表
          craftGrid, //网络
          craftOil, //油剂
          craftPackage, //卷装
          craftColorFastness, //色牢度
          directionOfTwist,
          craftOther, //其它工艺要求
          craftMark, //包装/贴唛
          shippingMethod, //运输方式
        } = { ...sale_craft[0], ...sale_order[0] };
        let customData = this.customerOptions.find(
          (item) => item.customNo == saleCustomNo
        );
        let payType = this.getDictLabel(salePayType, "payment_method"); //付款方式
        let customerName = customData ? customData.customName : "";
        let customAddress = customData?.customAddress || "无";
        let customCountryType = customData?.customCountryType || "";
        let contactPerson = customData?.contactPerson || "无";
        let directionOfTwistDescription = directionOfTwist
          ? this.getDictLabel(directionOfTwist, "direction_of_twist")
          : "";
        let printStr = `
        <table style="width:1200px; border-collapse:collapse;" border="1" cellpadding="10" align="center">
            <div style="text-align:center;font-size: 20px;">诸暨市新丝维纤维有限公司</div>
            <div style="text-align:center;">销售合同审计单</div>
            <tbody>
                <tr>
                    <td width="600px" colspan="4">合同号：${saleNo}</td>
                    <td width="600px" colspan="4">日期：${saleDate.replace(
                      "T",
                      " "
                    )}</td>
                </tr>
                <tr align="center">
                    <td width="300px" colspan="2">客户名称：</td>
                    <td width="300px" colspan="2">${customerName}</td>
                    <td width="300px" colspan="2">联系人：</td>
                    <td width="150px" colspan="1">${contactPerson}</td>
                </tr>
                <tr align="center">
                    <td width="300px" colspan="2">客户地址：</td>
                    <td width="300px" colspan="2">${customAddress}</td>
                    <td width="300px" colspan="2">客户国别：</td>
                    <td width="300px" colspan="2">${customCountryType}</td>
                </tr>
                <tr align="center">
                    <td width="300px" colspan="2">预计下单时间：</td>
                    <td  colspan="1">${saleOrderEstimatedTime.replace(
                      "T",
                      " "
                    )}</td>
                    <td  colspan="1">交货周期：</td>
                    <td >${saleLeadTime}</td>
                    <td  colspan="2">交货日期：</td>
                    <td >${deliveryDate.replace("T", " ")}</td>
                </tr>
                <tr align="center">
                    <td colspan="8">货品明细</td>
                </tr>
                <tr align="center">
                    <td width="150px">品名</td>
                    <td width="150px">类型</td>
                    <td width="150px">箱数</td>
                    <td width="150px">单价</td>
                    <td width="150px">金额</td>
                    <td width="150px">切片型号</td>
                    <td width="150px">色号</td>
                    <td width="150px">备注</td>
                </tr>`;
        let amountTotal = 0,
          singlTotal = 0,
          moneyTotal = 0;
        for (let i = 0; i < sale_products.length; i++) {
          let item = sale_products[i];
          amountTotal += Number(item.productNumber);
          singlTotal += Number(item.productUnitPrice);
          moneyTotal += Number(item.productAmounts);
          let productData = this.productionOptions.find(
            (pro) => pro.productNo == item.productNo
          );
          console.log("item", item);
          item.sliceTypeLabel =
            this.sliceTypeOptions.find((k) => k.materielCode == item.sliceType)
              ?.materielName || "";
          item.colourNumberLabel = this.colourNumberOptions.find(
            (k) => k.colour == item.colours
          )?.colour;
          let productName = productData ? productData.productName : "";
          let productType = productData ? productData.productType : "";
          printStr += `<tr align="center">
                    <td>${productName}</td>
                    <td>${productType}</td>
                    <td>${item.productNumber}</td>
                    <td>${item.productUnitPrice}</td>
                    <td>${item.productAmounts}</td>
                    <td>${item.sliceTypeLabel}</td>
                    <td>${item.colourNumberLabel}</td>
                    <td>${item.remark}</td>
                </tr>`;
        }
        // 计算小计
        printStr += `
        <tr align="center">
          <td>小计：</td>
           <td></td>
          <td>${amountTotal}</td>
          <td>${singlTotal}</td>
          <td>${moneyTotal}</td>
          <td></td>
          <td></td>
          <td></td>
        </tr>
                <tr>
                    <td colspan="8">合计金额（大写）：${saleAmountInWords}</td>
                </tr>
                `;

        if (salePayType == "1") {
          //定金
          printStr += `
          <tr>
            <td colspan="4">付款方式：${payType}</td>
            <td colspan="4">定金：${earnestMoney}</td>
          </tr>`;
        } else {
          printStr += `
         <tr>
              <td colspan="8">付款方式：${payType}</td>
          </tr>`;
        }
        printStr += `<tr align="center">
                    <td colspan="8">工艺要求</td>
                </tr>
                <tr align="center">
                    <td width="150px">网络</td>
                    <td width="150px">油剂</td>
                    <td width="150px">卷装</td>
                    <td width="150px">色牢度</td>
                    <td width="150px">捻向</td>
                    <td width="150px">其他</td>
                    <td width="150px"></td>
                    <td width="150px"></td>
                </tr>
                <tr align="center">
                    <td >${craftGrid}</td>
                    <td>${craftOil}</td>
                    <td>${craftPackage}</td>
                    <td>${craftColorFastness}</td>
                    <td>${directionOfTwistDescription}</td>
                    <td>${craftOther}</td>
                    <td width="150px"></td>
                    <td width="150px"></td>
                </tr>
                <tr>
                    <td colspan="8">包装/贴唛：${craftMark}</td>
                </tr>
                <tr>
                    <td colspan="8">装运方式：${shippingMethod}</td>
                </tr>
                <tr align="center">
                    <td colspan="2">业务员：</td>
                    <td colspan="2">${salesman}</td>
                    <td colspan="2">财务部：</td>
                    <td colspan="2">${finance}</td>

                </tr>

                <tr align="center">
                    <td colspan="2">业务主管：</td>
                    <td colspan="2">${saleApprover}</td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>
            </tbody>
        </table>
        `;
        return printStr;
        // <td colspan="2">业务主管：</td>
        // <td colspan="2">${saleLeader}</td>
        // <tr align="center">

        //     // <td colspan="2">生产部：</td>
        //     // <td colspan="2">${production}</td>
        // </tr>
        //         <tr align="center">
        //             <td colspan="2"> 2</td>
        //             <td> </td>
        //             <td> </td>
        //             <td> </td>
        //             <td> </td>
        //         </tr>
        //         <tr>
        //             <td colspan="2">小计：</td>
        //             <td></td>
        //             <td></td>
        //             <td></td>
        //             <td></td>
        //         </tr>
      }
    },
    // 自定义删除按钮
    async myDeleteHandler(row) {
      console.log(row);
      let stateArr = ["6"];
      let isDeleteValidate = this.selection.some((item) => {
        return stateArr.includes(item.status);
      });
      console.log(this.selection);
      console.log(isDeleteValidate);
      if (isDeleteValidate) {
        this.$message.error("'已完成'状态订单不可删除!");
        return;
      }
      await this.$confirm("是否确认删除选中的数据？", "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      });
      let payLoad = row.id ? [row.id] : this.myDelIds;
      payLoad = payLoad.join(",");
      console.log(payLoad);

      try {
        let res = await deleRetailOrder(payLoad);
        if (res.code === 200) {
          this.$message.success("删除成功");
          this.getList();
          this.myDelIds = [];
          this.$nextTick(() => {
            this.$refs.tableRef?.clearSelection();
          });
        } else {
          this.$message.error(res.msg);
        }
      } catch (error) {}
    },
    // 发货回调
    myDeliverHandler(row) {
      this.currentRow = row;
      this.deliverShow = true;
      this.$nextTick(() => {
        this.$refs.deliverRef.productInvoiceInfo(row);
      });
    },
  },
};
</script>

<style scoped lang="scss">
::v-deep .el-dialog:not(.is-fullscreen) {
  min-width: 610px !important;
}
</style>