-

zhangwei

6 天以前 0543f4989353b1ea9e83e3c5e6b14abd56b69167

 src/views/register/registernav.vue

@@ -17,11 +17,24 @@
          <el-step title="信息登记完成" />
        </el-steps>
      </div>
      <div v-if="active == 1" class="h-[50%]">
      <div v-if="active == 1" class="h-[100%]">
        <div class="text-center pt-5 pb-1.5">注册条款</div>
        <div
          class="w-[95%] h-[82%] border-1 border-[#E5E5E5] mx-auto p-2 overflow-y-auto"
          class="w-[95%] h-65 border-1 border-[#E5E5E5] mx-auto p-2 overflow-y-auto"
        >
          <h3>注册采购供应商应具备以下条件</h3>
          <h3>注册采购供应商应具备以下条件</h3>
          <h3>注册采购供应商应具备以下条件</h3>
          <h3>注册采购供应商应具备以下条件</h3>
          <h3>注册采购供应商应具备以下条件</h3>
          <h3>注册采购供应商应具备以下条件</h3>
          <h3>注册采购供应商应具备以下条件</h3>
          <h3>注册采购供应商应具备以下条件</h3>
          <h3>注册采购供应商应具备以下条件</h3>
          <h3>注册采购供应商应具备以下条件</h3>
          <h3>注册采购供应商应具备以下条件</h3>
          <h3>注册采购供应商应具备以下条件</h3>
          <h3>注册采购供应商应具备以下条件</h3>
          <h3>注册采购供应商应具备以下条件</h3>
        </div>
      </div>
@@ -36,7 +49,11 @@
          <el-row>
            <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
              <el-form-item label="企业类型">
                <el-select v-model="state.type" placeholder="请选择" clearable>
                <el-select
                  v-model="state.ruleForm.enterpriseType"
                  placeholder="请选择"
                  clearable
                >
                  <el-option label="成立" value="Valid" />
                  <el-option label="驳回" value="Rejected" />
                  <el-option label="其它" value="Other" />
@@ -49,7 +66,7 @@
            <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
              <el-form-item label="交易主体">
                <el-input
                  v-model="state.ruleForm.nickName"
                  v-model="state.ruleForm.transactionName"
                  placeholder="请输入"
                />
              </el-form-item>
@@ -58,8 +75,19 @@
          <el-row>
            <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
              <el-form-item label="营业执照">
                <el-upload>
                  <el-button type="primary">上传</el-button>
                <el-upload
                  :limit="1"
                  :action="`${baseUrlApi('/api/upFile/upBizLicense')}`"
                  :show-file-list="false"
                  :on-success="handleAvatarSuccess"
                  :before-upload="beforeAvatarUpload"
                >
                  <img
                    v-if="state.ruleForm.businessLicense"
                    :src="state.ruleForm.businessLicense"
                    class="avatar"
                  />
                  <el-button v-else type="primary">上传</el-button>
                </el-upload>
              </el-form-item>
            </el-col>
@@ -235,7 +263,17 @@
          </el-row>
        </el-form>
      </div>
      <div class="mx-auto pt-2 pb-5 flex justify-center">
      <template v-else>
        <el-result title="恭喜您，登记完成！">
          <template #icon>
            <img src="@/assets/home/result.png" />
          </template>
          <template #extra>
            <el-button type="primary">确认</el-button>
          </template>
        </el-result>
      </template>
      <div v-if="active !== 3" class="mx-auto pt-2 pb-5 flex justify-center">
        <el-button :disabled="active == 1" @click="backStep">上一步</el-button>
        <el-button type="primary" @click="nextStep"
          ><span v-if="active == 1">同意</span>下一步</el-button
@@ -243,12 +281,18 @@
      </div>
    </div>
  </div>
  <ReDialog />
</template>
<script setup lang="ts">
<script setup lang="tsx">
import { h, ref, reactive } from "vue";
import type { FormInstance, FormRules } from "element-plus";
import { ReDialog } from "@/components/ReDialog";
import type { FormInstance, FormRules, UploadProps } from "element-plus";
import { message } from "@/utils/message";
import { baseUrlApi } from "@/api/util";
import {
  addDialog,
  closeDialog,
  updateDialog,
  closeAllDialog
} from "@/components/ReDialog";

