<template>
  <div class="table-form sms-vendor-form">
    <Form :model="model" :ref="action" :rules="rules" :label-width="labelWidth">
      <Row :gutter="10">
        <Col span="24">
           <Form-item label="动环配置名称" prop="name" v-validate:name.required.maxInputLength="rules">
            <Input v-model="model.name" placeholder="请输入动环配置名称" :disabled="disabled"></Input>
            </Form-item>
        </Col>
      </Row>
     <Row :gutter="10">
                <Col span="24">
                <Form-item label="数据源类型" prop="type" v-validate:type.required.@change.$number="rules">
                    <Select v-model="model.type" placeholder="请选择数据源类型"  :disabled="disabled" @on-change="changeType">
                        <Option :value=0>jdbc</Option>
                        <Option :value=1>snmp</Option>
                        <Option :value=9>二次开发</Option>
                    </Select>
                </Form-item>
                </Col>
        </Row>
      <Row :gutter="10" v-if="model.type!=9">
        <Col span="24">
            <FormItem label="数据源标识" prop="code" v-validate:code.required.@change="rules">
                <Select v-model="model.code" placeholder="请选择数据源标识" :disabled="disabled">
                    <Option v-for="item in platformOption" :value="item.code">{{item.code}}</Option>
                </Select>
            </FormItem>
        </Col>
      </Row>

      <Row :gutter="10" v-if="model.type==9">
        <Col span="24">
          <FormItem label="jar文件" prop="file" v-if="!model.id">
            <input type="file" name="entity.jarName" @change="getFile($event)" >
          </FormItem>

           <FormItem label="jar文件" prop="file" v-else>
             <div class="file-container">
              <input type="button" value="选择文件" :disabled="disabled"></input>{{model.jarName}}
              <input type="file" name="model.jarName" @change="getFile($event)" id="hiddenInput">
             </div>
          </FormItem>
        </Col>
      </Row>
      <Row :gutter="10" v-if="model.type==9">
        <Col span="24">
          <FormItem label="实现类" prop="beanName" v-validate:beanName.required.maxInputLength="rules">
            <Input v-model="model.beanName" placeholder="请输入实现类包名" v-tip:code="sms_vendor_beanName" :disabled="disabled"></Input>
          </FormItem>
        </Col>
      </Row>

       <Row :gutter="10" v-if="false">
        <Col span="24">
           <FormItem label="执行参数类型" prop="excuteType"  v-validate:excuteType.maxInputLength="rules">
                <Input v-model="model.excuteType"  placeholder="请输入执行参数"  :disabled="disabled"></Input>
            </FormItem>
        </Col>
      </Row>
       <Row :gutter="10" v-if="model.type!=1">
        <Col span="24">
           <FormItem label="执行参数内容" prop="excuteContent"  v-validate:excuteContent.maxTextLength="rules">
                <Input v-model="model.excuteContent" type="textarea"  placeholder="请输入执行参数内容"  :disabled="disabled"></Input>
            </FormItem>
        </Col>
      </Row>
        <Row :gutter="10" v-if="false">
                <Col span="24">
                    <Form-item label="指标处理脚本" prop="handleScript" v-validate:handleScript.maxTextLength="rules">
                        <Input v-model="model.handleScript" type="textarea" placeholder="请输入指标处理脚本" :disabled="disabled"></Input>
                    </Form-item>
                </Col>
        </Row>
         <Row :gutter="10">
                <Col span="24">
                    <Form-item label="扩展信息" prop="extInfo" v-validate:extInfo.maxTextLength="rules">
                        <Input v-model="model.extInfo" type="textarea" placeholder="请输入扩展信息" :disabled="disabled"></Input>
                    </Form-item>
                </Col>
        </Row>
      <Row class="buttonDiv">
        <Button :loading="loading"
          @click="submitForm(action)"
          type="primary"
          v-if="!(action == 'detail')"
        >确&nbsp;&nbsp;定</Button>
        <Button @click="cancel">关&nbsp;&nbsp;闭</Button>
      </Row>
    </Form>
  </div>
</template>
<script lang="ts">
import { Component, Prop, Vue, Emit } from "vue-property-decorator";


@Component
export default class IndexForm extends Vue {
    file: any = null;
    loading : boolean = false;
    platformOption : Array<any> =[];
    @Prop() private model!:any;
    @Prop(String) private action!:string;
    @Prop() private tableVm!:any;

    labelWidth:number =120;
    rules : any={};
    @Emit('close-modal') close(){}
    cancel () {
        this.close();
        (this.$refs[this.action] as any).resetFields();
    }
    changeType(val){
      if(val&&val||val==0){
          this.getPlatData(val)
      }
    }

    getPlatData(val){
      this.model.code=""
      if(val==9){return;}
      let platMap = {0:{name: 'DBCollector',url:this.$msPrefix.base}, 1:{name: 'snmpCollector',url:this.$msPrefix.base}, 9:{name: 'vendorProfile',url:this.$msPrefix.sms}};
      let url = platMap[val].url + "/api/v1/data/all/" + platMap[val].name;
      this.getApiData("get", url + "?size=10000", {}, res => {
          if (res.data.content.length > 0) {
              this.platformOption = res.data.content;
          }else{
              this.platformOption =[]
          }

      })
    }

    getFile(event) {
      this.file = event.target.files[0];
      let name=this.file.name;
      if(name.endsWith(".jar")){
        this.model.jarName=this.file.name;
      }else{
        this.file=null;
        this.$tools.message('error',"文件格式不对,请上传jar文件！")
      }
    }

    save(){
        this.getApiData('post',this.$msPrefix.psem+'/api/v1/data/save/PSEMProfile',this.model,res=>{
            this.loading=!1;
            if (res.rtnCode == 0) {
                this.tableVm.getData();
                this.cancel();
                this.$tools.message('success',(this.action == 'update'?'修改':'新增')+'成功！')
            }else{
               this.$Message.error(res.msg);
            }
        },err=>{
          this.loading=!1;
        })
    }

    saveSDK() {
      let config = {
        headers: {
          "Content-Type": "multipart/form-data"
        }
      };
      let formData = new FormData();
      Object.keys(this.model).forEach(item => {
        formData.append(item, this.model[item]);
      });
      formData.append("file", this.file);
      this.getApiData('post',this.$msPrefix.psem+'/api/v1/psem/',formData,res=>{
          this.loading=!1;
          this.tableVm.getData();
              this.cancel();
              this.file=null;
              this.$tools.message('success',(this.action == 'update'?'修改':'新增')+'成功！')
          },err=>{
            this.loading=!1;
            this.file=null;
            //this.$tools.message('error',(this.action == 'update'?'修改':'新增')+'失败！');
        },config)
    }


    /*提交*/
      submitForm (action) {
        (this.$refs[action] as any).validate((valid) => {
          if (valid) {
           if(!this.loading){
                this.loading=!0;
                this.model.type == 9 ? this.saveSDK() : this.save();
            }
          } else {
           this.$tools.message('info',"请完善必填项!")
          }
        });
      }

       get disabled(){
        return this.action=='detail'
      }

      
}
</script>

