supply-front/src/views/sales_policy/components/editPolicy.vue

<template>
  <div>
    <div v-show="isCondition == 0" class="">
      <div>
        <div class="screen-container">
          <h4>销售政策信息</h4>
          <el-divider />
          <el-form ref="form" :model="searchForm" label-width="160px" size="mini" class="demo-searchForm">
            <el-row>
              <el-col :xs="24" :ms="12" :lg="12">
                <el-form-item label="销售政策编号">
                  <el-input v-model="searchForm.code" disabled placeholder="如未填写，则系统自动生成" />
                </el-form-item>
              </el-col>
              <el-col :xs="24" :ms="12" :lg="12">
                <el-form-item label="销售政策名称" prop="title">
                  <el-input v-model="searchForm.title" placeholder="销售政策名称" />
                </el-form-item>
              </el-col>
              <el-col :xs="24" :ms="12" :lg="12">
                <el-form-item label="销售政策类型" prop="type">
                  <el-select v-model="searchForm.type" size="mini" placeholder="销售政策类型" class="select_height">
                    <el-option
                      v-for="(item, index) in typeOptions"
                      :key="index"
                      :label="item.label"
                      :value="item.value"
                    />
                  </el-select>
                </el-form-item>
              </el-col>

              <el-col :xs="24" :ms="12" :lg="12">
                <el-form-item label="" prop="type">
                  <div style="height: 30px">
                    <el-checkbox v-model="searchForm.isFullRebate">返利使用金额需满额使用</el-checkbox>
                    <el-checkbox v-model="searchForm.commercialType">商用空调政策</el-checkbox>
                  </div>
                </el-form-item>
              </el-col>

              <!-- <el-col :xs="24" :ms="12" :lg="12">
                <el-form-item label="产品类别" prop="mainId">
                  <el-select
                    v-model="searchForm.mainId"
                    :disabled="dataList.length ? true : false"
                    placeholder="请选择"
                    @change="handelStop"
                  >
                    <el-option
                      v-for="item in dictList"
                      :label="item.dictValue"
                      :value="item.dictCode"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col> -->
              <el-col :xs="24" :ms="12" :lg="12">
                <el-form-item label="生效日期" prop="startTime">
                  <el-date-picker
                    v-model="searchForm.startTime"
                    type="datetime"
                    placeholder="生效日期"
                    default-time="00:00:00"
                    value-format="yyyy-MM-dd HH:mm:ss"
                  />
                </el-form-item>
              </el-col>
              <el-col :xs="24" :ms="12" :lg="12">
                <el-form-item label="失效日期" prop="endTime">
                  <el-date-picker
                    v-model="searchForm.endTime"
                    type="datetime"
                    placeholder="失效日期"
                    default-time="00:00:00"
                    value-format="yyyy-MM-dd HH:mm:ss"
                  />
                </el-form-item>
              </el-col>
              <el-col :xs="24" :ms="24" :lg="24">
                <el-form-item label="表头备注" prop="remark">
                  <el-input v-model="searchForm.remark" placeholder="新风机变频挂机。按提货数量1:3开单" />
                </el-form-item>
              </el-col>
              <template v-if="searchForm.type === 'LIMIT'">

                <el-col :xs="24" :ms="12" :lg="12">
                  <el-form-item label="商家最少起提数量" prop="minBuyNum">
                    <el-input v-model.number="searchForm.minBuyNum" type="number" placeholder="商家最少起提数量" />
                  </el-form-item>
                </el-col>
                <el-col :xs="24" :ms="12" :lg="12">
                  <el-form-item label="商家最大提货组数" prop="maxBuyNum">
                    <el-input v-model.number="searchForm.maxBuyNum" type="number" placeholder="商家最大提货组数" />
                  </el-form-item>
                </el-col>
              </template>
              <el-col :xs="24" :ms="24" :lg="24">
                <el-form-item label="政策封面图">
                  <ImageUpload class="elImageClose" :file-list="fileList" multiple :limit="3" />
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </div>
        <div class="mymian-container">
          <el-row>
            <el-divider />
            <el-row type="flex">
              <el-col :span="12">
                <h4 style="display: inline-block; margin-right: 20px">货品信息</h4>
                <template>
                  <el-upload
                    class="import-btn"
                    :action="baseURL + 'student/import'"
                    :http-request="handleImport"
                    :file-list="importFileList"
                    :show-file-list="false"
                  >
                    <el-button type="primary" size="mini">导入货品价格表</el-button>
                  </el-upload>
                </template>

                <el-button type="primary" size="mini" @click="handleDownloadFiles">下载模板</el-button>
              </el-col>
            </el-row>
            <el-divider />
          </el-row>
          <div class="table">
            <!-- v-el-select-loadmore="loadmore2" -->
            <pl-table
              ref="plTable"
              v-loading="listLoading"
              class="plTable"
              :data="dataList"
              row-key="index"
              use-virtual
              :data-changes-scroll-top="false"
              big-data-checkbox
              element-loading-text="Loading"
              height="450"
              border
              fit
              stripe
            >
              <pl-table-column type="index" label="序号" width="50" align="left" />
              <pl-table-column prop="materialNumber" label="物料编码" align="left" min-width="200">
                <template slot-scope="scope">
                  <CopyButton :copy-text="scope.row.materialNumber" />
                  <template v-if="scope.row.fang">
                    {{ scope.row.materialNumber }}
                  </template>
                  <el-select
                    v-else
                    v-model="scope.row.materialNumber"
                    size="mini"
                    :remote-method="query => remoteMethod(query, 'number')"
                    filterable
                    remote
                    style="width: 85%"
                    @change="handleK3List($event, scope.row, scope.$index, 'materialNumber')"
                  >
                    <el-option v-for="(item, index) in k3List" :key="index" :label="item.number" :value="item.id" />
                  </el-select>
                </template>
              </pl-table-column>
              <pl-table-column show-overflow-tooltip min-width="150" prop="materialName" label="产品名称" align="left">
                <template slot-scope="scope">
                  <CopyButton :copy-text="scope.row.materialName" />
                  <span>{{ scope.row.materialName }}</span>
                </template>
              </pl-table-column>
              <pl-table-column min-width="300" prop="specification" label="规格型号" align="left">
                <template slot-scope="scope">
                  <CopyButton :copy-text="scope.row.specification" />
                  <template v-if="scope.row.fang">
                    {{ scope.row.specification }}
                  </template>
                  <el-tooltip v-else :disabled="scope.row.specification? false: true" class="item" effect="dark" :content="scope.row.specification" placement="top-start">
                    <el-select
                      v-model="scope.row.specification"
                      size="mini"
                      :remote-method="query => remoteMethod(query, 'specification')"
                      filterable
                      style="width: 85%"
                      remote
                      @change="handleK3List($event, scope.row, scope.$index, 'specification')"
                    >
                      <el-option
                        v-for="(item, index) in k3List"
                        :key="index"
                        :label="item.specification"
                        :value="item.id"
                      />
                    </el-select>
                  </el-tooltip>
                </template>
              </pl-table-column>
              <pl-table-column show-overflow-tooltip min-width="150" prop="saleTypeName" label="销售类型" align="left">
                <template slot-scope="scope">
                  <template v-if="scope.row.fang">
                    {{ scope.row.saleTypeName }}
                  </template>
                  <el-select
                    v-else
                    v-model="scope.row.saleTypeId"
                    remote
                    reserve-keyword
                    :remote-method="query => remoteMethodType(query, 'saleTypeId')"
                    size="mini"
                    filterable
                    @change="handleSalesType($event, scope.row, scope.$index, 'saleTypeId')"
                  >
                    <el-option v-for="(item, index) in typeList" :key="index" :label="item.saleName" :value="item.id" />
                  </el-select>
                </template>
              </pl-table-column>
              <pl-table-column
                show-overflow-tooltip
                min-width="150"
                prop="saleTypeCode"
                label="销售类型编码"
                align="left"
              />

              <pl-table-column prop="discAmount" label="格力折扣" align="right">
                <template slot-scope="scope">
                  <template v-if="scope.row.fang">
                    {{ scope.row.discAmount }}
                  </template>
                  <el-input
                    v-else
                    v-model.number="scope.row.discAmount"
                    class="yinput"
                    type="number"
                    placeholder="请输入格力折扣"
                    size="mini"
                    @mousewheel.native.prevent
                    @change="setText($event, scope.$index, scope.row, 'discAmount')"
                  />
                </template>
              </pl-table-column>
              <pl-table-column prop="orgPrice" label="原供价" align="right" min-width="150">
                <template slot-scope="scope">
                  <template v-if="scope.row.fang">
                    {{ scope.row.orgPrice }}
                  </template>
                  <el-input
                    v-else
                    v-model.number="scope.row.orgPrice"
                    class="yinput"
                    type="number"
                    placeholder="请输入原供价"
                    size="mini"
                    @mousewheel.native.prevent
                    @change="setText($event, scope.$index, scope.row, 'orgPrice')"
                  />
                </template>
              </pl-table-column>
              <pl-table-column prop="priceType" label="价格类型" align="left" min-width="150">
                <template slot-scope="scope">
                  <template v-if="scope.row.fang">
                    {{ scope.row.priceType }}
                  </template>
                  <el-select
                    v-else
                    v-model="scope.row.priceType"
                    size="mini"
                    filterable
                    clearable
                    @change="setText($event, scope.$index, scope.row, 'priceType')"
                    @focus="handlePriceType(scope.row)"
                  >
                    <el-option
                      v-for="item in priceList2"
                      :key="item.priceTypeId"
                      :label="item.priceTypeName"
                      :value="item.priceTypeId"
                    />
                  </el-select>
                </template>
              </pl-table-column>
              <pl-table-column prop="price" label="单价" align="right" show-overflow-tooltip min-width="150">
                <template slot-scope="scope">
                  <template v-if="scope.row.fang">
                    {{ scope.row.price }}
                  </template>
                  <el-input
                    v-else
                    v-model.number="scope.row.price"
                    class="yinput"
                    type="number"
                    placeholder="请输入单价"
                    size="mini"
                    @change="setText($event, scope.$index, scope.row, 'price')"
                    @mousewheel.native.prevent
                  />
                </template>
              </pl-table-column>
              <pl-table-column label="返利钱包" align="left" show-overflow-tooltip min-width="200">
                <template slot-scope="scope">
                  <template v-if="scope.row.fang">
                    <template v-for="(item, index) in scope.row.walletRelaList">
                      <el-tag v-if="item.type === 'REBATE'" :key="index" style="margin: 5px" type="success" size="mini">
                        {{ item.walletName }}
                      </el-tag>
                    </template>
                  </template>
                  <template v-else>
                    <el-select
                      v-if="!rebateList2.length"
                      v-model="scope.row.rebateWalletIds"
                      size="mini"
                      multiple
                      collapse-tags
                      filterable
                      @change="setText($event, scope.$index, scope.row, 'rebateWalletIds')"
                    >
                      <el-option
                        v-for="item in rebateList"
                        :key="item.walletRebateId"
                        :label="item.name"
                        :value="item.walletRebateId"
                      />
                    </el-select>
                    <el-select
                      v-else
                      v-model="scope.row.rebateWalletIds"
                      size="mini"
                      multiple
                      collapse-tags
                      filterable
                      @change="setText($event, scope.$index, scope.row, 'rebateWalletIds')"
                    >
                      <el-option
                        v-for="item in rebateList2"
                        :key="item.walletRebateId"
                        :label="item.name"
                        :value="item.walletRebateId"
                      />
                    </el-select>
                  </template>
                </template>
              </pl-table-column>
              <pl-table-column label="现金钱包" align="left" show-overflow-tooltip min-width="200">
                <template slot-scope="scope">
                  <template v-if="scope.row.fang">
                    <template v-for="(item, index) in scope.row.walletRelaList">
                      <el-tag v-if="item.type === 'COMMONLY'" :key="index" style="margin: 5px" type="success" size="mini">
                        {{ item.walletName }}
                      </el-tag>
                    </template>
                  </template>
                  <template v-else>
                    <el-select
                      v-if="!NoRebateWalletList2.length"
                      v-model="scope.row.walletIds"
                      size="mini"
                      multiple
                      collapse-tags
                      filterable
                      placeholder="请选择价格类型带出钱包"
                      @change="setText($event, scope.$index, scope.row, 'walletIds')"
                    >
                      <el-option v-for="item in NoRebateWalletList" :key="item.id" :label="item.name" :value="item.id" />
                    </el-select>
                    <el-select
                      v-else
                      v-model="scope.row.walletIds"
                      size="mini"
                      multiple
                      collapse-tags
                      filterable
                      placeholder="请选择价格类型带出钱包"
                      @change="setText($event, scope.$index, scope.row, 'walletIds')"
                    >
                      <el-option v-for="item in NoRebateWalletList2" :key="item.id" :label="item.name" :value="item.id" />
                    </el-select>
                  </template>

                </template>
              </pl-table-column>
              <pl-table-column prop="remark" label="备注" align="left" show-overflow-tooltip min-width="150">
                <template slot-scope="scope">
                  <template v-if="scope.row.fang">
                    {{ scope.row.remark }}
                  </template>
                  <el-input
                    v-else
                    v-model="scope.row.remark"
                    placeholder="备注"
                    size="mini"
                    @change="setText($event, scope.$index, scope.row, 'remark')"
                  />
                </template>
              </pl-table-column>
              <pl-table-column prop="status" label="状态" align="left" show-overflow-tooltip min-width="150">
                <template slot-scope="scope">
                  {{ scope.row.status ? '启用' : '作废' }}
                </template>
              </pl-table-column>
              <pl-table-column label="操作" align="center" min-width="150">
                <template slot-scope="scope">
                  <el-button
                    type="text"
                    class="textColor el-popover-left"
                    @click="handleEdit(scope.row, scope.$index)"
                  >编辑
                  </el-button>
                  <el-popconfirm
                    confirm-button-text="好的"
                    cancel-button-text="不用了"
                    icon="el-icon-info"
                    icon-color="red"
                    title="内容确定删除吗？"
                    @onConfirm="handleDelete(scope.row.id, scope.$index)"
                  >
                    <el-button slot="reference" type="text" class="textColor el-popover-left">删除</el-button>
                  </el-popconfirm>
                  <el-popconfirm
                    v-if="!scope.row.status"
                    confirm-button-text="好的"
                    cancel-button-text="不用了"
                    icon="el-icon-info"
                    icon-color="red"
                    title="启用吗？"
                    @onConfirm="handleStatus(scope.row.id, true)"
                  >
                    <el-button slot="reference" type="text" class="textColor el-popover-left">启用</el-button>
                  </el-popconfirm>
                  <el-popconfirm
                    v-else
                    confirm-button-text="好的"
                    cancel-button-text="不用了"
                    icon="el-icon-info"
                    icon-color="red"
                    title="作废吗？"
                    @onConfirm="handleStatus(scope.row.id, false)"
                  >
                    <el-button slot="reference" type="text" class="textColor el-popover-left">作废</el-button>
                  </el-popconfirm>
                </template>
              </pl-table-column>
            </pl-table>
          </div>
          <!-- 分页 -->
          <div style="margin: 20px 20px 20px 0; display: flex; justify-content: space-between">
            <div>
              <el-button type="primary" size="mini" @click="handleNewInfo">添加</el-button>
              <el-button v-loading="fullscreenLoading" type="primary" size="mini" @click="handleSave">保存</el-button>
            </div>
            <!--            <el-pagination-->
            <!--              :current-page="dcurrentPage"-->
            <!--              :page-sizes="pageSizeArr"-->
            <!--              :page-size="size"-->
            <!--              layout="total, sizes, prev, pager, next, jumper"-->
            <!--              :total="listTotal"-->
            <!--              @size-change="handleSizeChange2"-->
            <!--              @current-change="handleCurrentChange2"-->
            <!--            />-->
          </div>
          <el-row>
            <el-divider />
            <el-row type="flex">
              <el-col :span="12">
                <h4 style="display: inline-block; margin-right: 20px">条件信息</h4>
                <el-button type="primary" size="mini" @click="handleAddCondition">添加</el-button>
              </el-col>
            </el-row>
            <el-divider />
          </el-row>
          <el-table :data="conditionList" element-loading-text="Loading" border fit highlight-current-row stripe>
            <el-table-column fixed type="index" label="序号" width="50" align="left" />
            <el-table-column prop="name" label="限定条件" align="left">
              <template slot-scope="scope">
                <el-input
                  v-model="scope.row.name"
                  size="mini"
                  style="text-align: center"
                  placeholder="请输入名称"
                  :disabled="scope.row.fang"
                  @blur="handleConditionName(scope.row)"
                />
              </template>
            </el-table-column>
            <el-table-column fixed="right" width="150" label="操作" align="center">
              <template slot-scope="scope">
                <el-button
                  type="text"
                  size="mini"
                  @click="
                    scope.row.fang = false
                    conditName = scope.row.name
                  "
                >编辑
                </el-button>
                <el-button type="text" size="mini" @click="handleCondition(scope.row.id, scope.$index)">删除</el-button>
                <el-button type="text" size="mini" @click="catCond(scope.row)">查看条件</el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
        <div>
          <el-row>
            <el-divider />
            <el-row type="flex" align="middle">
              <el-col :span="2">
                <h4>经销商信息</h4>
              </el-col>
            </el-row>
            <el-divider />
          </el-row>
          <TabelTransfer
            v-if="detail && detail.code"
            :code="detail.code"
            :batch="true"
            :yregion="region"
            :policy-type="searchForm.type"
            @handlEditPolicy="handlEditPolicy"
            @handleReset="handleReset"
          />
        </div>
      </div>
    </div>
    <AddCondition
      v-show="isCondition === 1"
      ref="comDom"
      :code="searchForm.code"
      :is-show="isShow"
      :is-flag="isFlag"
      :is-condition="isCondition"
      @handleSubmitCon="handleSubmitCon"
      @back="handleBack"
    />
    <AddCondition
      v-show="isCondition === 2"
      :id="cid"
      ref="cond"
      :code="searchForm.code"
      :is-show="isShow"
      :is-flag="isFlag"
      :is-condition="isCondition"
      @back="handleBack"
    />
  </div>
