样式

xiangpei

2025-02-19 0dace92d5801bfac77eedc09598c84fbd4f9df3d

 src/views/projectEngineering/projectLibrary/component/BasicInfo.vue

@@ -1,233 +1,248 @@
<template>
  <div class="basic-info">
    <el-form ref="projectForm" :disabled="disabled" :model="projectForm" :rules="rules" class="dialog_form">
      <el-row :gutter="20">
        <el-col :span="6">
          <el-form-item class="item" label="项目名称" label-width="100px" prop="projectName">
            <el-input v-model.trim="projectForm.projectName" class="item" clearable maxlength="255" placeholder="请输入"/>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item class="item" label="项目代码" label-width="100px" prop="projectCode">
            <el-input v-model.trim="projectForm.projectCode" class="item" clearable maxlength="255"
                      placeholder="请输入"/>
          </el-form-item>
        </el-col>
        <el-col :span="12" style="position: relative">
          <div style="width: 100%; height: 100%; position: absolute;">
            <el-form-item class="item" label="赋码" label-width="50px" prop="coding">
              <template slot-scope="scope">
                <!--                <div class="yellow-dot" v-if="scope.row.coding === 'yellow'"></div>-->
                <!--                <div class="green-dot" v-if="scope.row.coding === 'green'"></div>-->
                <!--                <div class="red-dot" v-if="scope.row.coding === 'red'"></div>-->
                <div class="red-dot"></div>
                <tag-list></tag-list>
              </template>
            </el-form-item>
            <!--            <img alt="" src="../../../../assets/images/s.png"/>-->
          </div>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item class="item" label="建设内容" label-width="100px" prop="content">
            <el-input v-model.trim="projectForm.content" style="width: 100%;" clearable maxlength="255"
                      placeholder="请输入" type="textarea"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="6">
          <el-form-item label="资金类型" label-width="100px" prop="fundType" style="width: 100%">
            <el-select v-model="projectForm.fundType" clearable placeholder="请选择" style="width: 100%">
              <el-option v-for="item in dict.type.sys_funding_type" :key="item.value" :label="item.label"
                         :value="item.value"/>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="项目投资类别" label-width="100px" prop="investType" style="width: 100%">
            <el-select v-model="projectForm.investType" clearable placeholder="请选择" style="width: 100%">
              <el-option v-for="item in dict.type.sys_investment_type" :key="item.value" :label="item.label"
                         :value="item.value"/>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="6">
<!--          <el-form-item label="项目阶段" label-width="100px" prop="fundsType" style="width: 100%">-->
<!--            <el-input v-model.trim="projectForm.projectPhase" class="item" clearable disabled maxlength="255"-->
<!--                      placeholder="请输入"/>-->
<!--          </el-form-item>-->
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="6">
          <el-form-item label="项目类型" label-width="100px" prop="projectType" style="width: 100%">
            <el-select v-model="projectForm.projectType" clearable placeholder="请选择" style="width: 100%">
              <el-option v-for="item in dict.type.sys_project_type" :key="item.value" :label="item.label"
                         :value="item.value"/>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="项目状态" label-width="100px" prop="projectstatus" style="width: 100%">
            <el-select v-model="projectForm.projectStatus" clearable placeholder="请选择" @change="handleProjectStatusChange" style="width: 100%">
              <el-option v-for="item in dict.type.sys_project_status" :key="item.value" :label="item.label"
                         :value="item.value"/>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="6">
        <el-form-item label="项目阶段" label-width="100px" prop="fundsType" style="width: 100%">
          <el-input v-model.trim="projectForm.projectPhase" class="item" clearable disabled maxlength="255"
                    placeholder="请输入"/>
        </el-form-item>
        </el-col>
