antissoft / NetworkInformation

  <template>
    <div class="companyForm">
      <div class="userSelect-input" @click="openDialog">
        <el-button type="text" icon="el-icon-circle-plus-outline" size="small"

          >点击新增运营主体</el-button

        >
      </div>
      <el-dialog

        title="新增运营主体"

        :close-on-click-modal="false"
        :visible.sync="visible"
        lock-scroll
        append-to-body

        width="70%"

        top="15vh"
        :modal-append-to-body="false"

        class="NCC-dialog NCC-dialog_center company-dialog"

      >

  		<el-row :gutter="15" class="NCC-dialog-content">

  			<el-form ref="elForm" :model="dataForm" size="small" label-width="120px" label-position="right" :rules="rules">

  				<el-col :span="24" v-if="false">
  					<el-form-item label="主键" prop="id">
  						<el-input v-model="dataForm.id" placeholder="请输入" clearable :style='{ "width": "100%" }'>
  						</el-input>
  					</el-form-item>
  				</el-col>
  				<el-col :span="24">

  					<el-form-item label="运营主体名称" prop="companyName">

  						<el-input v-model="dataForm.companyName" placeholder="请输入运营主体名称" clearable required

  							:style='{ "width": "100%" }'>
  						</el-input>
  					</el-form-item>
  				</el-col>
  				<el-col :span="24">
  					<el-form-item label="社会信用代" prop="socialCreditAgency">

  						<el-input v-model="dataForm.socialCreditAgency" placeholder="请输入社会信用代" clearable

  							:style='{ "width": "100%" }'>
  						</el-input>
  					</el-form-item>
  				</el-col>
  				<el-col :span="24">

  					<el-form-item label="运营主体法人" prop="legalPerson">

  						<el-input v-model="dataForm.legalPerson" placeholder="请输入运营主体法人" clearable :style='{ "width": "100%" }'>

  						</el-input>
  					</el-form-item>
  				</el-col>
  				<el-col :span="24">

  					<el-form-item label="运营主体地址" prop="address">

  						<el-input v-model="dataForm.address" placeholder="请输入运营主体地址" clearable :style='{ "width": "100%" }'>

  						</el-input>
  					</el-form-item>
  				</el-col>
  				<el-col :span="24">
  					<el-form-item label="联系方式" prop="contactInformation">

  						<el-input v-model="dataForm.contactInformation" placeholder="请输入联系方式" clearable

  							:style='{ "width": "100%" }'>
  						</el-input>
  					</el-form-item>
  				</el-col>

  				<el-col :span="24">

  					<el-form-item label="资质证明" prop="qualificationCertificate">
  						<NCC-UploadFz v-model="dataForm.qualificationCertificate" :fileSize="5" sizeUnit="MB" :limit="9" buttonText="点击上传" />
  					</el-form-item>
  				</el-col>
  				<el-col :span="24">
  					<el-form-item label="联系人" prop="contactUser">
  						<el-input v-model="dataForm.contactUser" placeholder="请输入联系人" clearable
  							:style='{ "width": "100%" }'>
  						</el-input>
  					</el-form-item>
  				</el-col>
  				<el-col :span="24">
  					<el-form-item label="联系电话" prop="contactPhone">
  						<el-input v-model="dataForm.contactPhone" placeholder="请输入联系电话" clearable
  							:style='{ "width": "100%" }'>
  						</el-input>
  					</el-form-item>
  				</el-col>
  				<el-col :span="24">

           		  <el-form-item label="所属区县" prop="areaId">
           		    <el-radio-group v-model="dataForm.areaId" placeholder="请选择所属区县" style="line-height: 22px">
           		      <el-radio v-for="v in areaOptions" :key="v.id" :label="v.id">{{ v.fullName }}</el-radio>
           		    </el-radio-group>
           		  </el-form-item>
           		</el-col>
  				<el-col :span="24">

  					<el-form-item label="其他信息" prop="otherInfo">
  						<NCC-Quill v-model="dataForm.otherInfo" placeholder="请输入内容...">
  						</NCC-Quill>
  					</el-form-item>
  				</el-col>
  			</el-form>

  		</el-row>

        <span slot="footer" class="dialog-footer">

          <el-button @click="visible = false">取消</el-button>
          <el-button type="primary" @click="dataFormSubmit" :loading="btnLoading">确认</el-button>

        </span>
      </el-dialog>
    </div>
  </template>
  
  <script>

  import infoMixin from "@/mixins/info";

  import request from '@/utils/request'

  export default {
    name: "companyForm",

  	mixins: [infoMixin],
  	props: {},

    data() {
      return {

       	visible: false,
       	loading: false,

  		areaOptions: [],

       	dataForm: {
  			id: '',
  			id: undefined,
  			companyName: undefined,
  			socialCreditAgency: undefined,
  			legalPerson: undefined,
  			address: undefined,
  			contactInformation: undefined,
  			qualificationCertificate: [],
  			otherInfo: undefined,

  			contactUser: undefined,
  			contactPhone: undefined

  		},
  		rules: {
  			companyName: [
  				{
  					required: true,
  					message: '请输入公司名称',
  					trigger: 'blur'
  				},
  			],

  			contactPhone: [

  				{
  					pattern: /^1[3456789]\d{9}$|^0\d{2,3}-?\d{7,8}$/,

  					message: '请输入正确的联系电话',

  					trigger: 'blur'
  				},
  			],
  		},
  		btnLoading: false

      };
    },
    watch: {},
    mounted() {},

    created() {

    },

    methods: {

      close() {
        this.visible = false;
      },

      async openDialog() {
        	this.visible = true;
  		await this.initAreaTypeList();
  		this.$refs['elForm'].resetFields();

      },

      async dataFormSubmit() {

        	this.$refs['elForm'].validate((valid) => {
  			if (valid) {
  				this.btnLoading = true;
            		request({
  					url: `/Extend/BaseComapnyInfo`,
  					method: 'post',
  					data: this.dataForm,
  				}).then((res) => {
  					this.btnLoading = false;
  					this.$message({
  						message: res.msg,
  						type: 'success',
  						duration: 1000,
  						onClose: () => {
  							this.visible = false,
  								this.$emit('refresh', true)
  						}
  					})
  				}).catch(() => {this.btnLoading = false})
      	    }
  		})

      },

    },
  };
  </script>

  <style lang="scss" scoped>

  </style>