</template>

<script>
import { mapGetters, mapMutations } from 'vuex'
import Minxin from '@/mixin'
import {
  deleteCondition,
  deleteMaterialPolicy,
  getConditionList,
  getK3List,
  getMaterialList,
  getNoRebateWalletList,
  getPolicyDetail,
  getTypeList,
  getWalletRebateList,
  savePolicy,
  updateCondition,
  updatePolicy,
  setStauts
} from '@/api/policy_list'
import { getPriceSalesRelaListV2 } from '@/api/priceType'

import { downloadFiles, handleImport } from '@/utils/util'
// import Transfer from './Transfer'
import TabelTransfer from './TabelTransfer'
import AddCondition from './AddCondition'

import ImageUpload from '@/components/Common/image-upload.vue'
import { PlTable, PlTableColumn } from 'pl-table'

export default {
  directives: {
    'el-select-loadmore': {
      bind(el, binding) {
        console.log(el)
        // 获取element-ui定义好的scroll盒⼦
        const SELECTWRAP_DOM = el.querySelector(
          '.el-table__body-wrapper'
          // '.el-select-dropdown .el-select-dropdown__wrap'
        )
        SELECTWRAP_DOM.addEventListener('scroll', function() {
          /**
           * scrollHeight 获取元素内容⾼度(只读)
           * scrollTop 获取或者设置元素的偏移值,常⽤于, 计算滚动条的位置, 当⼀个元素的容器没有产⽣垂直⽅向的滚动条, 那它的scrollTop的值默认为0.
           * clientHeight 读取元素的可见⾼度(只读)
           * 如果元素滚动到底, 下⾯等式返回true, 没有则返回false:
           * ele.scrollHeight - ele.scrollTop === ele.clientHeight;
           */
          const condition = this.scrollHeight - this.scrollTop <= this.clientHeight
          if (condition) {
            binding.value()
          }
        })
      }
    }
  },
  mixins: [Minxin],
  props: {
    id: {
      type: String,
      default: ''
    },
    isShow: {
      type: Number
    },
    isFlag: {
      type: [Number, String]
    }
  },
  data() {
    return {
      fang: false,
      input: '',
      baseURL: '',
      isCondition: 0,
      searchForm: {
        code: '',
        endTime: '',
        imgSrc: '',
        remark: '',
        startTime: '',
        title: '',
        mainId: '',
        mainName: '',
        type: '',
        isFullRebate: false,
        commercialType: false,
        maxBuyNum: 0,
        minBuyNum: 0
      },
      conditName: '',
      dataList: [],
      addList: [],
      pageSizeArr: [10, 20, 30, 50],
      size: 10,
      listLoading: false,
      dialogVisible: false,
      importFileList: [],
      fileList: [],
      options: {},
      value: '',
      typeList: [],
      walletList: [],
      typeOptions: [
        {
          value: 'PROVISION',
          label: '配提'
        },
        {
          value: 'LIMIT',
          label: '限量'
        }
      ],
      conditionList: [],
      dictList: [],
      k3List: [],
      rebateList: [],
      rebateList2: [],
      NoRebateWalletList: [],
      NoRebateWalletList2: [],
      sleectBox: { currentPage: 1 },
      dpageSize: 10,
      dcurrentPage: 1,
      detail: {},
      cid: '',
      cpolicyId: '',
      region: 0,
      fullscreenLoading: false,
      srcList: [],
      priceList: [],
      priceList2: [],
      importRebate: {},
      importWallet: {}
    }
  },
  computed: {
    ...mapGetters({
      comCode: 'code'
    })
  },

  created() {},
  methods: {
    ...mapMutations('sales', ['initData']),
    handleStatus(id, status) {
      setStauts({ policyMaterialId: id, status }).then(res => {
        this.handletwoList()
        this.$successMsg(status ? '启用' : '作废')
      })
    },
    handleEdit(row, index) {
      row.fang = !row.fang
      !row.fang && this.handleWallet(row, index)
    },
    setText(e, index, row, name) {
      if (e) {
        if (name === 'priceType') {
          this.NoRebateWalletList2 = []
          this.rebateList2 = []
          const rebateListId = []
          const NoRebateWalletListId = []
          this.priceList.forEach(k => {
            if (k.priceTypeId === e) {
              if (k.walletId) {
                this.NoRebateWalletList2.push(
                  {
                    id: k.walletId,
                    name: k.walletName
                  }
                )
                NoRebateWalletListId.push(k.walletId)
              }
              if (k.walletId2) {
                this.rebateList2.push({
                  walletRebateId: k.walletId2,
                  name: k.walletName2
                })
                rebateListId.push(k.walletId2)
              }
            }
          })
          if (NoRebateWalletListId.length && this.importWallet.id && !~NoRebateWalletListId.indexOf(this.importWallet.id)) {
            this.NoRebateWalletList2.push(this.importWallet)
            NoRebateWalletListId.push(this.importWallet.id)
          }
          if (rebateListId.length && this.importRebate.walletRebateId && !~rebateListId.indexOf(this.importRebate.walletRebateId)) {
            this.rebateList2.push(this.importRebate)
            rebateListId.push(this.importRebate.walletRebateId)
          }
          const item = this.priceList.find(k => k.priceTypeId === e)
          this.dataList[index][name] = item.priceTypeName
          this.$set(row, 'walletIds', [])
          this.$set(row, 'rebateWalletIds', [])
          this.dataList[index].walletIds = []
          this.dataList[index].rebateWalletIds = []
          if (item.walletId) {
            this.$set(row, 'walletIds', [...new Set([...row.walletIds, ...NoRebateWalletListId])])
            this.dataList[index].walletIds = [...new Set([...row.walletIds, ...NoRebateWalletListId])]
          }
          if (item.walletId2) {
            this.$set(row, 'rebateWalletIds', [...new Set([...row.rebateWalletIds, ...rebateListId])])
            this.dataList[index].rebateWalletIds = [...new Set([...row.rebateWalletIds, ...rebateListId])]
          }
          return
        }
        this.dataList[index][name] = row[name]
      } else {
        this.NoRebateWalletList2 = []
        this.rebateList2 = []
        this.dataList[index][name] = ''
        this.$set(row, 'walletIds', [])
        this.$set(row, 'rebateWalletIds', [])
        this.dataList[index].walletIds = []
        this.dataList[index].rebateWalletIds = []
      }
    },
    // 下载excel模板
    handleDownloadFiles() {
      downloadFiles('policy/download')
    },
    handleCondition(id, index) {
      deleteCondition({ id }).then(res => {
        this.conditionList.splice(index, 1)
        Object.assign(this.$children[9].$data, this.$children[9].$options.data())
        this.$successMsg('删除成功')
      })
    },
    catCond(row) {
      this.cid = row.id
      this.$refs.cond.getCommonApi('', row.id)
      this.isCondition = 2

      // $refs.cond.getCommonApi(),
      //         (), (cid = scope.row.id)
    },
    handleAddCondition() {
      this.isCondition = 1
      console.log(this.conditionList[0].id, this.searchForm.code)
      this.$refs.comDom.getCommonApi(this.conditionList[0].id)
      this.$store.commit('sales/setId', this.searchForm.code)
    },
    // loadmore() {
    //   this.sleectBox.currentPage++
    //   this.getK3List()
    // },
    loadmore2() {
      if (this.dataList.length < this.listTotal) {
        const total = Math.floor(this.listTotal / 10)
        if (this.dcurrentPage <= total) {
          this.dcurrentPage++
          this.handletwoList()
        }
      }
    },
    getK3List() {
      getK3List({
        pageNum: this.sleectBox.currentPage,
        pageSize: 10,
        keyword: ''
      }).then(res => {
        this.k3List = [...this.k3List, ...res.data.records]
      })
    },
    async remoteMethodType(query, type) {
      console.log(111)
      // 获取销售类型列表
      const params = {
        pageNum: 1,
        pageSize: -1,
        saleCode: query,
        saleName: '',
        status: ''
      }
      const typeData = await getTypeList(params)
      this.typeList = typeData.data.records
    },
    remoteMethod(query, type) {
      console.log(query, type)
      if (query !== '') {
        getK3List({
          pageNum: 1,
          pageSize: 100,
          keyword: '',
          number: type === 'number' ? query : '',
          oldNumber: '',
          specification: type === 'specification' ? query : ''
        }).then(res => {
          this.k3List = res.data.records
        })
      } else {
        this.sleectBox.currentPage = 1
        this.getK3List()
      }
    },
    async getCommonApi() {
      // this.getK3List();
      // 非返利钱包
      const noRebateWalletData = await getNoRebateWalletList({
        walletName: ''
      })
      this.NoRebateWalletList = noRebateWalletData.data

      const walletRebateData = await getWalletRebateList({
        pageNum: 1,
        pageSize: -2,
        name: '',
        status: true
      })
      this.rebateList = walletRebateData.data.records

      const params = {
        pageNum: 1,
        pageSize: -1,
        saleCode: '',
        saleName: '',
        status: ''
      }

      // 获取销售类型列表
      const typeData = await getTypeList(params)

      this.typeList = typeData.data.records
    },
    handleSalesType(e, row, index, name) {
      let item
      try {
        item = this.typeList.filter(k => {
          return k.id === e
        })[0]

        const linshi = []
        const rebateList = []
        this.rebateList.forEach(k => {
          k.saleTypes.forEach(j => {
            if (!linshi.includes(j.saleTypeId) && j.saleTypeId === e) {
              rebateList.push(k)
              linshi.push(j.saleTypeId)
            }
          })
        })

        if (rebateList.length) {
          this.dataList[index].rebateWalletIds = [...new Set([...row.rebateWalletIds, rebateList[0].walletRebateId])]
          this.$set(row, 'rebateWalletIds', [...new Set([...row.rebateWalletIds, rebateList[0].walletRebateId])])
        }
      } catch (error) {
        console.log(error)
      }
      this.dataList[index][name] = row[name]
      this.dataList[index].saleTypeCode = item.saleCode
      this.dataList[index].saleTypeName = item.saleName

      this.$set(row, 'saleTypeCode', item.saleCode)
      this.$set(row, 'saleTypeName', item.saleName)
      this.$set(row, 'priceType', '')
      this.priceList = []
      this.rebateList2 = []
      this.NoRebateWalletList2 = []
      this.$set(row, 'walletIds', [])
      this.$set(row, 'rebateWalletIds', [])
      this.dataList[index].walletIds = []
      this.dataList[index].rebateWalletIds = []
      // this.$set(row,'saleTypeId',item.id)
    },
    // 修改条件名称
    handleConditionName(row) {
      console.log(row.name)
      if (this.conditName !== row.name) {
        updateCondition({ id: row.id, name: row.name }).then(res => {
          this.$successMsg('修改成功')
        })
      }
      row.fang = true
    },
    // 提交信息
    handleSubmitCon() {
      const params = {
        policyId: this.searchForm.code
      }
      // 获取条件政策
      getConditionList(params).then(res => {
        for (let i = 0; i < res.data.length; i++) {
          res.data[i].fang = true
        }
        this.conditionList = res.data
        Object.assign(this.$refs.comDom.$data, this.$refs.comDom.$options.data())
      })
    },
    // 视图部分已注释，废弃的功能 fucn
    handelStop() {
      if (this.searchForm.mainId) {
        this.fang = true
      } else {
        this.$errorMsg('请选择产品类别')
      }
    },
    // 导入
    async handleImport(param) {
      this.importLoading = true
      const file = param.file
      console.log(file, 123)
      const formData = new FormData()
      formData.append('file', file)
      formData.append('policyId', this.searchForm.code)
      // formData.append("mainId", this.searchForm.mainId);
      const result = await handleImport('/policy/material/import', formData)
      this.importLoading = false
      this.importFileList = []
      if (result.code === 200) {
        this.$successMsg('导入成功')

        this.dataList = []
        this.listTotal = 0
        this.sleectBox.currentPage = 1
        this.dcurrentPage = 1
        this.handletwoList()
      } else {
        this.$errorMsg(result.message)
      }
    },
    async getList() {
      await this.getCommonApi()
      await getPolicyDetail({ policyId: this.id }).then(async res => {
        this.detail = res.data
        this.searchForm = {
          code: this.detail.code,
          endTime: this.detail.endTime,
          imgSrc: this.detail.imgSrc,
          remark: this.detail.remark,
          startTime: this.detail.startTime,
          title: this.detail.title,
          type: this.detail.type,
          isFullRebate: this.detail.isFullRebate,
          commercialType: this.detail.commercialType,
          maxBuyNum: this.detail.maxBuyNum,
          minBuyNum: this.detail.minBuyNum

        }
        this.region = res.data.flag

        // this.srcList = [this.$imageUrl + this.detail.imgSrc]
        if (this.isShow === 3 && this.detail.imgSrc) {
          this.detail.imgSrc.split(',').forEach(k => {
            this.fileList.push({
              hover: '',
              url: k
            })
            this.srcList.push(this.$imageUrl + k)
          })
        }
        await this.handletwoList()
        // 获取条件政策
        await this.handleSubmitCon()
      })
      if (this.isFlag) {
        await this.handletwoList()
      }
    },

    // 更改每页数量
    handleSizeChange1(val) {
      this.pageSize = val
      this.currentPage = 1
      this.handletwoList()
    },
    // 更改当前页
    handleCurrentChange1(val) {
      this.currentPage = val
      this.handletwoList()
    },

    // 更改每页数量
    handleSizeChange2(val) {
      this.dpageSize = val
      this.dcurrentPage = 1

      this.handletwoList()
    },
    // 更改当前页
    handleCurrentChange2(val) {
      this.dcurrentPage = val
      this.handletwoList()
    },
    // 获取货品信息
    handletwoList() {
      // this.searchForm.type
      this.listLoading = true
      const paramss = {
        pageNum: 1,
        pageSize: -1,
        policyId: this.searchForm.code,
        saleTypeCode: ''
      }
      getMaterialList(paramss)
        .then(result => {
          result.data.records.forEach(k => {
            k.fang = true
            k.walletIds = []
            k.rebateWalletIds = []
            if (!k.specification) {
              k.materialNumber = k.materialId
              k.specification = k.materialId
            }

            for (let i = 0; i < k.walletRelaList.length; i++) {
              const d = k.walletRelaList[i]
              d.id = d.walletId
              d.name = d.walletName
              if (d.type === 'REBATE') {
                k.rebateWalletIds = [...k.rebateWalletIds, d.walletId]
                k.ovalRebateWalletIds = [...k.rebateWalletIds, d.walletId]
              } else {
                k.walletIds = [...k.walletIds, d.walletId]
                k.ovalWalletIds = [...k.rebateWalletIds, d.walletId]
              }
            }
            // this.priceList.forEach(l => {
            //   if (l.priceTypeName == k.priceType) {
            //     k.priceType = l.priceTypeId
            //   }
            // })
          })

          this.dataList = result.data.records
          this.listTotal = result.data.total
          this.listLoading = false
        })
        .catch(err => {
          console.error(err)
        })
    },
    // 提交审核
    handlEditPolicy(policyCustomers, region) {
      if (!this.searchForm.title) {
        this.$errorMsg('请输入说明')
        return
      }
      if (!this.searchForm.type) {
        this.$errorMsg('请选择类型')
        return
      }
      if (!this.searchForm.startTime) {
        this.$errorMsg('请选择生效日期')
        return
      }
      const formtData = () => {
        var arr = []
        policyCustomers.forEach(el => {
          arr.push({
            customerId: el.customerId || el.customerId,
            customerName: el.name || el.customerName,
            customerNumber: el.number || el.customerNumber,
            lastOrderTime: '',
            limitTakeNum: 0,
            policyId: this.searchForm.code || this.detail.code,
            policyTitle: '',
            remark: ''
          })
        })
        // this.dictList.forEach((k) => {
        //   if (k.dictCode == this.searchForm.mainId) {
        //     this.searchForm.mainName = k.dictValue;
        //   }
        // });
        const imgUrl = []
        this.fileList.forEach(k => {
          imgUrl.push(k.url)
        })
        const params = {
          ...this.detail,
          ...this.searchForm,
          flag: region,
          endTime: this.searchForm.endTime || '2100-01-01 00:00:00',
          policyCustomers: arr,
          imgSrc: imgUrl.join(',')
        }
        updatePolicy(params).then(res => {
          this.$successMsg('编辑成功')
          this.$emit('close')
        })
      }

      if (region == 0) {
        if (policyCustomers.length) {
          formtData()
        } else {
          this.$errorMsg('选择经销商 ')
        }
      } else {
        formtData()
      }
    },
    // 删除
    handleDelete(id, index) {
      if (id) {
        const params = { policyMaterialId: id }
        deleteMaterialPolicy(params).then(res => {
          this.dataList.splice(index, 1)
        })
        return
      }

      this.dataList.splice(index, 1)
      if (!this.dataList.length) {
        this.dcurrentPage !== 1 ? (this.dcurrentPage -= 1) : (this.dcurrentPage = 1)
      }
      // this.listTotal -= 1;
      this.$successMsg('删除成功')
    },
    handleNewInfo() {
      // 物料列表

      this.$nextTick(() => {
        this.dataList.push({
          id: '',
          discAmount: '',
          materialId: '',
          materialName: '',
          materialNumber: '',
          policyId: this.searchForm.code,
          price: '',
          fang: false,
          remark: '',
          saleTypeCode: '',
          saleTypeId: '',
          saleTypeName: '',
          specification: '',
          walletIds: [],
          walletRelaList: [],
          rebateWalletIds: []
        })
        this.sleectBox.currentPage = 1
      })
      // this.listTotal += 1;
      // this.dataList.push(this.addList[this.addList.length-1])
    },
    handleSave() {
      this.fullscreenLoading = true
      if (!this.dataList.length) {
        this.fullscreenLoading = false
        return
      }
      for (let i = 0; i < this.dataList.length; i++) {
        if (!this.dataList[i].materialId) {
          this.$errorMsg('请选择货品')
          return
        }
        if (!this.dataList[i].saleTypeId) {
          this.$errorMsg('请选择销售类型')
          return
        }

        if (!this.dataList[i].price) {
          this.$errorMsg('请输入单价')
          return
        }
        if (!this.dataList[i].walletIds.length) {
          this.$errorMsg('请选择现金钱包')
          return
        }
      }

      savePolicy(this.dataList)
        .then(res => {
          this.dataList = []
          this.sleectBox.currentPage = 1
          this.dcurrentPage = 1
          this.fullscreenLoading = false

          this.$successMsg('保存成功')
          this.handletwoList()
        })
        .finally(() => {
          this.fullscreenLoading = false
        })
    },
    handleK3List(e, row, index, name) {
      const item = this.k3List.filter(k => {
        return k.id == e
      })[0]
      this.$set(row, 'materialNumber', item.number)
      this.$set(row, 'materialName', item.name)
      this.$set(row, 'specification', item.specification)
      this.$set(row, 'materialId', item.id)
      this.dataList[index].materialNumber = item.number
      this.dataList[index].materialName = item.name
      this.dataList[index].specification = item.specification
      this.dataList[index].materialId = item.id

      this.getK3List()
    },
    handleReset() {
      Object.assign(this.$data, this.$options.data())
      this.getCommonApi()
    },
    handleBack() {
      this.isCondition = 0

      this.$emit('upDataIsFlag')
    },
    getPriceSalesRelaListV2(val) {
      return getPriceSalesRelaListV2({
        pageNum: 1,
        pageSize: -1,
        params: [
          {
            'param': 'b.sale_code',
            'compare': 'like',
            'value': val
          },
          {
            'param': 'a.status',
            'compare': '=',
            'value': true
          }
        ]
      }).then(res => {
        this.priceList = res.data.records
        this.priceList2 = this.quChong(res.data.records)
        return Promise.resolve()
      })
    },
    handlePriceType(e) {
      this.priceList = []
      if (e.saleTypeCode) {
        this.getPriceSalesRelaListV2(e.saleTypeCode)
      }
    },
    quChong(arr) {
      var result = []
      const obj = {}
      for (let i = 0; i < arr.length; i++) {
        if (!obj[arr[i].priceTypeId]) {
          result.push(arr[i])
          obj[arr[i].priceTypeId] = true
        }
      }
      return result
    },
    handleWallet(row, index) {
      if (row.saleTypeCode) {
        this.getPriceSalesRelaListV2(row.saleTypeCode).then(res => {
          this.NoRebateWalletList2 = []
          this.rebateList2 = []
          const rebateListId = []
          const NoRebateWalletListId = []
          this.priceList.forEach(k => {
            if (k.priceTypeName === row.priceType) {
              if (k.walletId) {
                this.NoRebateWalletList2.push(
                  {
                    id: k.walletId,
                    name: k.walletName
                  }
                )
                NoRebateWalletListId.push(k.walletId)
              }
              if (k.walletId2) {
                rebateListId.push(k.walletId2)
                this.rebateList2.push({
                  walletRebateId: k.walletId2,
                  name: k.walletName2
                })
              }
            }
          })
          if (row.ovalWalletIds && row.ovalWalletIds.length) {
            row.ovalWalletIds.forEach(k => {
              if (!~NoRebateWalletListId.indexOf(k)) {
                const item = this.NoRebateWalletList.find(e => e.id === k)
                this.importWallet = item
                this.NoRebateWalletList2.push(item)
                NoRebateWalletListId.push(item.id)
              }
              if (~NoRebateWalletListId.indexOf(k)) {
                const item = this.NoRebateWalletList.find(e => e.id === k)
                this.importWallet = item
              }
            })
          }
          console.log(row.ovalRebateWalletIds, this.rebateList)
          if (row.ovalRebateWalletIds && row.ovalRebateWalletIds.length) {
            row.ovalRebateWalletIds.forEach(k => {
              if (!~rebateListId.indexOf(k)) {
                const item = this.rebateList.find(e => e.walletRebateId === k)
                this.importRebate = item
                this.rebateList2.push(item)
                rebateListId.push(item.walletRebateId)
              }
              if (~rebateListId.indexOf(k)) {
                const item = this.rebateList.find(e => e.walletRebateId === k)
                this.importRebate = item
              }
            })
          }

          this.$set(row, 'walletIds', [...new Set([...row.walletIds, ...NoRebateWalletListId])])
          this.$set(row, 'rebateWalletIds', [...new Set([...row.rebateWalletIds, ...rebateListId])])
          this.dataList[index].walletIds = [...new Set([...row.walletIds, ...NoRebateWalletListId])]
          this.dataList[index].rebateWalletIds = [...new Set([...row.rebateWalletIds, ...rebateListId])]
        })
      }
    }
  },
  components: {
    // Transfer,
    AddCondition,
    ImageUpload,
    TabelTransfer,
    PlTable,
    PlTableColumn
  }
}
</script>

<style lang="scss" scoped>
::v-deep .elImageClose .el-image-viewer__wrapper span[class='el-image-viewer__btn el-image-viewer__close'] {
  top: 100px;
}

h4 {
  margin: 0;
}

.yinput {
  ::v-deep input {
    text-align: right;
  }
}

.pdt {
  padding-top: 20px;
}

.import-btn {
  margin-right: 10px;
  display: inline-block;
}

.radio {
  padding: 20px 0;
}

.el-divider--horizontal {
  margin: 20px 0;
}

.el-container .el-divider--horizontal {
  margin: 10px;
}

.el-select {
  width: 100%;
}

.footer {
  margin-bottom: 20px;
}

::v-deep .el-table__virtual-wrapper {
  width: auto !important;
}
::v-deep .el-table__virtual-wrapper {
  width: auto !important;
}
::v-deep .plTable td  {
  height: 40px !important;
  padding: 0 !important;
}
</style>