<!--        <el-col :span="6">-->
<!--          <el-form-item label="项目业主单位" label-width="100px" prop="projectOwnerUnit" style="width: 100%">-->
<!--            <el-input v-model.trim="projectForm.projectOwnerUnit" class="item" clearable maxlength="255"-->
<!--                      placeholder="请输入"/>-->
<!--          </el-form-item>-->
<!--        </el-col>-->
      </el-row>
      <el-row :gutter="20">
        <el-col :span="6">
          <el-form-item label="项目联系人" label-width="100px" prop="projectContactPerson" style="width: 100%">
            <el-input v-model.trim="projectForm.projectContactPerson" class="item" clearable maxlength="255"
                      placeholder="请输入"/>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="联系方式" label-width="100px" prop="contact" style="width: 100%">
            <el-input v-model.trim="projectForm.contact" class="item" clearable maxlength="255" placeholder="请输入"/>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <!-- TODO：暂时不做 -->
          <el-form-item label="关联工程" label-width="100px" prop="engineering" style="width: 100%">
            <!--            <el-input v-model.trim="getEngineeringName" class="item" clearable disabled maxlength="255" placeholder="请在工程中选择项目" />-->
            <el-select v-model="projectForm.engineeringIdList" :multiple="true" collapse-tags placeholder="请选择"
                       style="width: 100%">
              <el-option v-for="item in selectOptions" :key="item.id" :label="item.engineeringName" :value="item.id"/>
              <!--              <RemoteSelect v-if="selectOptions.length" :hasMore="hasMore" :loading="loading" :page="page" @loadMore="handleLoadMore" />-->
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="6">
          <el-form-item label="主管部门" label-width="100px" prop="competentDepartmentList" style="width: 100%">
            <el-select
              v-model="projectForm.competentDepartmentList"
              clearable
              :multiple="true"
              placeholder="请选择"
              style="width: 100%"
              collapse-tags
            >
              <el-option
                v-for="item in approvalList"
                :key="item.id"
                :value="item.id"
                :label="item.value"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="行政区划" label-width="100px" prop="area" style="width: 100%">
            <el-select
              v-model="projectForm.area"
              clearable
              placeholder="请选择"
              style="width: 100%"
            >
              <el-option v-for="item in dict.type.sys_administrative_divisions" :key="item.value" :label="item.label"
                         :value="item.value"/>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="管理归口" label-width="100px" style="width: 100%">
            <el-select
              v-model="projectForm.managementCentralizationList"
              clearable
              :multiple="true"
              placeholder="请选择"
              style="width: 100%"
              collapse-tags
            >
              <el-option v-for="item in dict.type.sys_centralized_management" :key="item.value" :label="item.label"
                         :value="item.value"/>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="6">
          <el-form-item label="项目审批类型" label-width="100px" style="width: 100%">
            <el-select
              v-model="projectForm.projectApprovalType"
              clearable
              placeholder="请选择"
              style="width: 100%"
            >
              <el-option v-for="item in dict.type.sys_approval_type" :key="item.value" :label="item.label"
                         :value="item.value"/>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="投资类别" label-width="100px" style="width: 100%">
            <el-input v-model="largeCategory" clearable disabled placeholder="请选择大类" style="width: 49%"/>
            <el-input v-model="subclass" clearable disabled placeholder="请选择小类" style="width: 49%;margin-left: 2%"/>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="重点分类" label-width="100px" style="width: 100%">
            <el-select
              v-model="projectForm.importanceType"
              clearable
              placeholder="请选择"
              style="width: 100%"
            >
              <el-option v-for="item in dict.type.sys_key_categories" :key="item.value" :label="item.label"
                         :value="item.value"/>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="6">
          <el-form-item label="立项时间" label-width="100px" prop="setTime" style="width: 100%">
            <el-date-picker v-model="projectForm.createProjectTime"
                            placeholder="选择时间"
                            style="width: 100%"
                            type="date"
                            value-format="yyyy-MM-dd HH:mm:ss"/>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="计划开工时间" label-width="100px" style="width: 100%">
            <el-date-picker v-model="projectForm.planStartTime "
                            placeholder="选择时间"
                            style="width: 100%"
                            type="date"
                            value-format="yyyy-MM-dd HH:mm:ss"/>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="计划竣工时间" label-width="100px" style="width: 100%">
            <el-date-picker v-model="projectForm.planCompleteTime "
                            placeholder="选择时间"
                            style="width: 100%"
                            type="date"
                            value-format="yyyy-MM-dd HH:mm:ss"/>
          </el-form-item>
        </el-col>
      </el-row>
      <div style="width: 100%;position: relative;border: 1px solid #d7d7d7;margin-bottom: 15px;padding: 4px;min-height: 45px">
        <div style="font-size: small;margin-bottom: 5px">中标单位：</div>
      <div class="label">
        <div style="font-size: small;margin-bottom: 10px">基础信息：</div>
        <div>
          <el-row :gutter="20">
            <el-col :span="6">
              <el-form-item class="item" label="项目名称" label-width="100px" prop="projectName">
                <el-input v-model.trim="projectForm.projectName" class="item" clearable maxlength="255" placeholder="请输入"/>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item class="item" label="项目代码" label-width="100px" prop="projectCode">
                <el-input v-model.trim="projectForm.projectCode" class="item" clearable maxlength="255"
                          placeholder="请输入"/>
              </el-form-item>
            </el-col>
            <el-col :span="12" style="position: relative">
              <div style="width: 100%; height: 100%; position: absolute;">
                <el-form-item class="item" label="赋码" label-width="50px" prop="coding">
                  <template slot-scope="scope">
                    <!--                <div class="yellow-dot" v-if="scope.row.coding === 'yellow'"></div>-->
                    <!--                <div class="green-dot" v-if="scope.row.coding === 'green'"></div>-->
                    <!--                <div class="red-dot" v-if="scope.row.coding === 'red'"></div>-->
                    <div class="red-dot"></div>
                    <tag-list></tag-list>
                  </template>
                </el-form-item>
                <!--            <img alt="" src="../../../../assets/images/s.png"/>-->
              </div>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item class="item" label="建设内容" label-width="100px" prop="content">
                <el-input v-model.trim="projectForm.content" style="width: 100%;" clearable maxlength="255"
                          placeholder="请输入" type="textarea"/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="6">
              <el-form-item label="资金类型" label-width="100px" prop="fundType" style="width: 100%">
                <el-select v-model="projectForm.fundType" clearable placeholder="请选择" style="width: 100%">
                  <el-option v-for="item in dict.type.sys_funding_type" :key="item.value" :label="item.label"
                             :value="item.value"/>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="项目投资类别" label-width="100px" prop="investType" style="width: 100%">
                <el-select v-model="projectForm.investType" clearable placeholder="请选择" style="width: 100%">
                  <el-option v-for="item in dict.type.sys_investment_type" :key="item.value" :label="item.label"
                             :value="item.value"/>
                </el-select>
              </el-form-item>
            </el-col>

            <el-col :span="6">
              <el-col :span="6">
                <el-form-item label="建设性质" label-width="100px" prop="constructionNature" style="width: 100%; min-width: 260px">
                  <el-select
                    v-model="projectForm.constructionNature"
                    clearable
                    placeholder="请选择"
                    style="width: 100%"
                  >
                    <el-option v-for="item in dict.type.construction_nature" :key="item.value" :label="item.label"
                               :value="item.value"/>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="6">
              <el-form-item label="项目类型" label-width="100px" prop="projectType" style="width: 100%">
                <el-select v-model="projectForm.projectType" clearable placeholder="请选择" style="width: 100%">
                  <el-option v-for="item in dict.type.sys_project_type" :key="item.value" :label="item.label"
                             :value="item.value"/>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="项目状态" label-width="100px" prop="projectstatus" style="width: 100%">
                <el-select v-model="projectForm.projectStatus" clearable placeholder="请选择" @change="handleProjectStatusChange" style="width: 100%">
                  <el-option v-for="item in dict.type.sys_project_status" :key="item.value" :label="item.label"
                             :value="item.value"/>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="项目阶段" label-width="100px" prop="fundsType" style="width: 100%">
                <el-input v-model.trim="projectForm.projectPhase" class="item" clearable disabled maxlength="255"
                          placeholder="请输入"/>
              </el-form-item>
            </el-col>
            <!--        <el-col :span="6">-->
            <!--          <el-form-item label="项目业主单位" label-width="100px" prop="projectOwnerUnit" style="width: 100%">-->
            <!--            <el-input v-model.trim="projectForm.projectOwnerUnit" class="item" clearable maxlength="255"-->
            <!--                      placeholder="请输入"/>-->
            <!--          </el-form-item>-->
            <!--        </el-col>-->
          </el-row>
          <el-row :gutter="20">
            <el-col :span="6">
              <el-form-item label="项目联系人" label-width="100px" prop="projectContactPerson" style="width: 100%">
                <el-input v-model.trim="projectForm.projectContactPerson" class="item" clearable maxlength="255"
                          placeholder="请输入"/>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="联系方式" label-width="100px" prop="contact" style="width: 100%">
                <el-input v-model.trim="projectForm.contact" class="item" clearable maxlength="255" placeholder="请输入"/>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <!-- TODO：暂时不做 -->
              <el-form-item label="关联工程" label-width="100px" prop="engineering" style="width: 100%">
                <!--            <el-input v-model.trim="getEngineeringName" class="item" clearable disabled maxlength="255" placeholder="请在工程中选择项目" />-->
                <el-select v-model="projectForm.engineeringIdList" :multiple="true" collapse-tags placeholder="请选择"
                           style="width: 100%">
                  <el-option v-for="item in selectOptions" :key="item.id" :label="item.engineeringName" :value="item.id"/>
                  <!--              <RemoteSelect v-if="selectOptions.length" :hasMore="hasMore" :loading="loading" :page="page" @loadMore="handleLoadMore" />-->
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="6">
              <el-form-item label="主管部门" label-width="100px" prop="competentDepartmentList" style="width: 100%">
                <el-select
                  v-model="projectForm.competentDepartmentList"
                  clearable
                  :multiple="true"
                  placeholder="请选择"
                  style="width: 100%"
                  collapse-tags
                >
                  <el-option
                    v-for="item in approvalList"
                    :key="item.id"
                    :value="item.id"
                    :label="item.value"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="行政区划" label-width="100px" prop="area" style="width: 100%">
                <el-select
                  v-model="projectForm.area"
                  clearable
                  placeholder="请选择"
                  style="width: 100%"
                >
                  <el-option v-for="item in dict.type.sys_administrative_divisions" :key="item.value" :label="item.label"
                             :value="item.value"/>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="管理归口" label-width="100px" style="width: 100%">
                <el-select
                  v-model="projectForm.managementCentralizationList"
                  clearable
                  :multiple="true"
                  placeholder="请选择"
                  style="width: 100%"
                  collapse-tags
                >
                  <el-option v-for="item in dict.type.sys_centralized_management" :key="item.value" :label="item.label"
                             :value="item.value"/>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="6">
              <el-form-item label="项目审批类型" label-width="100px" style="width: 100%">
                <el-select
                  v-model="projectForm.projectApprovalType"
                  clearable
                  placeholder="请选择"
                  style="width: 100%"
                >
                  <el-option v-for="item in dict.type.sys_approval_type" :key="item.value" :label="item.label"
                             :value="item.value"/>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="投资类别" label-width="100px" style="width: 100%">
                <el-input v-model="largeCategory" clearable disabled placeholder="请选择大类" style="width: 49%"/>
                <el-input v-model="subclass" clearable disabled placeholder="请选择小类" style="width: 49%;margin-left: 2%"/>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="重点分类" label-width="100px" style="width: 100%">
                <el-select
                  v-model="projectForm.importanceType"
                  clearable
                  placeholder="请选择"
                  style="width: 100%"
                >
                  <el-option v-for="item in dict.type.sys_key_categories" :key="item.value" :label="item.label"
                             :value="item.value"/>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="6">
              <el-form-item label="立项时间" label-width="100px" prop="setTime" style="width: 100%">
                <el-date-picker v-model="projectForm.createProjectTime"
                                placeholder="选择时间"
                                style="width: 100%"
                                type="date"
                                value-format="yyyy-MM-dd HH:mm:ss"/>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="计划开工时间" label-width="100px" style="width: 100%">
                <el-date-picker v-model="projectForm.planStartTime "
                                placeholder="选择时间"
                                style="width: 100%"
                                type="date"
                                value-format="yyyy-MM-dd HH:mm:ss"/>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="计划竣工时间" label-width="100px" style="width: 100%">
                <el-date-picker v-model="projectForm.planCompleteTime "
                                placeholder="选择时间"
                                style="width: 100%"
                                type="date"
                                value-format="yyyy-MM-dd HH:mm:ss"/>
              </el-form-item>
            </el-col>
          </el-row>
        </div>
      </div>
      <div class="label">
        <div style="font-size: small;margin-bottom: 10px">中标单位：</div>
        <div>
          <el-row :gutter="20" v-for="(winUnit,index) in projectForm.winUnitList" :key="'zb' + index">
            <el-col :span="4">
