xt_vue/src/xt_pages/upload/fast/FastProvince.vue

<template>
  <div class="patient-container">
    <el-dialog
      title="提示"
      :visible.sync="dialogVisible"
      width="40%"
    >
      <div style="text-align: center">
        <p>您选择的区域酷医云暂未对接，请联系酷医云客服，我们将免费为您实现对接</p>
        <img style="width: 150px;height: 150px" src="../../../assets/home/kuyi_wechat.jpg"/>
        <p>服务热线</p>
        <p style="font-size: 16px">18682074632</p>
      </div>


      <span slot="footer" class="dialog-footer">
    <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
  </span>
    </el-dialog>

    <div class="cell clearfix">
      <el-form :model="form" ref="ruleForm" label-width="100px" class="demo-ruleForm" style="text-align: center">
        <el-form-item label="地区">
          <el-select v-model="form.province" clearable filterable placeholder="请选择" @change="changeProvince">
            <el-option
              v-for="item in provinces"
              :key="item.id"
              :label="item.name"
              :value="item.id">
            </el-option>
          </el-select>
          <el-select v-model="form.city" disabled filterable placeholder="请选择" >
            <el-option
              v-for="item in citys"
              :key="item.id"
              :label="item.name"
              :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
    </div>

  </div>
</template>

<script>
  import { GetDistrictsByUpid } from '@/api/district'
  import { getIsDocking } from '@/api/config'

  export default {
    name: 'FastProvince',
    data() {
      return {
        signAndWeighBoxPatients: 'sign-and-weigh-box-patients',
        start_time: '',
        dialogVisible: false,
        end_time: '',
        provinces: [],
        citys:[],
        form: {
          province: '',
          city: ''
        }

      }
    }, created() {
      this.getDistricts()
      var province = sessionStorage.getItem('province')
      if (province == null) {
        this.form.province = ''
      } else {
        this.form.province = parseInt(province)
      }

    }, methods: {
      getDistricts: function() {
        GetDistrictsByUpid({ id: 0 }).then(response => {
          var res = response.data
          if (res.state === 1) {
            this.provinces = res.data.citys
          }
        }).catch(e => {

        })

      }, changeProvince(id) {
        getIsDocking({ config_type: 2, province: id, city: 0 }).then(response => {
          var res = response.data
          if (res.state == 1) {
            if (res.data.is_docking == 2) {
              this.$message.error('该地区尚未对接,请联系客服')
              this.dialogVisible = true
              this.form.province = ''

            } else {
              this.form.province = id
              this.dialogVisible = false
              sessionStorage.setItem('province', id)
            }
          } else {
            this.$message.error(res.msg)
          }
        }).catch(e => {
        })
      }

    }
  }
</script>

<style scoped>

</style>