<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" :inline="true" size="small">
      <template v-if="roleType == 'gov'">
        <el-form-item label="市" prop="cityId" v-if="userType == 'GOV_PROV'">
          <el-select v-model="queryParams.cityId" placeholder="请选择市" @change="getDistrictData" filterable style="width: 200px;">
            <el-option v-for="(item, index) in cityDataList" :key="index" :label="item.name" :value="item.id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="区" prop="districtId" v-if="userType == 'GOV_PROV' || userType == 'GOV_CITY'">
          <el-select v-model="queryParams.districtId" placeholder="请选择区" filterable style="width: 200px;">
            <el-option v-for="(item, index) in districtDataList" :key="index" :label="item.name" :value="item.id"></el-option>
          </el-select>
        </el-form-item>
      </template>
      <template v-else>
        <el-form-item label="省" prop="provinceId">
          <el-select v-model="queryParams.provinceId" placeholder="请选择省" @change="getCityData" filterable style="width: 200px;">
            <el-option v-for="(item,index) in provinceDataList" :key="index" :label="item.name" :value="item.id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="市" prop="cityId">
          <el-select v-model="queryParams.cityId" placeholder="请选择市" @change="getDistrictData" filterable style="width: 200px;">
            <el-option v-for="(item, index) in cityDataList" :key="index" :label="item.name" :value="item.id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="区" prop="districtId">
          <el-select v-model="queryParams.districtId" placeholder="请选择区" filterable style="width: 200px;">
            <el-option v-for="(item, index) in districtDataList" :key="index" :label="item.name" :value="item.id"></el-option>
          </el-select>
        </el-form-item>
      </template>
      <el-form-item label="企业名称" prop="entName">
        <el-input v-model="queryParams.entName" clearable style="width: 200px;" placeholder="请输入企业名称"></el-input>
      </el-form-item>
      <el-form-item label="社会信用代码" prop="license">
        <el-input v-model="queryParams.license" style="width: 200px;" placeholder="请输入社会信用代码"></el-input>
      </el-form-item>
      <el-form-item label="服务状态" prop="entState">
        <el-select v-model="queryParams.entState" style="width: 200px;" placeholder="请选择">
          <el-option v-for="(item, index) in entStateOptions" :key="index" :label="item.dictLabel" :value="item.dictValue"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="审核状态" prop="authState">
        <el-select v-model="queryParams.authState" style="width: 200px;" placeholder="请选择">
          <el-option v-for="(item, index) in authStateEntOptions" :key="index" :label="item.dictLabel" :value="item.dictValue"></el-option>
        </el-select>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="handleQuery">搜索</el-button>
        <el-button @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>
    <h3 class="toolbar">
      <span class="title">列表</span>
      <div class="tool">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd" v-if="roleType =='manager'">新增企业</el-button>
      </div>
    </h3>
    <el-table v-loading="loading" :data="list" border>
      <el-table-column label="账户" prop="userName" width="240" align="center" />
      <el-table-column label="企业名称" prop="entName" align="center" width="240"></el-table-column>
      <el-table-column label="省市区" prop="provinceName" align="center" width="240">
        <template slot-scope="scope">
          <span>{{scope.row.provinceName}}{{scope.row.cityName}}{{scope.row.districtName}}</span>
        </template>
      </el-table-column>
      <!-- <el-table-column label="社会信用代码" prop="license" align="center" width="240"></el-table-column> -->
      <el-table-column label="联系人" align="center" prop="linkName" width="240"></el-table-column>
      <el-table-column label="联系人手机号" prop="linkMobile" align="center" width="240"></el-table-column>
      <!-- <el-table-column label="联系人邮箱" prop="linkEmail" align="center" width="240"></el-table-column> -->
      <el-table-column label="创建时间" prop="createTime" align="center" width="240"></el-table-column>
      <el-table-column label="服务时间" align="center" width="240">
        <template slot-scope="scope">
          <template v-if="scope.row.entState == '1'">
            <div>--</div>
          </template>
          <template v-else-if="scope.row.entState == '2'">
            <div>{{scope.row.startDate}} - {{scope.row.endDate}}</div>
            <el-button @click="handleEdit(scope.row)" type="text" size="small">修改服务时间</el-button>
            <el-button @click="handleRecord(scope.row)" type="text" size="small">修改记录</el-button>
          </template>
          <template v-else>
            <div>已到期</div>
            <el-button @click="handleEdit(scope.row)" type="text" size="small">修改服务时间</el-button>
            <el-button @click="handleRecord(scope.row)" type="text" size="small">修改记录</el-button>
          </template>
        </template>
      </el-table-column>
      <el-table-column label="服务状态" prop="entState" align="center" width="120" :formatter="entSateFormat">
        <template slot-scope="scope">
          <template v-if="scope.row.authState == '3'">
            <span>驳回</span>
          </template>
          <template v-else>
            <span>{{scope.row.entState | entStateMode}}</span>
          </template>
        </template>
      </el-table-column>
      <el-table-column label="审核状态" prop="authState" align="center" width="120" :formatter="authStateFormat"></el-table-column>
      <el-table-column label="操作" align="center" width="300" class-name="small-padding fixed-width" fixed="right">
        <template slot-scope="scope">
          <el-button type="text" @click="handleView(scope.row)">查看</el-button>
          <!-- 只有科德管理员才可以有以下操作 -->
          <template v-if="roleType =='manager'">
            <el-button type="text" @click="handleResetPwd(scope.row)">重置密码</el-button>
            <el-button type="text" @click="handleAudit(scope.row)" v-if="scope.row.authState == '1'">审核</el-button>
            <!-- 只有审核通过 authState才可以修改 -->
            <el-button type="text" @click="handleUpdate(scope.row)" v-if="scope.row.authState == '2'">修改</el-button>
            <!-- 只有服务中且审核状态为已通过才可以停用 -->
            <el-button type="text" @click="handleStop(scope.row)" v-if="scope.row.entState == '2' && scope.row.authState == '2'">停用</el-button>
            <el-button type="text" @click="handleEnable(scope.row)" v-if="scope.row.entState == '4' && scope.row.authState == '2'">启用</el-button>
            <!-- 只有服务状态为已到期才可以提醒 -->
            <el-button type="text" @click="handleRemind(scope.row)" v-if="scope.row.entState == '3'">提醒</el-button>
            <!-- 审核状态为已驳回不可以删除 -->
            <!-- <el-button type="text" @click="handleDelete(scope.row)" v-if="scope.row.authState != '3'">删除</el-button> -->
          </template>
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"/>

      <audit-ent v-if="auditEntVisible" ref="auditEnt" @refreshData="getList()"></audit-ent>
      <record v-if="recordVisible" ref="record" @refreshData="getList()"></record>
  </div>