@@ -265,46 +280,50 @@
            </el-col>
          </el-row>
        </div>
        <div style="position: absolute; top: 2px; right: 2px">
        <div style="position: absolute; top: 0px; right: 0px">
          <el-button type="primary" @click="addWinUnit" icon="el-icon-plus"></el-button>
        </div>
      </div>

      <el-row :gutter="20">
        <el-col :span="6">
          <el-form-item label="年度投资计划" label-width="100px" prop="year" style="width: 100%">
            <el-select
              v-model="projectForm.year"
              clearable
              placeholder="请选择"
              style="width: 100%"
            >
              <el-option v-for="item in dict.type.sys_annual_plan" :key="item.value" :label="item.label"
                         :value="item.value"/>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="年度投资金额" label-width="100px" prop="company" style="width: 100%; min-width: 260px">
            <el-input v-model.trim="projectForm.yearInvestAmount" clearable maxlength="255" placeholder="请输入"
                      style="width: 90%" type="number"/>
            <span style="margin-left: 2px">元</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="建设性质" label-width="100px" prop="constructionNature" style="width: 100%; min-width: 260px">
            <el-select
              v-model="projectForm.constructionNature"
              clearable
              placeholder="请选择"
              style="width: 100%"
            >
              <el-option v-for="item in dict.type.construction_nature" :key="item.value" :label="item.label"
                         :value="item.value"/>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <div class="label">
        <div style="font-size: small;margin-bottom: 10px">年度投资计划：</div>
        <div>
          <el-row :gutter="20" v-for="(yearPlan,index) in projectForm.yearPlanList" :key="'year' + index">
            <el-col :span="6">
              <el-form-item label="年度" label-width="100px" prop="year" style="width: 100%">
                <el-select
                  v-model="yearPlan.year"
                  clearable
                  placeholder="请选择"
                  style="width: 100%"
                >
                  <el-option v-for="item in dict.type.sys_annual_plan" :key="item.value" :label="item.label"
                             :value="item.value"/>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="年度投资金额" label-width="100px" prop="company" style="width: 100%; min-width: 260px">
                <el-input v-model.trim="yearPlan.yearTotalMoney" clearable maxlength="255" placeholder="请输入"
                          style="width: 90%" type="number"/>
                <span style="margin-left: 2px">元</span>
              </el-form-item>
            </el-col>
            <el-col :span="10">
              <el-form-item label="工程形象进度" label-width="100px" style="width: 100%">
                <el-input v-model.trim="yearPlan.projectImageProgress" class="item" clearable maxlength="255" placeholder="请输入" type="textarea"/>
              </el-form-item>
            </el-col>
            <el-col :span="1">
              <el-button type="danger" icon="el-icon-delete" v-show="projectForm.yearPlanList.length > 1" @click="removeYearPlan(index)" circle></el-button>
            </el-col>
          </el-row>
        </div>
        <div style="position: absolute; top: 0px; right: 0px">
          <el-button type="primary" @click="addYearPlan" icon="el-icon-plus"></el-button>
        </div>
      </div>

      <el-row :gutter="0">
        <el-col :span="18">
          <el-form-item label="项目地址:" label-width="100px" prop="medicalAddr" style="width: 100%">
