|
|
@@ -0,0 +1,644 @@
|
|
|
+<template>
|
|
|
+ <a-card>
|
|
|
+ <a-form class="smart-query-form" ref="stepFormRef" labelWrap :label-col="labelCol" :model="formModel"
|
|
|
+ :rules="formRules">
|
|
|
+ <div class="approval-steps">
|
|
|
+ <div>
|
|
|
+ <div class="basic-title">
|
|
|
+ <div class="basic-title-left">
|
|
|
+ <div class="basic-title-line"></div>
|
|
|
+ <span class="basic-title-text">线索登记</span>
|
|
|
+ </div>
|
|
|
+ <div class="basic-title-right">
|
|
|
+ <a-button type="primary" @click="reset">重置</a-button>
|
|
|
+ <a-button type="primary" @click="submit">提交</a-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="steps-content">
|
|
|
+ <a-row :gutter="16">
|
|
|
+ <a-col :span="8">
|
|
|
+ <a-form-item label="项目类型" name="serviceProvider">
|
|
|
+ <a-select
|
|
|
+ v-model:value="formState.serviceProvider"
|
|
|
+ placeholder="请选择"
|
|
|
+ :options="serviceProviderOptions"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="16">
|
|
|
+ <a-form-item label="线索名称">
|
|
|
+ <a-input
|
|
|
+ v-model:value="formState.projectName"
|
|
|
+ placeholder="请输入线索名称"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+
|
|
|
+ </a-row>
|
|
|
+ <a-row :gutter="16">
|
|
|
+ <a-col :span="24">
|
|
|
+ <a-form-item label="项目名称" name="socialCode">
|
|
|
+ <a-input
|
|
|
+ v-model:value="formState.projectName"
|
|
|
+ placeholder="自动生成(甲方-分厂-几期-机组-工程属性)"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row :gutter="16">
|
|
|
+ <a-col :span="8">
|
|
|
+ <a-form-item label="线索来源" name="serviceProvider">
|
|
|
+ <a-select
|
|
|
+ v-model:value="formState.serviceProvider"
|
|
|
+ placeholder="服务商提供"
|
|
|
+ :options="projectAttributeOptions"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="8">
|
|
|
+ <a-form-item label="服务商名称" name="serviceProvider">
|
|
|
+ <a-select
|
|
|
+ v-model:value="formState.serviceProvider"
|
|
|
+ placeholder="请选择"
|
|
|
+ :options="ownerUnitOptions"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="8">
|
|
|
+ <a-form-item label="工程属性" name="serviceProvider">
|
|
|
+ <a-select
|
|
|
+ v-model:value="formState.serviceProvider"
|
|
|
+ placeholder="请选择"
|
|
|
+ :options="ownerUnitOptions1"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row :gutter="16">
|
|
|
+ <a-col :span="8">
|
|
|
+ <a-form-item label="地区" name="region">
|
|
|
+ <a-cascader
|
|
|
+ v-model:value="formState.region"
|
|
|
+ :options="regionOptions"
|
|
|
+ placeholder="请选择"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="8">
|
|
|
+ <a-form-item label="省市区" name="region">
|
|
|
+ <a-cascader
|
|
|
+ v-model:value="formState.region"
|
|
|
+ :options="regionOptions"
|
|
|
+ placeholder="请选择"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="8">
|
|
|
+ <a-form-item label="项目地址">
|
|
|
+ <a-input
|
|
|
+ v-model:value="formState.projectName"
|
|
|
+ placeholder="请输入"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row :gutter="16">
|
|
|
+ <a-col :span="12">
|
|
|
+ <a-form-item label="业主单位">
|
|
|
+ <div class="flex-container">
|
|
|
+ <a-select
|
|
|
+ v-model:value="formState.ownerUnit"
|
|
|
+ placeholder="请选择"
|
|
|
+ style="flex: 1; margin-right: 8px"
|
|
|
+ :options="ownerUnitOptions"
|
|
|
+ />
|
|
|
+ <a-radio-group v-model:value="formState.isOwnerPartyA" button-style="solid">
|
|
|
+ <a-radio-button value="yes">甲方</a-radio-button>
|
|
|
+ </a-radio-group>
|
|
|
+ </div>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="12">
|
|
|
+ <a-form-item label="设计单位">
|
|
|
+ <div class="flex-container">
|
|
|
+ <a-select
|
|
|
+ v-model:value="formState.contractorUnit"
|
|
|
+ placeholder="请选择"
|
|
|
+ style="flex: 1; margin-right: 8px"
|
|
|
+ :options="contractorUnitOptions"
|
|
|
+ />
|
|
|
+ <a-radio-group v-model:value="formState.isContractorPartyA" button-style="solid">
|
|
|
+ <a-radio-button value="yes">甲方</a-radio-button>
|
|
|
+ </a-radio-group>
|
|
|
+ </div>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row :gutter="16">
|
|
|
+ <a-col :span="12">
|
|
|
+ <a-form-item label="总承包单位">
|
|
|
+ <div class="flex-container">
|
|
|
+ <a-select
|
|
|
+ v-model:value="formState.ownerUnit"
|
|
|
+ placeholder="请选择"
|
|
|
+ style="flex: 1; margin-right: 8px"
|
|
|
+ :options="ownerUnitOptions"
|
|
|
+ />
|
|
|
+ <a-radio-group v-model:value="formState.isOwnerPartyA" button-style="solid">
|
|
|
+ <a-radio-button value="yes">甲方</a-radio-button>
|
|
|
+ </a-radio-group>
|
|
|
+ </div>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="12">
|
|
|
+ <a-form-item label="招标代理单位">
|
|
|
+ <div class="flex-container">
|
|
|
+ <a-select
|
|
|
+ v-model:value="formState.contractorUnit"
|
|
|
+ placeholder="请选择"
|
|
|
+ style="flex: 1; margin-right: 8px"
|
|
|
+ :options="contractorUnitOptions"
|
|
|
+ />
|
|
|
+ <a-radio-group v-model:value="formState.isContractorPartyA" button-style="solid">
|
|
|
+ <a-radio-button value="yes">甲方</a-radio-button>
|
|
|
+ </a-radio-group>
|
|
|
+ </div>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row :gutter="16">
|
|
|
+ <a-col :span="8">
|
|
|
+ <a-form-item label="是否联合体" name="serviceProvider">
|
|
|
+ <a-select
|
|
|
+ v-model:value="formState.serviceProvider"
|
|
|
+ placeholder="请选择"
|
|
|
+ :options="serviceProviderOptions"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="16">
|
|
|
+ <a-form-item label="联合体情况" name="serviceProvider">
|
|
|
+ <a-input
|
|
|
+ v-model:value="formState.projectName"
|
|
|
+ placeholder="请输入"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row :gutter="16">
|
|
|
+ <a-col :span="8">
|
|
|
+ <a-form-item label="项目所属行业" name="serviceProvider">
|
|
|
+ <a-select
|
|
|
+ v-model:value="formState.serviceProvider"
|
|
|
+ placeholder="请选择"
|
|
|
+ :options="ownerUnitOptions5"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="8">
|
|
|
+ <a-form-item label="业务类型" name="serviceProvider">
|
|
|
+ <a-select
|
|
|
+ v-model:value="formState.serviceProvider"
|
|
|
+ placeholder="请选择"
|
|
|
+ :options="ownerUnitOptions4"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="8">
|
|
|
+ <a-form-item label="招标平台" name="serviceProvider">
|
|
|
+ <a-input v-model:value="formModel.customerRemark" placeholder="请输入"/>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row :gutter="16">
|
|
|
+ <a-col :span="8">
|
|
|
+ <a-form-item label="项目总概算" name="serviceProvider">
|
|
|
+ <a-input v-model:value="formModel.customerRemark" placeholder="自动生成(各标段概算之和)"/>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="8">
|
|
|
+ <a-form-item label="项目资金来源" name="serviceProvider">
|
|
|
+ <a-select
|
|
|
+ v-model:value="formState.serviceProvider"
|
|
|
+ placeholder="请选择"
|
|
|
+ :options="ownerUnitOptions3"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="8">
|
|
|
+ <a-form-item label="分厂/几期/机组" name="serviceProvider">
|
|
|
+ <a-input v-model:value="formModel.customerRemark" placeholder="请输入"/>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row :gutter="16">
|
|
|
+ <a-col :span="24">
|
|
|
+ <a-form-item label="项目背景" name="customerRemark" class="smart-query-form-item">
|
|
|
+ <a-input v-model:value="formModel.customerRemark" placeholder="请输入"/>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row :gutter="16">
|
|
|
+ <a-col :span="24">
|
|
|
+ <a-form-item label="项目阶段" name="customerRemark" class="smart-query-form-item">
|
|
|
+ <a-input v-model:value="formModel.customerRemark" placeholder="请输入"/>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row :gutter="16">
|
|
|
+ <a-col :span="8">
|
|
|
+ <a-form-item label="归属营销人员" name="customerRemark" class="smart-query-form-item">
|
|
|
+ <a-select
|
|
|
+ v-model:value="formState.serviceProvider"
|
|
|
+ placeholder="请选择"
|
|
|
+ :options="ownerUnitOptions5"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <div class="basic-title">
|
|
|
+ <div class="basic-title-left">
|
|
|
+ <div class="basic-title-line"></div>
|
|
|
+ <span class="basic-title-text">协作团队</span>
|
|
|
+ </div>
|
|
|
+ <div class="basic-title-right">
|
|
|
+ <!-- <a-button type="primary">提交</a-button> -->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="steps-content">
|
|
|
+ <a-button type="dashed" @click="addTeam" block>
|
|
|
+ <plus-outlined /> 添加成员
|
|
|
+ </a-button>
|
|
|
+ <a-table
|
|
|
+ :columns="teamColumns"
|
|
|
+ :data-source="teamData"
|
|
|
+ :pagination="false"
|
|
|
+ bordered
|
|
|
+ >
|
|
|
+ <template #bodyCell="{ column, record }">
|
|
|
+ <template v-if="column.key === 'action'">
|
|
|
+ <a-button type="link" danger @click="removeTeam(record.key)">删除</a-button>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ </a-table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <div class="basic-title">
|
|
|
+ <div class="basic-title-left">
|
|
|
+ <div class="basic-title-line"></div>
|
|
|
+ <span class="basic-title-text">其他信息</span>
|
|
|
+ </div>
|
|
|
+ <div class="basic-title-right">
|
|
|
+ <!-- <a-button type="primary">提交</a-button> -->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="steps-content">
|
|
|
+ <a-row :gutter="16" class="smart-query-form-row">
|
|
|
+ <a-col :span="24">
|
|
|
+ <a-form-item label="附件">
|
|
|
+ <a-upload-dragger
|
|
|
+ v-model:file-list="fileList"
|
|
|
+ name="file"
|
|
|
+ :multiple="true"
|
|
|
+ :before-upload="beforeUpload"
|
|
|
+ @change="handleUploadChange"
|
|
|
+ :accept="'.png,.jpg,.doc,.pdf,.mp4,.avi'"
|
|
|
+ >
|
|
|
+ <p class="ant-upload-drag-icon">
|
|
|
+ <inbox-outlined></inbox-outlined>
|
|
|
+ </p>
|
|
|
+ <p class="ant-upload-text">点击或将文件拖拽到这里上传</p>
|
|
|
+ <p class="ant-upload-hint">支持：png、jpg、doc、pdf、mp4、avi...</p>
|
|
|
+ </a-upload-dragger>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </a-form>
|
|
|
+ </a-card>
|
|
|
+</template>
|
|
|
+<script setup>
|
|
|
+import {onMounted, reactive, ref, useAttrs} from 'vue';
|
|
|
+import {
|
|
|
+ PlusOutlined,
|
|
|
+ InboxOutlined,
|
|
|
+} from '@ant-design/icons-vue';
|
|
|
+import {useRouter} from 'vue-router';
|
|
|
+import {message, Modal} from 'ant-design-vue';
|
|
|
+import _ from 'lodash';
|
|
|
+import {clientManageApi} from '/@/api/market-manage/index.js';
|
|
|
+import AreaCascader from '/@/components/framework/area-cascader/index.vue';
|
|
|
+import DictSelect from '/@/components/support/dict-select/index.vue';
|
|
|
+import Upload from '/@/components/support/file-upload/index.vue';
|
|
|
+import {FILE_FOLDER_TYPE_ENUM} from '/@/constants/support/file-const';
|
|
|
+
|
|
|
+const stepFormRef = ref(null);
|
|
|
+const router = useRouter();
|
|
|
+
|
|
|
+// --------------------- 数据 ---------------------
|
|
|
+const formModel = reactive({
|
|
|
+ customerCode: undefined, //客户编码
|
|
|
+ customerName: undefined, //客户名称
|
|
|
+ socialCode: undefined, //社会统一信用代码
|
|
|
+ partnerLevel: undefined, //客户级别
|
|
|
+ customerStatus: undefined, //客户状态
|
|
|
+ province: undefined, //省份
|
|
|
+ provinceName: undefined,
|
|
|
+ city: undefined, //城市
|
|
|
+ cityName: undefined,
|
|
|
+ area: undefined, //区或县
|
|
|
+ areaName: undefined,
|
|
|
+ address: undefined, //详细地址
|
|
|
+ customerType: undefined, //客户类型
|
|
|
+ customerManager: undefined, //客户对接人
|
|
|
+ customerManagerMobile: undefined, //客户对接人电话
|
|
|
+ companyRegisterCapital: undefined, //注册资本
|
|
|
+ companyRegisterDate: undefined, //注册时间
|
|
|
+ customerDescription: undefined, //公司简介
|
|
|
+ customerNature: undefined, //经营范围
|
|
|
+ customerRemark: undefined, //备注
|
|
|
+ invoiceTitle: undefined, //发票抬头
|
|
|
+ invoiceCode: undefined, //开票税号
|
|
|
+ invoiceAddress: undefined, //开票地址
|
|
|
+ invoiceMobile: undefined, //开票电话
|
|
|
+ invoiceBankName: undefined, //开户银行
|
|
|
+ invoiceBankAccount: undefined, //银行账户
|
|
|
+ invoiceType: undefined, //开票类型
|
|
|
+ attachment: undefined, //附件集合
|
|
|
+});
|
|
|
+// 表单数据
|
|
|
+const formState = reactive({
|
|
|
+ projectType: 'project',
|
|
|
+ clueName: '',
|
|
|
+ projectName: '',
|
|
|
+ clueSource: 'serviceProvider',
|
|
|
+ serviceProvider: undefined,
|
|
|
+ projectAttribute: undefined,
|
|
|
+ region: undefined,
|
|
|
+ projectAddress: '',
|
|
|
+ ownerUnit: undefined,
|
|
|
+ designUnit: undefined,
|
|
|
+ contractorUnit: undefined,
|
|
|
+ tenderAgent: undefined,
|
|
|
+ isConsortium: undefined,
|
|
|
+ consortiumDescription: '',
|
|
|
+ industry: undefined,
|
|
|
+ businessType: undefined,
|
|
|
+ biddingPlatform: '',
|
|
|
+ totalBudget: '',
|
|
|
+ fundingSource: undefined,
|
|
|
+ factoryPhaseUnit: '',
|
|
|
+ projectBackground: '',
|
|
|
+ projectStage: '',
|
|
|
+ marketingPerson: undefined,
|
|
|
+ isOwnerPartyA: undefined,
|
|
|
+ isContractorPartyA: undefined,
|
|
|
+ isDesignPartyA: undefined,
|
|
|
+ isTenderPartyA: undefined,
|
|
|
+});
|
|
|
+
|
|
|
+// --------------------- 校验规则 ---------------------
|
|
|
+const formRules = {
|
|
|
+ // customerName: [{ required: true, message: '请输入客户名称', trigger: 'change' }],
|
|
|
+};
|
|
|
+const teamColumns = [
|
|
|
+ {
|
|
|
+ title: '序号',
|
|
|
+ dataIndex: 'key',
|
|
|
+ key: 'key',
|
|
|
+ width: 80,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '营销经理',
|
|
|
+ dataIndex: 'manager',
|
|
|
+ key: 'manager',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '营销团队',
|
|
|
+ dataIndex: 'team',
|
|
|
+ key: 'team',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '支持说明',
|
|
|
+ dataIndex: 'support',
|
|
|
+ key: 'support',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '操作',
|
|
|
+ key: 'action',
|
|
|
+ width: 100,
|
|
|
+ },
|
|
|
+];
|
|
|
+const teamData = ref([
|
|
|
+ {
|
|
|
+ key: '1',
|
|
|
+ manager: '张经理',
|
|
|
+ team: '一团队',
|
|
|
+ support: '',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ key: '2',
|
|
|
+ manager: '王经理',
|
|
|
+ team: 'XX团队',
|
|
|
+ support: '',
|
|
|
+ },
|
|
|
+]);
|
|
|
+const addTeam = () => {
|
|
|
+ const newKey = String(teamData.value.length + 1);
|
|
|
+ teamData.value.push({
|
|
|
+ key: newKey,
|
|
|
+ manager: '',
|
|
|
+ team: '',
|
|
|
+ support: '',
|
|
|
+ });
|
|
|
+};
|
|
|
+const removeTeam = (key) => {
|
|
|
+ teamData.value = teamData.value.filter(item => item.key !== key);
|
|
|
+};
|
|
|
+const labelCol = {style: {width: '110px'}};
|
|
|
+
|
|
|
+// ----------------------- 上传附件 ----------------------------
|
|
|
+// 已上传的附件列表
|
|
|
+const defaultFileList = ref([]);
|
|
|
+
|
|
|
+function changeAttachment(fileList) {
|
|
|
+ defaultFileList.value = fileList;
|
|
|
+ formModel.attachment = _.isEmpty(fileList) ? [] : fileList;
|
|
|
+}
|
|
|
+
|
|
|
+// ----------------------- 步骤相关 ---------------------------
|
|
|
+
|
|
|
+const submit = () => {
|
|
|
+ console.log('formModel', formModel);
|
|
|
+ router.push('/market-manage/external-manage/clue-management/clue-list');
|
|
|
+ // stepFormRef.value
|
|
|
+ // .validateFields()
|
|
|
+ // .then((values) => {
|
|
|
+ // Modal.confirm({
|
|
|
+ // title: '提示',
|
|
|
+ // content: '确定要提交吗?',
|
|
|
+ // okText: '确认',
|
|
|
+ // onOk() {
|
|
|
+ // postFormData();
|
|
|
+ // },
|
|
|
+ // cancelText: '取消',
|
|
|
+ // onCancel() {
|
|
|
+ // },
|
|
|
+ // });
|
|
|
+ // })
|
|
|
+ // .catch((error) => {
|
|
|
+ // console.log('step1_error', error);
|
|
|
+ // });
|
|
|
+};
|
|
|
+
|
|
|
+const postFormData = () => {
|
|
|
+ customerApi.CustomerAddition(formModel).then((res) => {
|
|
|
+ message.success('提交成功');
|
|
|
+ router.push({path: '/teamwork/customer-manage/customer-list'});
|
|
|
+ });
|
|
|
+};
|
|
|
+//------------------------地区-------------------------------------
|
|
|
+
|
|
|
+const provinceCityDistrict = ref([]);
|
|
|
+
|
|
|
+
|
|
|
+// 文件上传
|
|
|
+const fileList = ref([]);
|
|
|
+
|
|
|
+const handleUploadChange = (info) => {
|
|
|
+ let fileList = [...info.fileList];
|
|
|
+ fileList = fileList.slice(-5); // 限制上传数量
|
|
|
+ fileList.value = fileList;
|
|
|
+};
|
|
|
+
|
|
|
+const beforeUpload = (file) => {
|
|
|
+ const isLt10M = file.size / 1024 / 1024 < 10;
|
|
|
+ if (!isLt10M) {
|
|
|
+ message.error('文件大小不能超过10MB!');
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ return true;
|
|
|
+};
|
|
|
+const serviceProviderOptions = ref([
|
|
|
+ {value: 'provider1', label: '项目类'},
|
|
|
+ {value: 'provider2', label: '贸易类'},
|
|
|
+]);
|
|
|
+
|
|
|
+const projectAttributeOptions = ref([
|
|
|
+ {value: 'attribute1', label: '自主开发'},
|
|
|
+ {value: 'attribute2', label: '转介绍'},
|
|
|
+ {value: 'attribute3', label: '服务商提供'},
|
|
|
+ {value: 'attribute4', label: '市场活动'},
|
|
|
+]);
|
|
|
+const ownerUnitOptions = ref([
|
|
|
+ {value: 'owner1', label: '国内客户'},
|
|
|
+ {value: 'owner2', label: '国外客户'},
|
|
|
+]);
|
|
|
+const ownerUnitOptions1 = ref([
|
|
|
+ {value: 'owner1', label: '新建'},
|
|
|
+ {value: 'owner2', label: '旧改'},
|
|
|
+]);
|
|
|
+const ownerUnitOptions2 = ref([
|
|
|
+ {value: 'owner1', label: '是'},
|
|
|
+ {value: 'owner2', label: '否'},
|
|
|
+]);
|
|
|
+const ownerUnitOptions3 = ref([
|
|
|
+ {value: 'owner1', label: '客户提供'},
|
|
|
+]);
|
|
|
+const ownerUnitOptions4 = ref([
|
|
|
+ {value: 'owner1', label: '业务一部'},
|
|
|
+ {value: 'owner2', label: '业务二部'},
|
|
|
+ {value: 'owner3', label: '业务三部'},
|
|
|
+]);
|
|
|
+const ownerUnitOptions5 = ref([
|
|
|
+ {value: 'owner1', label: '政府机构'},
|
|
|
+ {value: 'owner2', label: '民营企业'},
|
|
|
+]);
|
|
|
+
|
|
|
+const regionOptions = ref([
|
|
|
+ {
|
|
|
+ value: 'zhejiang',
|
|
|
+ label: '浙江省',
|
|
|
+ children: [
|
|
|
+ {
|
|
|
+ value: 'hangzhou',
|
|
|
+ label: '杭州市',
|
|
|
+ children: [
|
|
|
+ {value: 'xihu', label: '西湖区'},
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ // 其他省份...
|
|
|
+]);
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="less">
|
|
|
+.flex-container {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.approval-steps {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ gap: 20px;
|
|
|
+ // width: 1350px;
|
|
|
+ margin: 0 auto;
|
|
|
+
|
|
|
+ .basic-title {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ width: 100%;
|
|
|
+ height: 40px;
|
|
|
+ padding: 0 16px 4px 16px;
|
|
|
+ border-bottom: 2px solid #f6f6f6;
|
|
|
+ background: #ffffff;
|
|
|
+ border-top-left-radius: 8px;
|
|
|
+ border-top-right-radius: 8px;
|
|
|
+
|
|
|
+ .basic-title-left {
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .basic-title-line {
|
|
|
+ width: 4px;
|
|
|
+ height: 20px;
|
|
|
+ border-radius: 4px;
|
|
|
+ background: #267ef8;
|
|
|
+ margin-right: 5px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .basic-title-text {
|
|
|
+ font-size: 16px;
|
|
|
+ font-style: normal;
|
|
|
+ font-weight: 600;
|
|
|
+ line-height: 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .basic-title-right {
|
|
|
+ display: flex;
|
|
|
+ gap: 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .steps-content {
|
|
|
+ margin-top: 14px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .steps-action {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ margin-top: 18px;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
