<template>
  <div>
    <div slot="title"><a-icon @click="back" style="fonntSize:20px" type="arrow-left" /> 规则维护</div>
    <!-- <div slot="extra"><p-button type="primary" @click="save">保存</p-button></div> -->
    <!-- 搜索框 -->
    <p-grid-form
      :span="8"
      :ref="tablecolumns.gridform.ref"
      :label-col="{ span: 9 }"
      :items="tablecolumns.gridform.items"
      :get-item-props="handelCustomCell"
      @submit="hanlderSubmit"
    />
    <a-divider />
    <!--1 根据商品匹配规则 -->
    <p-card :bordered="false" :headStyle="{ border: 'none' }" style="width: 100%">
      <div slot="title">
        <div>
          <div class="round">1</div>
          <div class="content">{{ tablecolumns.goods.title }}</div>
        </div>
      </div>
      <div slot="extra"><p-button type="primary" @click="Edit(true)">添加</p-button></div>
      <p-table
        bordered
        :remoteUrl="tablecolumns.goods.remoteUrl"
        :remoteParams="ruleIdParams"
        :ref="tablecolumns.goods.ref"
        :row-key="tablecolumns.goods.rowkey"
        :columns="tablecolumns.goods.columns"
        :data-source.sync="goodsdata"
        :rowSelectType="false"
      >
        <span slot="operation" slot-scope="text, record">
          <!-- <a @click.stop="Edit(false, text)">编辑</a> -->
          <div style="text-align: center;">
            <a @click.stop="FactorDels(text)">删除</a>
          </div>
        </span>
      </p-table>
    </p-card>
    <a-divider />
    <!--  2 根据规则查找货位 -->
    <p-card :bordered="false" :headStyle="{ border: 'none' }" style="width: 100%">
      <div slot="title">
        <div>
          <div class="round">2</div>
          <div class="content">{{ tablecolumns.goodsallocation.title }}</div>
        </div>
      </div>
      <div slot="extra"><p-button type="primary" @click="Edit1(true)">添加</p-button></div>
      <p-table
        bordered
        :remoteUrl="tablecolumns.goodsallocation.remoteUrl"
        :remoteParams="ruleIdParams"
        :ref="tablecolumns.goodsallocation.ref"
        :row-key="tablecolumns.goodsallocation.rowkey"
        :columns="tablecolumns.goodsallocation.columns"
        :data-source.sync="goodsallocationdata"
        :rowSelectType="false"
      >
        <span slot="operation" slot-scope="text, record">
          <!-- <a @click.stop="Edit1(false, text)">编辑</a> -->
          <!-- <a-divider type="vertical" /> -->
          <div style="text-align: center;"><a @click.stop="FactorDels(text)">删除</a></div>
        </span>
      </p-table>
    </p-card>
    <a-divider />
    <!--3 在货位中查找结果中选择合适的货位 -->
    <p-card :bordered="false" :headStyle="{ border: 'none' }" style="width: 100%">
      <div slot="title">
        <div>
          <div class="round">3</div>
          <div class="content">{{ tablecolumns.arithmetic.title }}</div>
        </div>
      </div>
      <div slot="extra">
        <a-button type="primary" @click="Addalgorithm"> 添加 </a-button>
      </div>
      <p-table
        bordered
        :remoteUrl="tablecolumns.arithmetic.remoteUrl"
        :remoteParams="ruleIdParams"
        :ref="tablecolumns.arithmetic.ref"
        :row-key="tablecolumns.arithmetic.rowkey"
        :columns="tablecolumns.arithmetic.columns"
        :data-source="arithmeticdata"
        :rowSelectType="false"
      >
        <span slot="operation" slot-scope="text, record">
          <span v-if="text.priority == 1">上移</span>
          <a v-else @click.stop="uparithmetic(text)">上移</a>
          <a-divider type="vertical" />
          <a @click.stop="downarithmetic(text)">下移</a>
          <a-divider type="vertical" />
          <a @click.stop="delarithmetic(text)">删除</a>
        </span>
      </p-table>
    </p-card>

    <edit-model
      ref="sss"
      :visible="visible"
      @hidemodel="hidemodel"
      :items="items"
      :types="type"
      :rule="rule"
    ></edit-model>
    <edit-model
      ref="sss1"
      :visible="visible1"
      @hidemodel="hidemodel"
      :items="items1"
      :types="type"
      :rule="rule"
    ></edit-model>
    <!-- 添加算法弹窗 -->
    <p-modal title="添加算法" :visible="algorithmvisible" @ok="handleOkalgorithm" @cancel="algorithmvisible = false">
      <p-grid-form
        ref="algorithm"
        width="50%"
        :span="18"
        :label-col="{ span: 4 }"
        :wrapper-col="{ span: 14 }"
        :items="algorithmitems"
      >
        <div slot="check" slot-scope="vaule" style="margin: 0">
          <p-checkbox-group :options="vaule" v-model="value" />
          <!-- {{ options }} -->
        </div>
      </p-grid-form>
    </p-modal>
  </div>
