<template>
  <div class="app-container">
    <van-nav-bar
      left-arrow
      fixed
      placeholder
      @click-left="$router.back(-1)"
    >
      <template #title>
        <p style="font-weight: bold;">添加重大事项</p>
      </template>
<!--      <template #right>-->
<!--        <van-icon name="../../../static/images/icon/icon_flow.png" size="20" @click="goFlow"/>-->
<!--      </template>-->
    </van-nav-bar>
    <van-form @submit="getChange" @failed="getError" :show-error-message="false" scroll-to-error validate-first>
      <p class="main_title">基础信息</p>
      <div class="main_box">
        <van-field
          label="事项名称"
          v-model="form.eventName"
          placeholder="请输入事项名称"
          input-align="right"
          label-width="auto"
          required
          :rules="[{ required: true , message:'请输入事项名称' }]"
        />
        <van-field
          readonly
          clickable
          required
          :rules="[{ required: true , message:'请选择事项类型' }]"
          label="事项类型"
          placeholder="请选择"
          v-model="majorType"
          @click="showcapital = true"
          input-align="right"
          right-icon="arrow-down"
          label-width="auto"
        />
        <van-popup v-model="showcapital" position="bottom">
          <van-picker
            show-toolbar
            :columns="majorTypeOptions"
            @confirm="onConfirmCapital"
            @cancel="showcapital = false"
          />
        </van-popup>
        <van-field
          readonly
          clickable
          required
          :rules="[{ required: true , message:'请选择发生日期'  }]"
          v-model="form.eventTime"
          label="发生日期"
          placeholder="请选择发生日期"
          @click="showlasj = true"
          input-align="right"
          right-icon="arrow-down"
        />
        <van-popup v-model="showlasj" position="bottom">
          <van-datetime-picker
            v-model="currentDate"
            type="date"
            title="选择年月日"
            :min-date="minDate"
            :max-date="maxDate"
            @confirm="onConfirmLasj"
            @cancel="showlasj = false"
          />
        </van-popup>
        <van-field
          readonly
          clickable
          label="审批流程"
          placeholder="请选择"
          v-model="form.approvalTemplateName"
          @click="showtemplate = true"
          input-align="right"
          right-icon="arrow-down"
          required
          :rules="[{ required: true , message:'请选择审批流程' }]"
        />
        <van-popup v-model="showtemplate" position="bottom">
          <van-picker
            show-toolbar
            value-key="name"
            :columns="templateList"
            @confirm="onConfirmTemplate"
            @cancel="showtemplate = false"
          />
        </van-popup>
        <van-field
          label="事项内容"
          input-align="right"
          label-width="auto"
          readonly
        />
        <van-field
          v-model="form.eventContent"
          type="textarea"
          placeholder="请输入事项内容"
          rows="4"
          required
          :rules="[{ required: true , message:'请输入事项内容'  }]"
        />
        <van-field label="理事会提议" input-align="right" label-width="auto" readonly />
        <van-field v-model="form.dzbty" type="textarea" placeholder="请输入理事会提议/村党支部提议" rows="2" required :rules="[{ required: true , message:'请输入理事会提议/村党支部提议'  }]" />
        <van-field label="村党支部和理事会商议" input-align="right" label-width="auto" readonly />
        <van-field v-model="form.lwhsy" type="textarea" placeholder="请输入村党支部和理事会商议/两委会商议" rows="2" required :rules="[{ required: true , message:'请输入村党支部和理事会商议/两委会商议'  }]" />
        <van-field label="党员会审议" input-align="right" label-width="auto" readonly />
        <van-field v-model="form.dqyshsyhjy" type="textarea" placeholder="请输入党员会审议/党群议事会审议和决议" rows="2" required :rules="[{ required: true , message:'请输入党员会审议/党群议事会审议和决议'  }]" />
        <van-field label="成员（代表）会决议" input-align="right" label-width="auto" readonly />
        <van-field v-model="form.cydbhjy" type="textarea" placeholder="请输入成员（代表）会决议/党群议事会审议和决议" rows="2" required :rules="[{ required: true , message:'请输入成员（代表）会决议/党群议事会审议和决议'  }]" />
        <van-field label="决策结果公开" input-align="right" label-width="auto" readonly />
        <van-field v-model="form.jcjggk" type="textarea" placeholder="请输入决策结果公开" rows="2" required :rules="[{ required: true , message:'请输入决策结果公开'  }]" />
        <van-field label="实施情况公开" input-align="right" label-width="auto" readonly />
        <van-field v-model="form.ssqkgk" type="textarea" placeholder="请输入实施情况公开" rows="2" required :rules="[{ required: true , message:'请输入实施情况公开'  }]" />
        <van-field label="备注" input-align="right" label-width="auto"/>
        <van-field v-model="form.remark" type="textarea" placeholder="请输入备注" rows="2"/>
      </div>

