<template>
  <section class="electionAdd">
    <ai-detail>
      <ai-title slot="title" title="添加换届选举" isShowBottomBorder isShowBack @onBackClick="cancel(true)"/>
      <template slot="content">
        <ai-card title="基本信息">
          <template #content>
            <div class="add-form">
              <el-form ref="form" :model="form" :rules="formRules" size="small"  label-width="150px">

                <el-form-item label="标题" prop="licenseName">
                  <el-input v-model="form.licenseName" placeholder="请输入" show-word-limit maxlength="100"></el-input>
                </el-form-item>

                <el-form-item label="投票说明" prop="licenseName">
                  <el-input type="textarea" :rows="5" v-model="form.licenseName" placeholder="请输入" show-word-limit maxlength="500"></el-input>
                </el-form-item>

                <el-form-item label="单位名称" prop="licenseOrganization">
                  <el-input size="small" disabled placeholder="请选择所属党组织" v-model="form.partyOrgName">
                    <template slot="append">
                      <ai-party :instance="instance" size="small" :value="form.partyOrgId" @origin="handlePartyOrgSelect"/>
                    </template>
                  </el-input>
                </el-form-item>

                <el-form-item label="选举方式" prop="licenseOrganization">
                  <el-radio v-model="form.radio" label="1">等额</el-radio>
                  <el-radio v-model="form.radio" label="2">差额</el-radio>
                </el-form-item>
                
                <el-row type="flex">
                  <el-col :span="20">
                    <el-form-item label="应选人数" prop="licenseCode">
                      <el-input type="number" v-model="form.licenseCode" placeholder="请输入"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="20">
                    <el-form-item label="投票日期" prop="decisionDate">
                      <el-date-picker v-model="form.decisionDate" value-format="yyyy-MM-dd" type="date" placeholder="选择日期" style="width:338px">
                      </el-date-picker>
                    </el-form-item>
                  </el-col>
                </el-row>

                <el-form-item label="候选人" prop="licenseOrganization">
                  <ai-person-select :instance="instance" :customClicker="true" :chooseUserList="chooseUserList"
                      url="/app/appgirdmemberinfo/list" headerTitle="党员列表"
                      :isMultiple="true" dialogTitle="选择" @selectPerson="selectPerson" class="aipersonselect">
                    <template name="option" v-slot:option="{ item }">
                      <span class="iconfont iconProlife">{{ item.name }}</span>
                      <span>{{ item.phone }}</span>
                      <!-- <span>{{ item}}</span> -->
                    </template>
                  </ai-person-select>
                </el-form-item>

                <el-form-item label="投票人" prop="licenseOrganization">
                  <ai-person-select :instance="instance" :customClicker="true" :chooseUserList="chooseUserList"
                      url="/app/appgirdmemberinfo/list" headerTitle="党员列表"
                       dialogTitle="选择" @selectPerson="selectPerson" class="aipersonselect">
                    <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>
            </div>
          </template>
        </ai-card>
      </template>
      <template slot="footer" class="footer">
        <el-button class="delete-btn footer-btn" @click="cancel(false)">取消</el-button>
        <el-button class="footer-btn" type="primary" @click="confirm()">保存</el-button>
      </template>
    </ai-detail>
    <!-- <ai-detail class="add" v-if="id && !isEdit">
      <template slot="title">
        <ai-title title="行政许可信息详情" isShowBack isShowBottomBorder @onBackClick="cancel(false)"></ai-title>
      </template>
      <template slot="content">
        <ai-card title="基本信息">
          <template #right>
            <span style="color:#2266FF;cursor: pointer;font-size: 12px;" class="iconfont iconEdit" v-if="isEdit==false" @click="edit">修改</span>
          </template>
          <template #content v-if="isEdit == false">
            <ai-wrapper>
              <ai-info-item label="许可文书名称" :value="data.licenseName"></ai-info-item>
              <ai-info-item label="许可文书号" :value="data.licenseCode"></ai-info-item>
              <ai-info-item label="许可决定日期" :value="data.decisionDate"></ai-info-item>
              <ai-info-item label="许可有效期自" :value="data.startDate"></ai-info-item>
              <ai-info-item label="许可有效期至" :value="data.endDate"></ai-info-item>
              <ai-info-item label="许可机关" isLine :value="data.licenseOrganization"></ai-info-item>
              <ai-info-item label="经营主体" isLine :value="data.enterpriseName"></ai-info-item>
              <ai-info-item label="统一信用代码" isLine :value="data.unifiedCode"></ai-info-item>
              <ai-info-item label="许可内容" isLine :value="data.licenseContent"></ai-info-item>
            </ai-wrapper>
          </template>
        </ai-card>
      </template>
    </ai-detail> -->
  </section>
</template>

<script>
export default {
  name: "electionAdd",
  props: {
    instance: Function,
    dict: Object,
    permissions: Function
  },
  data() {
    return {
      form: {

      },
    }
  },
  methods: {
    cancel (isRefresh) {
      this.$emit('change', {
        type: 'electionList',
        isRefresh: !!isRefresh
      })
    }
  },
}
</script>

<style lang="scss" scope>
.electionAdd {
  height: 100%;

  ::v-deep .el-date-editor .el-input {
    width: 100%;
  }
}
</style>