</template>
<!-- 企业管理模块只有科德管理员和税务人员 -->
<script>
  import {getProvinceDataApi,getRegionChildrenApi} from "@/api/common/common"
  import {listEntApi, deleteEntApi, resetPwdApi, remindUserApi, stopEntUserApi,enableEntUserApi} from '@/api/admin/ent/ent'
  import {entStateOptions, getLabel, authStateEntOptions} from '@/utils/dataFormat'
  import {listEntTaxApi} from '@/api/gov/gov'
  import { resetUserPwd } from "@/api/system/user";
  import AuditEnt from "./components/service"
  import Record from "./components/record"
  export default {
    components: {
      AuditEnt,
      Record
    },
    data () {
      return {
        auditEntVisible: false,
        loading: false,
        provinceDataList: [],
        cityDataList: [],
        districtDataList: [],
        recordVisible: false,
        entStateOptions: entStateOptions,
        authStateEntOptions: authStateEntOptions,
        dateRange: [],
        roleType: '',
        queryParams: {
          pageNum: 1,
          pageSize: 10,
          provinceId: undefined,
          cityId: undefined,
          districtId: undefined,
          entName: '',
          license: '',
          entState: '',
          authState: '',
        },
        list: [],
        total: 0,
        open: false,
        openInfo: false,
      }
    },
    created() {
      this.roleType = this.roles.join(',')
      this.getList()
      if(this.userType == 'GOV_PROV' || this.userType == 'GOV_CITY') {
        this.getAreaData()
      }
      if(this.roleType != 'gov') {
        this.getProvinceData()
      }
    },
    computed: {
      roles() {
        return this.$store.state.user.roles
      },
      scopeId() {
        return this.$store.state.user.scopeId
      },
      userType() {
        return this.$store.state.user.userType
      }
    },
    filters: {
      entStateMode(val) {
        switch(val) {
          case 1:
            return '待审核';
          case 2:
            return '服务中';
          case 3:
            return '已过期';
          case 4:
            return '冻结';
          default:
            return "";
        }
      }
    },
    methods: {
      /** 修改服务时间 */
      handleEdit(row){
        this.auditEntVisible = true
        this.$nextTick(() => {
          this.$refs.auditEnt.init(row.id)
        })
      },
      handleRecord(row) {
        this.recordVisible = true
        this.$nextTick(() => {
          this.$refs.record.init(row.id)
        })
      },
      getAreaData() {
        getRegionChildrenApi(this.scopeId).then(res => {
          if(res.code == 200) {
            if(this.userType == 'GOV_PROV') {
              this.cityDataList = res.data
            }else if(this.userType == 'GOV_CITY') {
              this.districtDataList = res.data
            }

          }
        })
      },
      //选择省份
      getCityData() {
        this.queryParams.cityId = ''
        this.queryParams.districtId = ''
        getRegionChildrenApi(this.queryParams.provinceId).then(res => {
          if(res.code == 200) {
            this.cityDataList = res.data
          }
        })
      },
      //选择市
      getDistrictData() {
        this.queryParams.districtId = ''
        getRegionChildrenApi(this.queryParams.cityId).then(res => {
          if(res.code == 200) {
            this.districtDataList = res.data
          }
        })
      },
      getProvinceData() {
        getProvinceDataApi().then(res => {
          if(res.code == 200) {
            this.provinceDataList = res.data
          }
        })
      },
      //列表数据区分科德管理员还是税务人员
      getList() {
        this.loading = true;
        if(this.roleType == 'manager') {
          listEntApi(this.queryParams).then(response => {
            this.list = response.data.records;
            this.total = response.data.total;
            this.loading = false;
          });
        }else if(this.roleType == 'gov') {
          listEntTaxApi(this.queryParams).then(response => {
            this.list = response.data.records;
            this.total = response.data.total;
            this.loading = false;
          });
        }

      },
      handleAdd() {
        this.$router.push("/ent/add"+'?type=add')
      },
      handleUpdate(row) {
        this.$router.push("/ent/edit/"+row.id+'?type=update')
      },
      // 审核
      handleAudit(row) {
        this.$router.push("/ent/info/"+row.id+'?type=audit')
      },
      // 查看
      handleView(row) {
        this.$router.push("/ent/info/"+row.id+'?type=view')
      },
      // //重置密码
      handleResetPwd(row) {
        this.$confirm('是否确认重置密码?', "警告", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(function() {
            return resetPwdApi(row.id);
          }).then(() => {
            this.queryParams.pageNum = 1;
            this.getList();
            setTimeout(() => {        // 加延时
              this.$modal.msgSuccess("重置密码成功，新密码是：123456");
            }, 500);
          })
      },
      handleRemind(row) {
        this.$confirm('是否确认提醒用户服务时间到期?', "警告", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(function() {
            return remindUserApi(row.id);
          }).then(() => {
            this.queryParams.pageNum = 1;
            this.getList();
            this.$message({
              message: '提醒成功',
              type: 'success'
            });
          })
      },
      handleStop(row) {
        this.$confirm('是否确认停用该企业账号?', "警告", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(function() {
            return stopEntUserApi(row.id);
          }).then(() => {
            this.queryParams.pageNum = 1;
            this.getList();
            this.$message({
              message: '停用成功',
              type: 'success'
            });
          })
      },
      handleEnable(row) {
        this.$confirm('是否确认启用该企业账号?', "警告", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(function() {
            return enableEntUserApi(row.id);
          }).then(() => {
            this.queryParams.pageNum = 1;
            this.getList();
            this.$message({
              message: '启用成功',
              type: 'success'
            });
          })
      },
      handleDelete(row) {
        const id = row.id;
        this.$confirm('是否确认删除该数据?', "警告", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(function() {
            return deleteEntApi(id);
          }).then(() => {
            this.queryParams.pageNum = 1;
            this.getList();
            this.$message({
              message: '删除成功',
              type: 'success'
            });
          })
      },
      // 重置
      resetQuery() {
        this.dateRange = [];
        this.resetForm("queryForm");
        this.handleQuery();
      },
      // 搜索
      handleQuery() {
        this.queryParams.pageNum = 1;
        this.getList();
      },
      statusFormat(row, col, val, index) {
        return getLabel(accessStatus, val)
      },
      entSateFormat(row, col, val, index) {
        return getLabel(entStateOptions, val)
      },
      authStateFormat(row, col, val, index) {
        return getLabel(authStateEntOptions, val)
      }
    }
  }
</script>

<style>
</style>