@@ -409,6 +428,11 @@
          contacts: '',
          phone: ''
        }],
        yearPlanList: [{
          year: '',
          yearTotalMoney: null,
          projectImageProgress: '',
        }],
        projectAddress: '',
        engineeringIdList: [],
        content: '',
@@ -420,8 +444,6 @@
        projectContactPerson: '',
        fileList: [],
        engineeringInfos: [],
        year: '',
        yearInvestAmount: '',
        competentDepartmentList: [],
        managementCentralizationList: [],
        remark: ''
@@ -489,6 +511,16 @@
    },
    removeWinUnit(index) {
      this.projectForm.winUnitList.splice(index, 1)
    },
    addYearPlan() {
      this.projectForm.yearPlanList.push({
        year: '',
        yearTotalMoney: null,
        projectImageProgress: '',
      })
    },
    removeYearPlan(index) {
      this.projectForm.yearPlanList.splice(index, 1)
    },
    handleProjectStatusChange(value) {
      // 根据选中的 projectStatus 修改 anotherField 的值
@@ -680,4 +712,13 @@
  border-radius: 50%; /* 使元素变成圆形 */
  display: inline-block; /* 确保元素可以和其他内联元素一起显示 */
}
.label {
  width: 100%;
  position: relative;
  border: 1px solid #d7d7d7;
  margin-bottom: 15px;
  padding: 4px;
  min-height: 45px;
  color: #909399;
}
</style>