From 0dace92d5801bfac77eedc09598c84fbd4f9df3d Mon Sep 17 00:00:00 2001 From: xiangpei <xiangpei@timesnew.cn> Date: 星期三, 19 二月 2025 12:28:18 +0800 Subject: [PATCH] 样式 --- src/views/projectEngineering/projectLibrary/component/BasicInfo.vue | 772 +++++++++++++++++++++++++++++++++++----------------------- 1 files changed, 467 insertions(+), 305 deletions(-) diff --git a/src/views/projectEngineering/projectLibrary/component/BasicInfo.vue b/src/views/projectEngineering/projectLibrary/component/BasicInfo.vue index 1319e34..463e144 100644 --- a/src/views/projectEngineering/projectLibrary/component/BasicInfo.vue +++ b/src/views/projectEngineering/projectLibrary/component/BasicInfo.vue @@ -1,259 +1,329 @@ <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="椤圭洰浠g爜" label-width="100px" prop="projectCode"> - <el-input v-model.trim="projectForm.projectCode" class="item" clearable disabled maxlength="255" - placeholder="璇疯緭鍏�"/> - </el-form-item> - </el-col> - <el-col :span="12" style="position: relative"> - <div style="width: 150px; position: absolute;"><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="璇烽�夋嫨" 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="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 - @change="changeDepartment"> - <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 - @change="changePutUnder" - > - <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="璁″垝绔e伐鏃堕棿" 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> - <el-row :gutter="20"> - <el-col :span="6"> - <el-form-item label="涓爣鍗曚綅" label-width="100px" prop="setTime" style="width: 100%"> - <el-input v-model.trim="projectForm.winUnit" class="item" clearable maxlength="255" placeholder="璇疯緭鍏�"/> - </el-form-item> - </el-col> - <el-col :span="6"> - <el-form-item label="涓爣閲戦" label-width="100px" style="width: 100%"> - <el-input v-model.trim="projectForm.winAmount" class="item" clearable maxlength="255" placeholder="璇疯緭鍏�" - type="number"/> - </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.winTime" - placeholder="閫夋嫨鏃堕棿" - style="width: 100%" - type="date" - value-format="yyyy-MM-dd HH:mm:ss"/> - </el-form-item> - </el-col> - </el-row> - <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-row> + <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="椤圭洰浠g爜" 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="璁″垝绔e伐鏃堕棿" 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"> + <el-form-item label="鍗曚綅鍚嶇О" label-width="100px" prop="setTime" style="width: 100%"> + <el-input v-model.trim="winUnit.winUnit" class="item" clearable maxlength="255" placeholder="璇疯緭鍏�"/> + </el-form-item> + </el-col> + <el-col :span="4"> + <el-form-item label="涓爣閲戦" label-width="100px" style="width: 100%"> + <el-input v-model.trim="winUnit.winAmount" class="item" clearable maxlength="255" placeholder="璇疯緭鍏�" + type="number"/> + </el-form-item> + </el-col> + <el-col :span="4"> + <el-form-item label="涓爣鏃堕棿" label-width="100px" style="width: 100%"> + <el-date-picker v-model="winUnit.winTime" + placeholder="閫夋嫨鏃堕棿" + style="width: 100%" + type="date" + value-format="yyyy-MM-dd HH:mm:ss"/> + </el-form-item> + </el-col> + <el-col :span="4"> + <el-form-item label="鍗曚綅鑱旂郴浜�" label-width="100px" style="width: 100%"> + <el-input v-model.trim="winUnit.contacts" class="item" clearable maxlength="20" placeholder="璇疯緭鍏�"/> + </el-form-item> + </el-col> + <el-col :span="4"> + <el-form-item label="鑱旂郴鐢佃瘽" label-width="100px" style="width: 100%"> + <el-input v-model.trim="winUnit.phone" class="item" clearable maxlength="20" placeholder="璇疯緭鍏�"/> + </el-form-item> + </el-col> + <el-col :span="1"> + <el-button type="danger" icon="el-icon-delete" v-show="projectForm.winUnitList.length > 1" @click="removeWinUnit(index)" circle></el-button> + </el-col> + </el-row> + </div> + <div style="position: absolute; top: 0px; right: 0px"> + <el-button type="primary" @click="addWinUnit" icon="el-icon-plus"></el-button> + </div> + </div> + + <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%"> @@ -295,6 +365,7 @@ <script> // import Upload from '@element-plus/icons-vue/dist/Upload.vue'; import Map from '@/views/components/Map/index.vue'; +import TagList from "./TagList.vue"; // import MapMouseEvent from '@/views/components/Map/types'; // import UploadStandard from '@/components/uploadStandard.vue'; // import { usePlanLibrary } from '@/hooks/detailsInformation'; @@ -305,10 +376,12 @@ import {approvalList} from "@/api/system/dept"; export default { + name: 'BasicInfo', dicts: ['sys_funding_type', 'sys_investment_type', 'sys_project_type', 'sys_project_status', 'sys_competent_department' - , 'sys_administrative_divisions', 'sys_centralized_management', 'sys_approval_type', 'sys_key_categories', 'sys_annual_plan'], + , 'sys_administrative_divisions', 'sys_centralized_management', 'sys_approval_type', 'sys_key_categories', 'sys_annual_plan', 'construction_nature'], components: { Map, + TagList, // UploadStandard, // RemoteSelect }, @@ -316,7 +389,11 @@ disabled: { type: Boolean, default: false - } + }, + isShow: { + type: Boolean, + required: true, + }, }, data() { return { @@ -325,7 +402,7 @@ projectName: '', projectCode: '', projectType: '', - projectStatus: 'working', + projectStatus: 'pendding', fundType: '', investType: '', importanceType: '', @@ -344,24 +421,35 @@ setTime: '', assignmentStatus: '', area: '', - winTime: '', - winUnit: '', - winAmount: '', + winUnitList: [{ + winUnit: '', + winTime: null, + winAmount: '', + contacts: '', + phone: '' + }], + yearPlanList: [{ + year: '', + yearTotalMoney: null, + projectImageProgress: '', + }], projectAddress: '', engineeringIdList: [], content: '', + constructionNature: '', contact: '', - projectOwnerUnit: '', + projectOwnerUnit: null, planStartTime: '', planCompleteTime: '', projectContactPerson: '', fileList: [], engineeringInfos: [], - year: '', - yearInvestAmount: '', competentDepartmentList: [], - managementCentralizationList: [] + managementCentralizationList: [], + remark: '' }, + subclass: '', + largeCategory: '', approvalList: [], setTime: '', planStartTime: '', @@ -373,8 +461,6 @@ hasMore: true, selectOptions: [], accept: ['pdf', 'docx', 'xlsx', 'jpg', 'jpeg'], - largeCategory: '', - subclass: '', mapCreateInfo: {}, demoFormRef: null, rules: { @@ -392,28 +478,65 @@ }, mounted() { this.projectForm.id = this.$route.query.projectId; - const projectForm = Cookies.get("projectForm"); + const projectForm = localStorage.getItem("projectForm"); + //鍒濆鍖栦富绠¢儴闂ㄤ笅鎷夋 + this.getApprovalList(); if (projectForm) { this.projectForm = JSON.parse(projectForm); + this.$emit('updateIsShow', true); } else { - //鍒濆鍖栦富绠¢儴闂ㄤ笅鎷夋 - this.getApprovalList(); + this.projectForm.id = this.$route.query.projectId; // 鍦ㄧ粍浠跺垱寤烘椂鑾峰彇椤圭洰淇℃伅锛屽鏋� projectId 瀛樺湪 if (this.projectForm.id) { this.getProjectInfo(this.projectForm.id); } else { - this.getProjectCodeApi(); + // this.getProjectCodeApi(); + this.$emit('updateIsShow', true); } // this.handleLoadMore(1); } }, beforeDestroy() { - Cookies.set("projectForm", JSON.stringify(this.projectForm)); + // localStorage.setItem("projectForm", JSON.stringify(this.projectForm)); }, methods: { + addWinUnit() { + this.projectForm.winUnitList.push({ + winUnit: '', + winTime: null, + winAmount: '', + contacts: '', + phone: '' + }) + }, + 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 鐨勫�� + if (value === 'working' || value === 'stop') { + this.projectForm.projectPhase = '瀹炴柦闃舵'; + } else if (value === 'finish') { + this.projectForm.projectPhase = '绔e伐鎶曠敤闃舵'; + } else if (value === 'pendding') { + this.projectForm.projectPhase = '鍌ㄥ瑙勫垝闃舵'; + } + }, getProjectInfo(id) { getProject(id).then(res => { this.projectForm = res.data; + this.$emit('updateIsShow', true); + }); }, getApprovalList() { @@ -421,10 +544,11 @@ this.approvalList = res.data; }); }, - submit() { + submit(usedStatus) { this.$refs["projectForm"].validate(valid => { if (valid) { - if (this.projectForm.id != null) { + this.projectForm.usedStatus = usedStatus; + if (this.projectForm.id) { updateProject(this.projectForm).then(response => { this.$modal.msgSuccess("淇敼鎴愬姛"); //璺宠浆鍒颁笅涓粍浠� @@ -446,22 +570,23 @@ this.projectForm.projectCode = res.data; }); }, - changeDepartment(val) { - if (!val.length) { - this.largeCategory = ''; - return; - } - const labels = this.approvalList.filter(item => val.includes(item.id)).map(item => item.value); - this.largeCategory = labels.join(','); - }, - changePutUnder(val) { - if (!val.length) { - this.subclass = ''; - return; - } - const labels = this.dict.type.sys_centralized_management.filter(item => val.includes(item.value)).map(item => item.label); - this.subclass = labels.join(','); - }, + // changeDepartment(val) { + // console.log("瑙﹀彂浜嬩欢" + val + this.approvalList) + // if (!val.length) { + // this.largeCategory = ''; + // return; + // } + // const labels = this.approvalList.filter(item => val.includes(item.id)).map(item => item.value); + // this.largeCategory = labels.join(','); + // }, + // changePutUnder(val) { + // if (!val.length) { + // this.subclass = ''; + // return; + // } + // const labels = this.dict.type.sys_centralized_management.filter(item => val.includes(item.value)).map(item => item.label); + // this.subclass = labels.join(','); + // }, async loadDataList(newPage) { try { this.loading = true; @@ -500,28 +625,32 @@ this.$message.success('鑾峰彇鍦板潃鎴愬姛'); this.dialogMap = false; } else { - this.$message.error('鑾峰彇鍧愭爣澶辫触'); + this.$message.error('璇峰厛鐐瑰嚮鍦板浘閫夋嫨鍦板潃'); } }, }, watch: { - 'projectForm.managementCentralizationList'(val) { - if (val) { - const labels = this.dict.type.sys_centralized_management - .filter(item => val.includes(item.value)) - .map(item => item.label); - this.subclass = labels.join(','); - } - }, - 'projectForm.competentDepartmentList'(val) { - if (val) { - const labels = this.approvalList - .filter(item => val.includes(item.id)) - .map(item => item.value); - this.largeCategory = labels.join(','); - } - }, + 'projectForm': { + handler(newVal, oldVal) { + setTimeout(() => { + if (newVal.managementCentralizationList) { + const labels = this.dict.type.sys_centralized_management + .filter(item => newVal.managementCentralizationList.includes(item.value)) + .map(item => item.label); + this.subclass = labels.join(','); + } + if (newVal.competentDepartmentList) { + const labels = this.approvalList + .filter(item => newVal.competentDepartmentList.includes(item.id)) + .map(item => item.value); + this.largeCategory = labels.join(','); + } + }, 1000); + this.$emit('basicInfoForm', newVal) + }, + deep: true + } } }; </script> @@ -559,4 +688,37 @@ width: 20px; } } + +.yellow-dot { + width: 10px; /* 鍦嗙偣鐨勫搴� */ + height: 10px; /* 鍦嗙偣鐨勯珮搴� */ + background-color: yellow; /* 鍦嗙偣鐨勯鑹� */ + border-radius: 50%; /* 浣垮厓绱犲彉鎴愬渾褰� */ + display: inline-block; /* 纭繚鍏冪礌鍙互鍜屽叾浠栧唴鑱斿厓绱犱竴璧锋樉绀� */ +} + +.red-dot { + width: 10px; /* 鍦嗙偣鐨勫搴� */ + height: 10px; /* 鍦嗙偣鐨勯珮搴� */ + background-color: red; /* 鍦嗙偣鐨勯鑹� */ + border-radius: 50%; /* 浣垮厓绱犲彉鎴愬渾褰� */ + display: inline-block; /* 纭繚鍏冪礌鍙互鍜屽叾浠栧唴鑱斿厓绱犱竴璧锋樉绀� */ +} + +.green-dot { + width: 10px; /* 鍦嗙偣鐨勫搴� */ + height: 10px; /* 鍦嗙偣鐨勯珮搴� */ + background-color: green; /* 鍦嗙偣鐨勯鑹� */ + 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> -- Gitblit v1.8.0