</template>

<script>
import {
  MatchFactors,
  SearchFactors,
  FactorAdd,
  FactorDel,
  Algorithm,
  AlgorithmAdd,
  AlgorithmDel,
  InfoUpdate,
  AlgorithmUp,
  AlgorithmDown,
  RuleDisableUpdate
} from '../../api'
import { model, items, items1, algorithmitems } from './config/model'
import EditModel from './model.vue'
import tablecolumns from './config/edittableconfig'
import { dictTypeSearchItems } from '@/views/kzyWMS/basedata/cargoowner/config/searchItems'
export default {
  data() {
    return {
      algorithmitems,
      type: true,
      model: model(this),
      goodsdata: [],
      goodsallocationdata: [],
      arithmeticdata: [],
      items: items(this),
      items1: items1(this),
      visible: false,
      visible1: false,
      algorithmvisible: false,
      tablecolumns: tablecolumns(this),
      params: {}
    }
  },
  props: {
    strategyType: {
      type: String,
      default: ''
    },
    rule: { type: Object, default: () => {} },
    strategy: { type: Object, default: () => {} }
  },
  components: {
    EditModel
  },
  computed: {
    remoteParams() {
      let that = this
      return {
        category: that.strategy.category
      }
    },
    ruleIdParams() {
      let that = this
      return {
        ruleId: that.rule.id
      }
    }
  },
  mounted() {
    this.SetGridValue()
  },
  methods: {
    handleOkalgorithm() {
      //添加算法确定
      let that = this
      this.$refs.algorithm.form.validateFields(async (err, value) => {
        if (!err) {
          let data = { ruleId: that.rule.id, algorithmId: value.id }
          let res = await AlgorithmAdd(data)
          //  this.$refs[tablecolumns.arithmetic.ref].reload()
          if (res.success) {
            that.algorithmvisible = false
            that.$message.success(`添加成功！${res.message}`)
            that.$refs[that.tablecolumns.arithmetic.ref].reload()
          } else {
            that.$exception(res)
          }
        }
      })
    },
    //添加算法
    Addalgorithm() {
      this.algorithmvisible = true
    },
    FactorDels(value) {
      let that = this
      this.$confirm({
        title: '是否删除?',
        okText: '确认',
        cancelText: '取消',
        async onOk() {
          let res = await FactorDel({ id: value.id })
          if (res.success) {
            that.$message.success(`删除成功！${res.message}`)
            that.reload()
          } else {
            that.$exception(res)
          }
        }
      })
    },
    async SetGridValue() {
      let that = this
      this.rule.disabled ? (this.rule.disabled = '1') : (this.rule.disabled = '0')
      this.$nextTick(() => {
        this.$refs[this.tablecolumns.gridform.ref].form.setFieldsValue(that.rule)
      })
    },
    async getAlgorithm() {
      let that = this
      let res = await Algorithm({ ruleId: that.rule.id })
    },
    //上移
    async uparithmetic(value) {
      let that = this
      let res = await AlgorithmUp({ id: value.id })
      if (res.success) {
        that.$message.success(`上移成功！${res.message}`)
        that.$refs[that.tablecolumns.arithmetic.ref].reload()
      } else {
        that.$exception(res)
      }
    },
    //下移
    async downarithmetic(value) {
      let that = this
      let res = await AlgorithmDown({ id: value.id })
      if (res.success) {
        that.$message.success(`下移成功！${res.message}`)
        that.$refs[that.tablecolumns.arithmetic.ref].reload()
      } else {
        that.$exception(res)
      }
    },
    //上移
    delarithmetic(value) {
      let that = this
      this.$confirm({
        title: '是否删除?',
        okText: '确认',
        cancelText: '取消',
        async onOk() {
          let res = await AlgorithmDel({ id: value.id })
          if (res.success) {
            that.$message.success(`删除成功！${res.message}`)
            that.$refs[that.tablecolumns.arithmetic.ref].reload()
          } else {
            that.$exception(res)
          }
        }
      })
    },
    //保存
    save() {
    },
    handleMenuClick(e) {
    },
    Edit(type, text) {
      this.type = type
      this.visible = true
      this.$refs.sss.reset()
      if (type) {
        this.items = items(this)
      } else {
        let item = this.SetItem(text.datasourceType, text.valueType)
        this.items = [...items(this), item]
        this.$refs.sss.setValue(text)
      }
    },
    SetItem(datasourceType, valueType) {
      let a = {
        name: 'value',
        label: '值',
        required: true,
        value: '',
        disabled: false
      }
      // 1
      if (datasourceType == 'input' && valueType == 'string') {
        a.type = 'input'
      }
      // 2
      if (datasourceType == 'input' && valueType == 'number') {
        a.type = 'input'
      }
      // 3
      if (datasourceType == 'input' && valueType == 'boolean') {
        a.type = 'select'
        a.options = [
          { value: '1', label: '是' },
          { value: '0', label: '否' }
        ]
      }
      // 4
      if (datasourceType == 'input' && valueType == 'datetime') {
        a.type = 'date'
        a.format = 'YYYY-MM-DD HH:mm:ss'
      }
      // 5
      if (datasourceType == 'enum') {
        a.type = 'input'
      }
      // 6
      if (datasourceType == 'range') {
        a.type = 'input'
      }
      //7
      if (datasourceType == 'interface') {
        a.type = 'select'
        a.options = [
          { value: '1', label: '是' },
          { value: '0', label: '否' }
        ]
      }
      return a
    },
    Edit1(type, text) {
      this.type = type
      this.visible1 = true
      this.$refs.sss1.reset()
      if (type) {
        this.items1 = items1(this)
      } else {
        let item = this.SetItem(text.datasourceType, text.valueType)
        this.items1 = [...items1(this), item]
        this.$refs.sss1.setValue(text)
      }
    },
    reload() {
      this.$refs[this.tablecolumns.goods.ref].reload()
      this.$refs[this.tablecolumns.goodsallocation.ref].reload()
    },
    hidemodel(value) {
      this.visible = false
      this.visible1 = false
      //   if (value) {
      this.$refs[this.tablecolumns.goods.ref].reload()
      this.$refs[this.tablecolumns.goodsallocation.ref].reload()
      //   }
    },
    handelCustomCell(name, type, form) {
      if (name === 'field-search')
        return {
          props: {
            remoteParams: this.params
          }
        }
    },
    back() {
      this.$emit('back', true)
    },
    hanlderSubmit(event, form) {
      let that = this
      event.preventDefault()
      form.validateFields(async (err, value) => {
        let data = {
          id: that.rule.id,
          name: value.name,
          strategyId: that.strategy.id
        }
        let res = await InfoUpdate(data)
        if (res.success) {
          that.$message.success(`修改成功成功！${res.message}`)
        } else {
          that.$exception(res)
        }
      })
    }
  }
}
</script>

<style scoped>
.round {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #ffb30b;
  font-size: 21px;
  color: #ffffff;
  text-align: center;
  /* line-height: 32px; */
  float: left;
}
.content {
  float: left;
  height: 32px;
  line-height: 32px;
  margin-left: 8px;
}
</style>
