<template>
  <div class="scoreChange">
    <ai-list isTabs>
      <template slot="content">
        <ai-search-bar bottomBorder>
          <template slot="left">
            <el-button type="primary" icon="iconfont iconAdd" @click="dialog=true">添加</el-button>
          </template>
        </ai-search-bar>
        <ai-table
            :tableData="tableData"
            :col-configs="colConfigs"
            :total="page.total" :dict="dict"
            :current.sync="page.current"
            :size.sync="page.size"
            @getList="getList">
        </ai-table>
      </template>
    </ai-list>
    <ai-dialog
        title="添加积分调整"
        :visible.sync="dialog"
        :destroyOnClose="true"
        width="720px"
        @onConfirm="onConfirm"
        @closed="form={}">
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="选择人员" prop="partyId">
          <ai-person-select :instance="instance" :customClicker="true"
                            :url="'/app/appparty/list?partyOrgId=' + user.info.organizationId"
                            :isMultiple="false" dialogTitle="选择" @selectPerson="selectPerson">
            <template name="option" v-slot:option="{ item }">
              <span class="iconfont iconProlife">{{ item.name }}</span>
              <ai-id mode="show" :show-eyes="false" :value="item.idNumber"/>
            </template>
          </ai-person-select>
        </el-form-item>
        <el-form-item label="调整说明" prop="remark">
          <el-input v-model.trim="form.remark" placeholder="请输入..." type="textarea" :rows="4" show-word-limit
                    maxlength="100"></el-input>
        </el-form-item>
        <el-form-item label="类型" prop="integralType">
          <ai-select v-model="form.integralType" :selectList="dict.getDict('partyIntegralType')"/>
        </el-form-item>
        <el-form-item label="积分" prop="integral">
          <el-input v-model.trim.num ="form.integral" placeholder="请输入正数" size="small"></el-input>
        </el-form-item>
      </el-form>
    </ai-dialog>
  </div>
</template>

<script>
import {mapState} from "vuex"

export default {
  name: "scoreChange",
  props: {
    instance: Function,
    dict: Object,
  },
  data() {
    return {
      tableData: [],
      page: {
        current: 1,
        size: 10,
        total: 10
      },
      form: {
        partyId: '',
        partyName: '',
        remark: '',
        integralType: '',
        integral: '',
      },
      dialog: false,
      flag: false,
    }
  },
  computed: {
    ...mapState(["user"]),
    rules() {
      return {
        partyId: [{required: true, message: '请选择人员', trigger: 'blur'},],
        remark: [{required: true, message: '请输入调整说明', trigger: 'blur'},],
        integralType: [{required: true, message: '请选择类型', trigger: 'change'},],
        integral: [{required: true, validator: (r, v, cb) => v > 0 ? cb() : cb("请输入正数")}],
      }
    },
    colConfigs() {
      return [
        {prop: "partyName", label: "姓名",},
        {prop: "remark", label: "调整说明", align: 'center'},
        {prop: "integralType", label: "类型", dict: "partyIntegralType", align: 'center'},
        {prop: "integral", label: "积分", align: "center", render: (h, {row}) => h('p',{textAlign:'center'}, `${row.integralType == 1 ? '+' : '-'}${row.integral}`)},
        {prop: "createTime", label: "操作时间", align: 'center'},
        {prop: "createUserName", label: "操作人", align: "center"},
      ]
    }
  },
  methods: {
    selectPerson(val) {
      if (val) {
        this.form.partyId = val.id
        this.form.partyName = val.name
      } else {
        this.form.partyId = ""
        this.form.partyName = ""
      }
    },
    onConfirm() {
      if(this.flag) return 
      this.$refs['form'].validate(valid => {
        if (valid) {
          this.flag = true
          this.instance.post(`/app/apppartyintegralinfo/changeIntegral`,  this.form ).then(res => {
            if (res?.code == 0) {
              this.$message.success("添加成功")
              this.dialog = false
              this.getList()
            } else {
              this.flag = false
            }
          }).catch(() => {
            this.flag = false
          })
        }
      })
    },
    getList() {
      this.instance.post(`/app/apppartyintegralinfo/list`, null, {
        params: {...this.page, type: 0}
      }).then(res => {
        if (res?.data) {
          this.tableData = res.data.records
          this.page.total = res.data.total
        }
      })
    }
  },
  created() {
    this.getList()
  }
}
</script>

<style lang="scss" scoped>
.scoreChange {
  height: 100%;
  overflow: auto;
}
</style>