defineOptions({
  name: "RegisterNav"
@@ -257,15 +301,52 @@
const state = reactive({
  isShowPassword: false,
  ruleForm: {
    account: "",
    nickName: "",
    phone: "",
    phoneVCode: "",
    // tenantId: props.tenantInfo.id,
    code: "",
    codeId: 0,
    email: "",
    exRoleCode: ""
    // 主键（唯一标识）
    id: null, // integer($int64)，可空
    // 企业类型（从预设企业类型列表中选择）
    enterpriseType: null, // string，可空
    // 交易主体代码（同角色代码，不可空，最小长度为1）
    transactionCode: "", // string，必填
    // 交易主体名称
    transactionName: null, // string，可空
    // 营业执照文件路径
    businessLicense: null, // string，可空
    // 企业名称
    enterpriseName: null, // string，可空
    // 统一社会信用代码
    unifiedSocialCreditCode: null, // string，可空
    // 注册资金（单位：万元）
    registeredCapital: null, // number($double)，可空
    // 法定代表人姓名
    legalRepresentativeName: null, // string，可空
    // 法定代表人身份证文件路径
    legalRepresentativeIdCard: null, // string，可空
    // 法定代表人身份证号码
    legalRepresentativeIdNumber: null, // string，可空
    // 法定代表人联系电话
    legalRepresentativePhone: null, // string($tel)，可空
    // 企业住所（下拉选择，暂以字符串接收）
    residence: null, // string，可空
    // 企业联系电话
    enterprisePhone: null, // string($tel)，可空
    // 企业成立时间（格式示例：2025-07-08 14:56:54）
    establishmentTime: null, // string($date-time)，可空
    // 企业主营业务
    mainBusiness: null, // string，可空
    // 企业邮箱
    enterpriseEmail: null, // string，可空
    // 业务经办人姓名
    operatorName: null, // string，可空
    // 业务经办人身份证文件路径或标识（上传后存储信息）
    operatorIdCard: null, // string，可空
    // 业务经办人身份证号码
    operatorIdNumber: null, // string，可空
    // 业务经办人联系电话
    operatorPhone: null, // string($tel)，可空
    // 企业开户行
    bankName: null, // string，可空
    // 企业银行账号
    bankAccount: null // string，可空
  },
  type: "",
  rules: {
@@ -318,12 +399,61 @@

let active = ref(1);
const nextStep = () => {
  if (active.value >= 2) {
    addDialog({
      width: "20%",
      title: "确认信息",
      contentRenderer: () => (
        <p>
          请您认真核对填报的资料是否正确，如因填报错误影响后续投标等操作，平台不承担任何责任，所有后果需要自行承担，请您谨慎填写！
        </p>
      ), // jsx 语法 （注意在.vue文件启用jsx语法，需要在script开启lang="tsx"）
      closeCallBack: ({ options, args }) => {
        // options.props 是响应式的
        // const { formInline } = options.props as FormProps;
        // const text = `姓名：${formInline.user} 城市：${formInline.region}`;
        if (args?.command === "cancel") {
          // 您点击了取消按钮
          message(`您点击了取消按钮，当前表单数据为 `);
          // active.value -= 1;
        } else if (args?.command === "sure") {
          active.value += 1;
          message(`您点击了确定按钮，当前表单数据为 `);
        } else {
          message(
            `您点击了右上角关闭按钮或空白页或按下了esc键，当前表单数据为 `
          );
        }
      }
    });
    return;
  }
  active.value += 1;
  console.log(active.value + 1);
};
const backStep = () => {
  active.value -= 1;
};
const handleAvatarSuccess: UploadProps["onSuccess"] = (
  response,
  uploadFile
) => {
  state.ruleForm.businessLicense = URL.createObjectURL(uploadFile.raw!);
};

const beforeAvatarUpload: UploadProps["beforeUpload"] = rawFile => {
  if (rawFile.type !== "image/jpeg") {
    message(`请上传jpeg类型的图片`, {
      type: "error"
    });
    return false;
  } else if (rawFile.size / 1024 / 1024 > 2) {
    message(`图片大小不能超过 2MB！`, {
      type: "error"
    });
    return false;
  }
  return true;
};
</script>
<style lang="scss" scoped>
.content {