<template>
  <div style="height:100%">
    <data-grid :model="model" class="table_sy"   partial='list' v-ref:grid >
      <template partial='head' >
        <tr>
          <th><nobr>序号</nobr></th>
          <th><nobr>停用时间</nobr></th>
          <th><nobr>操作人</nobr></th>
          <th><nobr>停用原因</nobr></th>
          <th><nobr>其他原因</nobr></th>
          <th><nobr>状态</nobr></th>
          <th><nobr>操作</nobr></th>
        </tr>
      </template>
      <template partial='body' >
        <tr >
          <td style="text-align:center;white-space:nowrap;">{{$index+1}}</td>
          <td style="text-align:center;white-space:nowrap;">{{row.f_operate_date}}</td>
          <td style="text-align:center;white-space:nowrap;">{{row.f_operator}}</td>
          <td style="text-align:center;white-space:nowrap;">{{row.f_comments}}</td>
          <td style="text-align:center;white-space:nowrap;">{{row.f_othereason}}</td>
          <td style="text-align:center;white-space:nowrap;">{{row.f_disable_state}}</td>
          <td style="text-align:center;white-space:nowrap;">
            <button
              :class="{'btn-green': row.f_disable_state !== '启用', 'btn-gray': row.f_disable_state === '启用'}"
              :disabled="row.f_disable_state === '启用'"
              @click="$parent.$parent.enableDisable(row)">
              {{ row.f_disable_state === '启用' ? '已启用' : '启用' }}
            </button>
          </td>
        </tr>
      </template>
    </data-grid>
  </div>
</template>

<script>
import {HttpResetClass} from 'vue-client'

export default {
  title: '停用记录查询',
  data () {
    return {
      model: {rows: []},
      f_calculation: '',
      cardCental: false,
      hasCardCental: false
    }
  },
  props: ['searchdata'],
  ready () {
    this.getsalerecord()
  },
  computed: {
    areAllEnabled () {
      // 检查所有行的状态是否都为 "启用"
      let i = this.model.rows.every(row => row.f_disable_state === '启用')
      console.log('123456', i)
      return this.model.rows.every(row => row.f_disable_state === '启用')
    }
  },
  methods: {
    cancel () {
      this.cardCental = false
    },
    async getsalerecord () {
      let http = new HttpResetClass()
      // this.condition = `1=1 and f_user_id = '${this.searchdata.f_user_id}'`
      this.condition = `1=1 and f_userinfo_id = '${this.searchdata.f_userinfo_id}' and t.f_operate_date != (
      select max(f_operate_date)
      from t_disable
      where f_userinfo_id = '${this.searchdata.f_userinfo_id}'
    )`
      let record = await http.load('POST', 'rs/sql/disableQuery', {data: {condition: this.condition, orderitem: `f_operate_date desc`}}, {
        rejectMsg: '停用记录查询出错！！',
        resolveMsg: null
      })
      this.model.rows = record.data
    },
    async enableDisable (row) {
      // 更新表 t_disable 的 f_disable_state 字段为 '启用'
      let http = new HttpResetClass()
      try {
        await http.load('POST', 'rs/logic/updateDisableState', {
          data: {
            id: row.id, // 假设 `row` 中有主键字段 `id`
            f_disable_state: '启用'
          }
        }, {
          resolveMsg: '启用成功！',
          rejectMsg: '启用失败！'
        })
        // 更新本地数据
        row.f_disable_state = '启用'
      } catch (error) {
        console.error('启用失败', error)
      }
    }
  },
  watch: {
    'searchdata' () {
      this.getsalerecord()
    },
    'model.rows': {
      handler () {
        const allEnabled = this.model.rows.every(row => row.f_disable_state === '启用')
        this.$emit('updatedata', allEnabled)
      },
      deep: true
    }
  }
}
</script>
<style scoped>
.btn-green {
  background-color: green;
  color: white;
  border: none;
  padding: 5px 10px;
  border-radius: 3px;
  cursor: pointer;
}
.btn-gray {
  background-color: gray;
  color: white;
  border: none;
  padding: 5px 10px;
  border-radius: 3px;
  cursor: not-allowed;
}
</style>
