<template>
  <div class="app-container search-table-box aidex-table">
    <el-card shadow="never" v-loading="loading" element-loading-text="拼命加载中" style="height: calc(100vh - 75px);">
      <div class="form-title-div">参数设置</div>
      <div style="height: calc(100vh - 220px); overflow: auto">
        <el-form ref="form" :model="form" :rules="rules" label-width="150px" size="small" style="width: 1000px;">
          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="主管单位" prop="competentUnit">
                <el-input v-model="form.competentUnit" placeholder="请输入主管单位"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="承办单位" prop="organizer">
                <el-input v-model="form.organizer" placeholder="请输入承办单位"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="ICP备案" prop="icpRecord">
                <el-input v-model="form.icpRecord" placeholder="请输入ICP备案"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="网站标识码" prop="websiteIdentifier">
                <el-input v-model="form.websiteIdentifier" placeholder="请输入网站标识码"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="网安备案号" prop="securityRecord">
                <el-input v-model="form.securityRecord" placeholder="请输入网安备案号"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="办公时间" prop="officeHours">
                <el-input v-model="form.officeHours" placeholder="请输入办公时间"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="办公地址" prop="officeAddress">
                <el-input v-model="form.officeAddress" placeholder="请输入办公地址"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="值班电话" prop="dutyPhone">
                <el-input v-model="form.dutyPhone" placeholder="请输入值班电话"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="传真" prop="fax">
                <el-input v-model="form.fax" placeholder="请输入传真"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="举报电话" prop="reportPhone">
                <el-input v-model="form.reportPhone" placeholder="请输入举报电话"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="举报信件" prop="reportMail">
                <el-input v-model="form.reportMail" placeholder="请输入举报信件"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="服务热线" prop="serviceHotline">
                <el-input v-model="form.serviceHotline" placeholder="请输入服务热线"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="小程序链接" prop="miniAppLink">
                <el-input v-model="form.miniAppLink" placeholder="请输入小程序链接"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="政策文件（外链）" prop="policyFileUrl">
                <el-input v-model="form.policyFileUrl" placeholder="请输入政策文件网址"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="备注" prop="remark">
                <el-input v-model="form.remark" placeholder="请输入内容"/>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="小程序二维码" prop="miniAppQrcodeUrl">
                <image-upload v-model="form.miniAppQrcodeUrl" :limit="1" file-size="1"/>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="最近修改时间" prop="updateTime">
                <span>{{ parseTime(form.updateTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item>
                <el-button type="primary" @click="submitForm" v-hasPermi="['system:sharesBaseSet:edit']">保 存</el-button>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </div>
    </el-card>
  </div>
</template>

<script>
import {getWebsiteSet, updateWebsiteSet} from "@/api/business/operate/websiteSet";

export default {
  name: "WebsiteSet",
  data() {
    return {
      // 遮罩层
      loading: true,
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        competentUnit: [
          {required: true, message: "主管单位不能为空", trigger: "blur"}
        ],
        organizer: [
          {required: true, message: "承办单位不能为空", trigger: "blur"}
        ],
        icpRecord: [
          {required: true, message: "ICP备案不能为空", trigger: "blur"}
        ],
        websiteIdentifier: [
          {required: true, message: "网站标识码不能为空", trigger: "blur"}
        ],
        securityRecord: [
          {required: true, message: "网安备案号不能为空", trigger: "blur"}
        ],
        officeHours: [
          {required: true, message: "办公时间不能为空", trigger: "blur"}
        ],
        officeAddress: [
          {required: true, message: "办公地址不能为空", trigger: "blur"}
        ],
        dutyPhone: [
          {required: true, message: "值班电话不能为空", trigger: "blur"}
        ],
        fax: [
          {required: true, message: "传真不能为空", trigger: "blur"}
        ],
        reportPhone: [
          {required: true, message: "举报电话不能为空", trigger: "blur"}
        ],
        reportMail: [
          {required: true, message: "举报信件不能为空", trigger: "blur"}
        ],
        serviceHotline: [
          {required: true, message: "服务热线不能为空", trigger: "blur"}
        ],
        miniAppLink: [
          {required: true, message: "小程序链接不能为空", trigger: "blur"}
        ],
        miniAppQrcodeUrl: [
          {required: true, message: "小程序二维码不能为空", trigger: "blur"}
        ],
        policyFileUrl: [
          {required: true, message: "政策文件网址不能为空", trigger: "blur"}
        ],
      }
    };
  },
  created() {
    this.getWebsiteSet()
  },
  methods: {
    // 表单重置
    reset() {
      this.form = {
        id: null,
        competentUnit: null,
        organizer: null,
        icpRecord: null,
        websiteIdentifier: null,
        securityRecord: null,
        officeHours: null,
        officeAddress: null,
        dutyPhone: null,
        fax: null,
        reportPhone: null,
        reportMail: null,
        serviceHotline: null,
        miniAppLink: null,
        miniAppQrcodeUrl: null,
        createBy: null,
        createTime: null,
        updateBy: null,
        updateTime: null,
        remark: null
      };
      this.resetForm("form");
    },
    /** 查询详情 */
    getWebsiteSet() {
      this.loading = true
      this.reset();
      getWebsiteSet(1).then(response => {
        this.form = response.data;
        this.loading = false
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.form.id != null) {
            this.loading = true
            updateWebsiteSet(this.form).then(response => {
              this.$modal.msgSuccess("修改成功");
              this.loading = false
              this.getWebsiteSet()
            });
          }
        }
      });
    }

  }
};
</script>
<style scoped>
.form-title-div {
  font-size: 14px;
  font-weight: bold;
  border-bottom: 2px solid #0052d9;
  padding: 5px 10px;
  margin: 15px 30px 20px 30px;
  color: #0052d9;
}
</style>