<!--      <p class="main_title">上传附件</p>-->
<!--      <div class="main_box" style="padding: 5px 0 0 8px;">-->
<!--        <van-uploader v-model="fileList" :after-read="beforeRead" @delete="deleteFile"></van-uploader>-->
<!--      </div>-->
      <div style="padding: 16px 0;">
        <van-row>
          <van-col span="6"></van-col>
          <van-col span="12" align="center">
            <!--            @click="goUpdate"-->
            <van-button type="info" native-type="submit" @click="buttonType='update'" class="submitButton">保<i style="margin-right: 1em;"></i>存</van-button>
          </van-col>
<!--          <van-col span="12" align="center">-->
<!--            &lt;!&ndash;            @click="goAdd"&ndash;&gt;-->
<!--            <van-button type="info" native-type="submit" @click="buttonType='add'" class="submitButton">保存并提交</van-button>-->
<!--          </van-col>-->
        </van-row>
        <div class="clear"></div>
      </div>
    </van-form>
  </div>
</template>

<script>
  import {addMajorevent , customSubmitMajorevent , attachmentList,listTemplate,selectApprovalByTemplateId } from "@/api/onlineHome/bankAgriculture/paymentApproval";
  import request from '@/utils/request';
  import Dialog from "vant/lib/dialog";
  import Editor from '@/components/Editor';
  import moment from "moment";
  export default {
    name: "approvalAdd3",
    components: {
      Editor,
    },
    data() {
      return {
        title:false,
        showtemplate:false,
        showcapital:false,
        showpayee:false,
        showlasj:false,
        showbankType:false,
        showproject:false,
        showFundType:false,
        showpayer:false,

        buttonType:'a',

        minDate: new Date(2000, 1, 1),
        maxDate: new Date(2050, 12, 31),
        currentDate: new Date(),
        form:{},
        fileList:[],
        capitalExpenditureType:'',
        payee:'',
        bankType:'',
        majorType:'',

        wfydlxDictionaries:[],
        jglxDictionaries:[],
        sysDictionaries:[],
        capitalExpenditureTypeOptions:[],
        bankTypeDictionaries:[],
        projectList:[],
        projectFundTypeOptions:[],
        projectFundTypeDictionaries:[],
        majorTypeOptions:[],
        templateList:[],
        projectListShow:[],
        payerOptions:[],

        chargeItme:[],
        chargeItmeShow:[],

        payeeList:[],
        // 查询参数
        queryParams: {
          transferType:"",
          orderByColumn: "id",
          isAsc: "desc",
        },
        capitalExpenditureOpen:false,
        projectForm:{
          projectId:null,
          projectName:null,
          projectContractor:null,
          projectAmount:null,
          projectBillNum:null,
          projectFundType:'1',
          outId:null,
          ynType:'2'
        },
        projectFundType:'',
        uploadFiles:[],
      };
    },
    created() {
      this.reset();
      this.getDictionaries();
      this.getTemplateList();
    },
    methods: {
      // 表单重置
      reset() {
        this.form = {
          id: null,
          upId: null,
          downId: null,
          orderId: null,
          cashierId: null,
          transferType: '3',
          accountType: '2',
          explainSituation: null,
          succeedAmount: null,
          payer: null,
          payerAccount: null,
          operatorCode: null,
          enterpriseCode: null,
          expenditureAmount: null,
          capitalExpenditureType: '1',
          majorType: null,
          dzbty: null,
          lwhsy: null,
          dqyshsyhjy: null,
          cydbhjy: null,
          jcjggk: null,
          ssqkgk: null,
          remark: null,
          transferStatus: "0",
          auditStatus: "0",
          paymentState: "1",
          bankPriority: "0",
          clientPriority: "0",
          approvalTemplateId: null
        };
        this.processList = {}
        this.projectForm={
          projectId:null,
          projectName:null,
          projectContractor:null,
          projectAmount:null,
          projectBillNum:null,
          projectFundType:'1',
          outId:null,
          ynType:'1'
        }
      },
      goFlow(){
        if(this.form.approvalMode == '1' && this.form.approvalTemplateId != undefined && this.form.approvalTemplateId != "undefined"){
          window.location='approvalProcess3?approvalTemplateId='+this.form.approvalTemplateId+'&approvalMode='+this.form.approvalMode;
        }else{
            this.$notify({ type: 'danger', message: '无审批流程！' });
        }
      },
      getChange(){
        addMajorevent(this.form).then(response => {
          this.$toast.success('保存成功');
          setTimeout(function(){
            history.go(-1)
          },2000)
        });
      },
      getDictionaries(){
        this.getDicts("major_type").then((res) => {
          for (var i = 0; i < res.data.length; i++) {
            this.majorTypeOptions.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
          }
        });
      },
      getTemplateList(){
        let templateQueryParams = {
          // 分页
          pageNum: 1,
          pageSize: 999,
          type:'5'
        };
        listTemplate(templateQueryParams).then(response => {
          this.templateList = response.rows;
        });
      },
      onConfirmTemplate(data){
        selectApprovalByTemplateId(data.id).then(res => {
          this.showtemplate = false;
          if(res.approvalDetails.length>0){
            this.form.approvalTemplateName = data.name
            this.form.approvalTemplateId = data.id
          }else{
            this.form.approvalTemplateName = null
            this.form.approvalTemplateId = null
            this.$notify({ type: 'danger', message: '此流程无节点，无法选择！' });
          }
        })
      },
      onConfirmCapital(data){
        this.majorType = data.text;
        this.form.majorType = data.value;
        this.showcapital = false;
      },
      getError(e){
        console.log(e)
        this.$notify({ type: 'danger', message: e.errors[0].message });
      },
      onConfirmLasj(data){
        this.form.eventTime = this.getNowFormatDate(data).substr(0,10);
        this.showlasj = false;
      },
      beforeRead(file) {
        this.uploadFiles.push(file.file);
      },
      deleteFile(file){
        this.uploadFiles.map((response,index) => {
          if(file.file == response){
            this.uploadFiles.splice(index,1)
          }
        })
      },
      getFileList(){
        let oData= {
          tableId: this.$route.query.id,
          tableName: "t_yinnong_majorevent",
          bizPath: "yinnong",
          fileType: "",
        }
        attachmentList(oData).then(res => {
          console.log(res)
          console.log(location.protocol+"//"+location.host+request.defaults.baseURL)
          res.rows.map(r => {
            let baseUrl = location.protocol+"//"+location.host+request.defaults.baseURL
            this.fileList.push({"url":baseUrl + r.fileUrl,"file":new File([],r.fileName,{})})
            console.log(r)
          })
        })
      },
      goBack(){
        window.history.go(-1)
      },
      //删除家庭成员
      deleteChargeItme(index){
        this.chargeItme.splice(index,1)
      },
    },
  }
</script>

<style scoped lang="scss">
  .app-container {
    padding: 2% 0;
  }
  .main_title{
    font-size: 0.4rem;
    color: #1D6FE9;
    margin: 0.2rem 6%;
    position: relative;
  }
  .main_box{
    width: 96%;
    margin: 0 auto;
    border-radius: 6px;
    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
    overflow: hidden;
    background-color: #FFF;
  }
  .submitButton{
    width: 80%;
    margin: 0 auto;
    background-color: #1D6FE9;
  }

  .addFamily{
    position: absolute;
    top: -2px;
    right: 0;
    border-radius: 50%;
  }
  .deleteFamily{
    position: absolute;
    top: 0rem;
    right: 6%;
    z-index: 9;
    border-radius: 50%;
  }
</style>
