<template>
  <el-dialog
    title="绑定站点"
    :visible.sync="dialogVisible"
    width="500px"
    @closed="closedHandler"
    :close-on-click-modal="false"
  >
    <el-form
      ref="dataForm"
      :model="dataForm"
      size="small"
      label-width="150px"
      :rules="rules"
      v-loading="loading"
    >
      <el-form-item
        label="站点名称"
        prop="siteId"
      >
        <el-select
          v-model="dataForm.siteId"
          placeholder="请选择站点"
          style="width: 100%"
        >
          <el-option
            v-for="item in siteList"
            :label="item.siteName"
            :key="item.id"
            :value="item.id"
          />
        </el-select>
      </el-form-item>
    </el-form>
    <span
      slot="footer"
      class="dialog-footer"
    >
      <el-button
        size="small"
        @click="dialogVisible = false"
      >取 消</el-button>
      <el-button
        type="primary"
        size="small"
        @click="submitForm()"
      >确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
import { queryTeamEmergencyCarInfo, bindSiteToEmergencyCar } from '@/api/emergencyCar'
import { queryEmergencySiteList } from '@/api/site'
export default {
  data() {
    return {
      dialogVisible: false,
      loading: false,
      dataForm: {
        siteId: '',
        hospitalCode: ''
      },
      siteList: [],
      rules: {
        siteId: [
          { required: true, message: '请选择站点' },
        ],
        hospitalCode: [
          { required: true, message: '请选择上级医院' },
        ]
      }
    }
  },
  mounted() {
    queryEmergencySiteList().then(res => {
      this.siteList = res.respData
    })
  },
  methods: {
    init(id) {
      this.dialogVisible = true
      this.loading = true
      if (!id) {
        this.$message.error('救护车id不能为空')
        return
      }
      queryTeamEmergencyCarInfo({ id: id }).then(res => {
        if (res.msg === 201) {
          const { hospitalCode, siteId } = res.respData
          this.dataForm = {
            id: id,
            hospitalCode: hospitalCode,
            siteId: siteId
          }
          this.$nextTick(() => {
            this.loading = false
            this.$refs.dataForm.clearValidate()
          })
        } else {
          this.$message.error(res.content);
        }
      })

    },
    submitForm() {
      this.$refs.dataForm.validate((valid) => {
        if (valid) {
          const params = {
            ...this.dataForm
          }

          const site = this.siteList.find(i => i.id === this.dataForm.siteId)
          if (!site) {
            this.$message.error('无效数据');
            return
          }
          const { siteName } = site
          params.siteName = siteName
          bindSiteToEmergencyCar(params).then(res => {
            if (res.msg === 201) {
              this.dialogVisible = false
              this.$message.success('绑定成功')
              this.$emit('subsucc')
            } else {
              this.$message.error(res.content)
            }
          })
        }
      })
    },
    closedHandler() {
      this.$refs.dataForm.resetFields()
    }
  }
}
</script>

<style>
</style>