wbs.vue 61 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690
  1. <template>
  2. <div class="h-full">
  3. <HcCard id-ref="wbs-node-tree-card-target" v-if="wbsTypeTabKey === 'map'">
  4. <template #header>
  5. <HcTooltip keys="wbs_views_division_btn">
  6. <el-button type="primary" hc-btn @click="divisionClick">
  7. <HcIcon name="node-tree" :line="false"/>
  8. <span>划分变更</span>
  9. </el-button>
  10. </HcTooltip>
  11. <HcTooltip keys="wbs_views_drawings" v-if="isDrawer">
  12. <el-button hc-btn :disabled="!nodeDataInfo?.fileUrl" @click="viewsDrawings">
  13. <HcIcon name="image"/>
  14. <span>查看图纸</span>
  15. </el-button>
  16. </HcTooltip>
  17. <el-button :type="authBtnTabKey === '1'?'primary':''" hc-btn @click="authBtnTabClick('1')" v-if="isDrawer">
  18. <HcIcon name="folder-user"/>
  19. <span>施工自检</span>
  20. </el-button>
  21. <el-button :type="authBtnTabKey === '2'?'primary':''" hc-btn @click="authBtnTabClick('2')" v-if="isDrawer">
  22. <HcIcon name="folder-shield"/>
  23. <span>监理质检</span>
  24. </el-button>
  25. </template>
  26. <template #extra>
  27. <HcNewSwitch :datas="wbsTypeTab" :keys="wbsTypeTabKey" @change="wbsTypeTabChange"/>
  28. </template>
  29. <NodeTree ref="NodeTreeRef" :autoExpandKeys="TreeAutoExpandKeys" :menus="ElTreeMenu" :isMark="TreeMark" :projectId="projectId" :contractId="contractId"
  30. :accordion='NodeTreeAccordion' @nodeClick="NodeTreeClick" @nodeDblClick="NodeTreeDblClick" @menuClick="NodeTreeMenuClick"/>
  31. <template #action>
  32. <div class="hc-tree-mp-tip-box">
  33. <div class="dot-view green">已审批</div>
  34. <div class="dot-view black">未填报</div>
  35. <div class="dot-view orange">已填报-待审批</div>
  36. <div class="dot-view blue">已填报-未上报</div>
  37. </div>
  38. </template>
  39. <HcDrawer :show="isDrawer" actionUi="text-center" to-id="wbs-node-tree-card-target" @close="drawerClose">
  40. <!--清表列表-->
  41. <el-scrollbar ref="ListItemScrollRef" v-if="ListItemDatas.length > 0">
  42. <ListItem ref="ListItemsRef"
  43. :datas="ListItemDatas"
  44. :status="NodeStatus"
  45. :classify="authBtnTabKey"
  46. @offsetTop="ListItemOffsetTop"
  47. :projectInfo="projectInfo"
  48. :primaryKeyId="primaryKeyId"
  49. :contractId="contractId"
  50. @renew="getTableDataAll"
  51. :drawType="isDrawType"
  52. />
  53. </el-scrollbar>
  54. <HcStatus text="暂无表单" v-else/>
  55. <!--底部按钮区域-->
  56. <template #action>
  57. <HcTooltip keys="wbs_save" v-if="NodeStatus !== '3'">
  58. <el-button type="primary" hc-btn :disabled="NodeStatus === '3' || ListItemDatas.length <= 0" :loading="tableFormSaveLoading" @click="tableFormSaveClick">
  59. <HcIcon name="save"/>
  60. <span>保存</span>
  61. </el-button>
  62. </HcTooltip>
  63. <HcTooltip keys="wbs_report" v-if="NodeStatus !== '3'">
  64. <el-button hc-btn :disabled="NodeStatus === '3' || NodeStatus === '1'" :loading="reportLoading" @click="reportModalClick">
  65. <HcIcon name="send-plane-2"/>
  66. <span>上报</span>
  67. </el-button>
  68. </HcTooltip>
  69. <HcTooltip keys="wbs_preview">
  70. <el-button hc-btn :disabled="NodeStatus === '1'" :loading="bussPdfsLoading" @click="bussPdfsClick">
  71. <HcIcon name="eye"/>
  72. <span>预览</span>
  73. </el-button>
  74. </HcTooltip>
  75. <HcTooltip keys="wbs_abolish" v-if="NodeStatus === '3'">
  76. <el-button hc-btn @click="abolishOneClick">
  77. <HcIcon name="arrow-go-back"/>
  78. <span>撤回上报流程</span>
  79. </el-button>
  80. </HcTooltip>
  81. <el-button hc-btn @click="drawerClose">
  82. <HcIcon name="close"/>
  83. <span>关闭填报页面</span>
  84. </el-button>
  85. </template>
  86. </HcDrawer>
  87. </HcCard>
  88. <div class="hc-layout-box" v-if="wbsTypeTabKey === 'tree'">
  89. <div class="hc-layout-left-box" id="wbs-left-tree" :style="'width:' + leftWidth + 'px;'" v-if="true">
  90. <div class="hc-project-box">
  91. <div class="hc-project-icon-box">
  92. <HcIcon name="stack"/>
  93. </div>
  94. <div class="ml-2 project-name-box">
  95. <span class="text-xl text-cut project-alias">{{projectInfo['projectAlias']}}</span>
  96. <div class="text-xs text-cut project-name">{{projectInfo['name']}}</div>
  97. </div>
  98. </div>
  99. <div class="hc-tree-box">
  100. <div class="hc-search-tree-val">
  101. <el-input v-model="searchTreeVal" block size="large" placeholder="请输入名称关键词检索" clearable @keyup="searchTreeKeyUp">
  102. <template #suffix>
  103. <HcIcon name="search-2" ui="text-xl" @click="searchTreeClick"/>
  104. </template>
  105. </el-input>
  106. </div>
  107. <div class="hc-tree-scrollbar" v-loading="treeLoading" element-loading-text="获取数据中...">
  108. <el-scrollbar>
  109. <KeepAlive>
  110. <template v-if="isSearchTree">
  111. <HcTreeData
  112. :datas="searchTreeData"
  113. :menus="ElTreeMenu"
  114. :isMark="TreeMark"
  115. :autoExpandKeys="TreeAutoExpandKeys"
  116. :searchTreeVal="searchTreeVal" isColor @nodeTap="wbsElTreeClick"
  117. @menuTap="ElTreeMenuClick"
  118. @changeSearch="changeisSearch"
  119. :submitCounts="false"
  120. />
  121. </template>
  122. <template v-else>
  123. <WbsTree
  124. :submitCounts="false"
  125. :menus="ElTreeMenu"
  126. :isMark="TreeMark"
  127. :autoExpandKeys="TreeAutoExpandKeys"
  128. :projectId="projectId"
  129. :contractId="contractId"
  130. :classifyType="authBtnTabKey"
  131. isColor
  132. @nodeTap="wbsElTreeClick"
  133. @menuTap="ElTreeMenuClick"
  134. @nodeLoading="ElTreeNodeLoading"
  135. ref="wbstree"
  136. :treeKey="wbstreeKey"
  137. />
  138. </template>
  139. </KeepAlive>
  140. </el-scrollbar>
  141. </div>
  142. </div>
  143. <div class="hc-tree-foot-tip-box">
  144. <div class="dot-view green">已审批</div>
  145. <div class="dot-view black">未填报</div>
  146. <div class="dot-view orange">已填报-待审批</div>
  147. <div class="dot-view blue">已填报-未上报</div>
  148. </div>
  149. <!--左右拖动-->
  150. <div class="horizontal-drag-line" @mousedown="onmousedown"/>
  151. </div>
  152. <div class="hc-layout-content-box">
  153. <!-- <div class="hc-layout-content-box-lefticon" v-if="isShowLefticon">
  154. <el-icon><CaretLeft @click="isHiddenleftbox" /></el-icon>
  155. </div>
  156. <div class="hc-layout-content-box-righticon" v-else>
  157. <el-icon><CaretRight @click="isShowleftbox" /></el-icon>
  158. </div> -->
  159. <div class="hc-arrow-icon hc-layout-content-box-lefticon" v-if="isShowLefticon" @click="isHiddenleftbox">
  160. <HcIcon name="arrow-left" />
  161. </div>
  162. <div class="hc-arrow-icon hc-layout-content-box-righticon" v-else @click="isShowleftbox">
  163. <HcIcon name="arrow-right" />
  164. </div>
  165. <HcCard actionUi="text-center">
  166. <template #header>
  167. <HcTooltip keys="wbs_views_drawings">
  168. <el-button hc-btn :disabled="!nodeDataInfo?.fileUrl" @click="viewsDrawings" style="height:30px">
  169. <HcIcon name="image"/>
  170. <span>查看图纸</span>
  171. </el-button>
  172. </HcTooltip>
  173. <!-- <el-button :type="authBtnTabKey === '1'?'primary':''" hc-btn @click="authBtnTabClick('1')">
  174. <HcIcon name="folder-user"/>
  175. <span>施工自检</span>
  176. </el-button>
  177. <el-button :type="authBtnTabKey === '2'?'primary':''" hc-btn @click="authBtnTabClick('2')">
  178. <HcIcon name="folder-shield"/>
  179. <span>监理质检</span>
  180. </el-button> -->
  181. <HcNewSwitchtype :datas="authBtnTabdata" :keys="authBtnTabKey" @change="authBtnTabClick" style="margin-left:20px"/>
  182. </template>
  183. <!--切换导图或树形模式-->
  184. <template #extra>
  185. <HcNewSwitch :datas="wbsTypeTab" :keys="wbsTypeTabKey" @change="wbsTypeTabChange"/>
  186. </template>
  187. <!--清表列表-->
  188. <el-scrollbar ref="ListItemScrollRef" v-loading="ListItemLoading" v-if="ListItemDatas.length > 0">
  189. <ListItem
  190. ref="ListItemRef"
  191. :datas="ListItemDatas"
  192. :status="NodeStatus"
  193. :classify="authBtnTabKey"
  194. :authBtnTabKey="authBtnTabKey"
  195. @offsetTop="ListItemOffsetTop"
  196. :projectInfo="projectInfo"
  197. :primaryKeyId="primaryKeyId"
  198. :contractId="contractId"
  199. @renew="getTableDataAll"
  200. :drawType="!isDrawType"
  201. :wbsTempId="projectInfo?.referenceWbsTemplateIdTrial" :wbsType="2" :tenantId="userInfo?.tenant_id"
  202. />
  203. </el-scrollbar>
  204. <HcStatus text="暂无表单" v-else/>
  205. <!--底部按钮区域-->
  206. <template #action >
  207. <el-alert title="完善资料填写后记得一定要保存哦"
  208. show-icon
  209. type="warning"
  210. :closable="false"
  211. style="background-color:#f1f5f8;display: inline;vertical-align: middle;"/>
  212. <HcTooltip keys="wbs_save" v-if="NodeStatus !== '3'">
  213. <el-button
  214. type="primary"
  215. style="width:150px;font-weight: bold;font-size:large"
  216. hc-btn
  217. :disabled="NodeStatus === '3' || ListItemDatas.length <= 0"
  218. :loading="tableFormSaveLoading"
  219. @click="tableFormSaveClick">
  220. <HcIcon name="save"/>
  221. <span>保存</span>
  222. </el-button>
  223. </HcTooltip>
  224. <HcTooltip keys="wbs_report" v-if="NodeStatus !== '3'">
  225. <el-button hc-btn :disabled="NodeStatus === '3' || NodeStatus === '1'" :loading="reportLoading" @click="reportModalClick">
  226. <HcIcon name="send-plane-2"/>
  227. <span>上报</span>
  228. </el-button>
  229. </HcTooltip>
  230. <HcTooltip keys="wbs_preview">
  231. <el-button hc-btn :disabled="NodeStatus === '1'" :loading="bussPdfsLoading" @click="bussPdfsClick">
  232. <HcIcon name="eye"/>
  233. <span>预览</span>
  234. </el-button>
  235. </HcTooltip>
  236. <HcTooltip keys="wbs_abolish" v-if="NodeStatus === '3'">
  237. <el-button hc-btn @click="abolishOneClick">
  238. <HcIcon name="arrow-go-back"/>
  239. <span>撤回上报流程</span>
  240. </el-button>
  241. </HcTooltip>
  242. </template>
  243. </HcCard>
  244. </div>
  245. </div>
  246. <!--上传图纸-->
  247. <div class="upload-drawing">
  248. <el-upload :action="action" :accept="accept" :headers="getTokenHeader()" :before-upload="beforeUpload" :on-success="uploadFinish" :on-error="uploadError">
  249. <div id="upload-drawing">上传图纸</div>
  250. </el-upload>
  251. </div>
  252. <!--查看图纸-->
  253. <HcDragModal title="查看图纸" ui="hc-image-preview-box" :isShow="drawingsShow" closeIcon tops="100" lefts="145" widths="380px" @close="drawingsClose">
  254. <div class="hc-image-preview-view">
  255. <el-image-viewer :url-list="[nodeDataInfo.fileUrl]"/>
  256. </div>
  257. </HcDragModal>
  258. <!--编辑节点-->
  259. <HcDialog :show="editNodeModal" title="编辑节点" widths="600px" :loading="editNodeLoading" @close="editNodeModal = false" @save="editNodeClick">
  260. <el-form ref="formEditNodeRef" :model="formEditNodeModel" :rules="formEditNodeRules" label-width="auto" size="large">
  261. <el-form-item label="节点名称" prop="title">
  262. <el-input v-model="formEditNodeModel.title" placeholder="请输入节点名称"/>
  263. </el-form-item>
  264. <el-form-item label="上级节点">
  265. <el-input v-model="formEditNodeModel.parent.title" disabled/>
  266. </el-form-item>
  267. <el-form-item label="节点类型">
  268. <el-select v-model="formEditNodeModel.type" block disabled>
  269. <el-option v-for="item in nodeTypeData" :label="item.label" :value="item.value"/>
  270. </el-select>
  271. </el-form-item>
  272. <el-form-item label="划分编号">
  273. <el-input v-model="formEditNodeModel.partitionCode" placeholder="请输入划分编号"/>
  274. </el-form-item>
  275. <!-- <el-form-item label="模板位置">
  276. <el-input v-model="formEditNodeModel.position" id="copyText">
  277. <template #append>
  278. <el-button :icon="DocumentCopy" @click="copyText"/>
  279. </template>
  280. </el-input>
  281. </el-form-item> -->
  282. </el-form>
  283. </HcDialog>
  284. <!--复制节点-->
  285. <HcDialog :show="copyNodeModal" title="复制节点" :widths="copyNodeTabKey === '1'?'600px':'1200px'" @close="copyNodeModal = false">
  286. <el-form ref="formCopyNodeModelRef" :model="formCopyNodeModel" :rules="formCopyNodeModelRules" label-width="auto" size="large" v-if="copyNodeTabKey !== '3'">
  287. <el-form-item label="节点名称" prop="title" style="margin-bottom: 0;">
  288. <el-input v-model="formCopyNodeModel.title" placeholder="请输入节点名称"/>
  289. </el-form-item>
  290. <el-form-item label="划分编号" prop="partitionCode" style="margin-top: 10px;" v-if="copyNodeTabKey === '1'">
  291. <el-input v-model="formCopyNodeModel.partitionCode" placeholder="请输入划分编号"/>
  292. </el-form-item>
  293. </el-form>
  294. <el-form ref="formCopyNodeModelRef" :model="formCopyNodeModel" :rules="formCopyNodeModelRules" label-width="auto" size="large" v-if="copyNodeTabKey === '3'">
  295. <el-form-item label="所属方" prop="classify" style="margin-bottom: 0;">
  296. <!-- <el-input v-model="formCopyNodeModel.classify" placeholder="请输入节点名称"/> -->
  297. <el-checkbox-group v-model="classifyList">
  298. <el-checkbox label="施工" />
  299. <el-checkbox label="监理" />
  300. </el-checkbox-group>
  301. </el-form-item>
  302. </el-form>
  303. <div class="copy-node-many-box" v-if="copyNodeTabKey !== '1'">
  304. <div class="copy-node-many-tree">
  305. <el-scrollbar>
  306. <WbsTree :autoExpandKeys="TreeAutoExpandKeys" :projectId="projectId" :contractId="contractId" idPrefix="tree-node-copy-" :isAutoClick="false" :isAutoKeys="false" @nodeTap="copyNodeElTreeClick"/>
  307. </el-scrollbar>
  308. </div>
  309. <div class="copy-node-many-table">
  310. <el-scrollbar>
  311. <el-table :data="copyNodeTable" border stripe>
  312. <el-table-column prop="title" label="复制到的位置"/>
  313. <el-table-column prop="nodeName" label="节点名称" v-if="copyNodeTabKey === '2'">
  314. <template #default="{row}">
  315. <el-form ref="copyNodeTableRef" :model="row" :rules="copyNodeTableRules" label-width="0" size="large">
  316. <el-form-item prop="nodeName" style="margin-bottom: 0;">
  317. <el-input v-model="row.nodeName" placeholder="请输入节点名称"/>
  318. </el-form-item>
  319. </el-form>
  320. </template>
  321. </el-table-column>
  322. <el-table-column prop="nodeName" label="划分编号" v-if="copyNodeTabKey === '2'">
  323. <template #default="{row}">
  324. <el-form ref="copyNodeTableRef" :model="row" :rules="copyNodeTableRules" label-width="0" size="large">
  325. <el-form-item prop="partitionCode" style="margin-bottom: 0;">
  326. <el-input v-model="row.partitionCode" placeholder="请输入划分编号"/>
  327. </el-form-item>
  328. </el-form>
  329. </template>
  330. </el-table-column>
  331. <el-table-column prop="action" label="操作" width="120" align="center">
  332. <template #default="{_,$index}">
  333. <el-button type="danger" plain @click="copyNodeTableDel($index)">删除</el-button>
  334. </template>
  335. </el-table-column>
  336. </el-table>
  337. </el-scrollbar>
  338. </div>
  339. </div>
  340. <template #footer>
  341. <div class="lr-dialog-footer">
  342. <div class="left">
  343. <template v-for="item in copyNodeTab">
  344. <el-button size="large" type="primary" plain v-if="item?.key === copyNodeTabKey" @click="copyNodeTabChange(item?.key)">{{item.name}}</el-button>
  345. <el-button size="large" text bg @click="copyNodeTabChange(item?.key)" v-else>{{item.name}}</el-button>
  346. </template>
  347. </div>
  348. <div class="right">
  349. <el-button size="large" @click="copyNodeModal = false">取消</el-button>
  350. <el-button type="primary" hc-btn :loading="copyNodeLoading" @click="copyNodeClick">提交</el-button>
  351. </div>
  352. </div>
  353. </template>
  354. </HcDialog>
  355. <!--新增子节点-->
  356. <HcDialog :show="addNodeModal" title="新增子节点" widths="720px" @close="addNodeModal = false">
  357. <el-alert title="双击节点,可编辑节点名称,编辑完成后,请按回车或输入框消失后,再点提交" type="warning" :closable="false"/>
  358. <HcTreeNode :projectId="projectId" :nodeId="addTreeNodeId" :oldId="addTreeNodeOldId" @check-change="addTreeNodeCheckChange" v-if="addTreeNodeType === '1'"/>
  359. <HcTreeNode :projectId="projectId" :nodeId="addTreeNodeId" :oldId="addTreeNodeOldId" strictly @check-change="addTreeNodeCheckChange" v-if="addTreeNodeType === '2'"/>
  360. <template #footer>
  361. <div class="lr-dialog-footer">
  362. <div class="left flex items-center">
  363. <div class="mr-4">选中方式:</div>
  364. <el-radio-group v-model="addTreeNodeType">
  365. <el-radio label="1">当前及子节点</el-radio>
  366. <el-radio label="2" class="ml-4">仅当前节点</el-radio>
  367. </el-radio-group>
  368. </div>
  369. <div class="right">
  370. <el-button size="large" @click="addNodeModal = false">取消</el-button>
  371. <el-button type="primary" hc-btn :loading="addNodeLoading" @click="addNodeClick">提交</el-button>
  372. </div>
  373. </div>
  374. </template>
  375. </HcDialog>
  376. <!--调整排序-->
  377. <HcDialog :show="sortNodeModal" title="调整排序" widths="700px" :loading="sortNodeLoading" @close="sortNodeModal = false" @save="sortNodeClick">
  378. <el-alert title="可拖动排序,也可在后面点击图标,切换排序" type="warning" :closable="false"/>
  379. <div class="sort-node-body-box list-group header">
  380. <div class="list-group-item">
  381. <div class="index-box">序号</div>
  382. <div class="title-box">节点名称</div>
  383. <div class="icon-box">排序</div>
  384. </div>
  385. </div>
  386. <Draggable class="sort-node-body-box list-group" ghost-class="ghost" :list="sortNodeData" item-key="id" @start="sortNodeDrag = true" @end="sortNodeDrag = false">
  387. <template #item="{element, index}">
  388. <div class="list-group-item">
  389. <div class="index-box">{{index + 1}}</div>
  390. <div class="title-box">{{element.title}}</div>
  391. <div class="icon-box">
  392. <span class="icon" @click="downSortClick(index)">
  393. <HcIcon name="arrow-down" ui="text-lg"/>
  394. </span>
  395. <span class="icon" @click="upSortClick(index)">
  396. <HcIcon name="arrow-up" ui="text-lg"/>
  397. </span>
  398. </div>
  399. </div>
  400. </template>
  401. </Draggable>
  402. </HcDialog>
  403. <!--批量上报审批-->
  404. <HcReportModal title="批量上报审批" url="informationWriteQuery/taskOne"
  405. :show="showReportModal"
  406. :projectId="projectId"
  407. :contractId="contractInfo?.contractType==2?nodeDataInfo?.contractIdRelation:contractId"
  408. type="wbs"
  409. :typeData="reportTypeData"
  410. :taskName="reportTaskName" :ids="reportIds" :addition="reportAddition" @hide="showReportModal = false" @finish="showReportFinish"/>
  411. </div>
  412. </template>
  413. <script setup>
  414. import { Warning ,DocumentCopy,CaretLeft,CaretRight } from '@element-plus/icons-vue'
  415. import {ref,watch,onMounted} from "vue";
  416. import {useRouter, useRoute} from 'vue-router'
  417. import {useAppStore} from "~src/store";
  418. import {HcIsButton} from "~src/plugins/IsButtons";
  419. import ListItem from "./components/ListItem.vue"
  420. import NodeTree from "./components/nodeTree/index.vue"
  421. import HcTreeNode from "./components/HcTreeNode.vue"
  422. import HcTreeData from "./components/HcTreeData.vue"
  423. import WbsTree from "./components/WbsTree.vue"
  424. import {getTokenHeader} from '~src/api/request/header';
  425. import {getStoreData, setStoreData} from '~src/utils/storage'
  426. import {isType, deepClone, formValidate} from "vue-utils-plus"
  427. import {getDictionary, eVisaTaskCheckApi} from "~api/other"
  428. import wbsApi from "~api/data-fill/wbs"
  429. import queryApi from '~api/data-fill/query';
  430. import Draggable from "vuedraggable";
  431. //初始变量
  432. const router = useRouter()
  433. const useRoutes = useRoute()
  434. const useAppState = useAppStore()
  435. const {getObjValue, getArrValue, getObjNullValue, isString} = isType()
  436. //全局变量
  437. const projectId = ref(useAppState.getProjectId);
  438. const contractId = ref(useAppState.getContractId);
  439. const projectInfo = ref(useAppState.getProjectInfo);
  440. const contractInfo = ref(useAppState.getContractInfo);
  441. const isCollapse = ref(useAppState.getCollapse)
  442. const userInfo = ref(useAppState.getUserInfo);
  443. //路由参数
  444. const routerQuery = useRoutes?.query;
  445. // const typeName = routerQuery?.type || 'map'
  446. const typeName = routerQuery?.type || 'tree'
  447. //是否是抽屉
  448. const isDrawType = ref(true)
  449. //自动展开缓存
  450. const TreeAutoExpandKeys = ref(getStoreData('wbsTreeExpandKeys') || [])
  451. //树搜索
  452. const isSearchTree = ref(false)
  453. const wbstreeKey=ref(Math.random())
  454. const getSearchTreeData=async()=>{
  455. const {error, code, data} = await queryApi.getTreeall({
  456. contractId: contractId.value,
  457. projectId: projectId.value,
  458. wbsId:projectInfo?.value.referenceWbsTemplateId
  459. })
  460. //判断状态
  461. if (!error && code === 200) {
  462. searchTreeData.value = getArrValue(data)
  463. treeLoading.value = false
  464. } else {
  465. treeLoading.value = false
  466. searchTreeData.value = []
  467. }
  468. }
  469. //监听
  470. watch(() => [
  471. useAppState.getCollapse,
  472. ], ([Collapse]) => {
  473. isCollapse.value = Collapse
  474. })
  475. watch(projectId, (val) => {
  476. console.log(val,'val')
  477. if(val){
  478. getSearchTreeData()
  479. }
  480. },
  481. {immediate:true}
  482. )
  483. //渲染完成
  484. onMounted(()=> {
  485. treeLoading.value = typeName === 'tree';
  486. setContractType(contractInfo.value?.contractType)
  487. getDictionaryApi()
  488. })
  489. //身份按钮切换数据
  490. const authBtnTabKey = ref('1')
  491. //变量
  492. const wbstree = ref(null)
  493. const authBtnTabClick = (val) => {
  494. if (!primaryKeyId.value) {
  495. window?.$message?.warning('请先在左侧项目树选择一个节点')
  496. } else if (val['key'] !== authBtnTabKey.value) {
  497. authBtnTabKey.value = val['key']
  498. // wbstreeKey.value=new Date().toString()
  499. getTableDataAll()
  500. }
  501. }
  502. //contractType, 1施工,2监理
  503. const setContractType = (contractType) => {
  504. if (contractType <= 0) {
  505. authBtnTabKey.value = '1'
  506. } else {
  507. authBtnTabKey.value = contractType + ''
  508. }
  509. setElTreeMenu(contractType)
  510. }
  511. const getTableDataAll = () => {
  512. searchNodeAllTable()
  513. queryNodeStatus()
  514. // wbstree.value.resetNode().then((res)=>{
  515. // if(res){
  516. // searchNodeAllTable()
  517. // queryNodeStatus()
  518. // }
  519. // })
  520. }
  521. //结构类型tab数据和相关处理
  522. const wbsTypeTabKey = ref(typeName)
  523. const wbsTypeTab = ref([
  524. {key:'map', name: '导图结构填报'},
  525. {key:'tree', name: '树形结构填报'}
  526. ]);
  527. const authBtnTabdata = ref([
  528. {key:'1', name: '施工质检'},
  529. {key:'2', name: '监理质检'}
  530. ]);
  531. const wbsTypeTabChange = (item) => {
  532. wbsTypeTabKey.value = item?.key;
  533. ListItemDatas.value = []
  534. isDrawer.value = false;
  535. treeLoading.value = typeName === 'tree';
  536. //路由跳转
  537. router.push({
  538. path: useRoutes.path,
  539. query: {
  540. type: item?.key
  541. }
  542. })
  543. getSearchTreeData()
  544. }
  545. //上传文件的
  546. const action = ref("/api/blade-resource/oss/endpoint/put-file")
  547. const accept = ref("image/png,image/jpg,image/jpeg")
  548. const NodeTreeAccordion = ref(true)
  549. //设置树菜单数据
  550. const ElTreeMenu = ref([])
  551. const TreeMark = ref(false)
  552. const setElTreeMenu = (contractType) => {
  553. let newArr = [];
  554. if (contractType === 1) {
  555. if (HcIsButton('wbs_tree_edit')) {
  556. newArr.push({icon: 'draft', label: '编辑节点', key: "edit"})
  557. }
  558. if (HcIsButton('wbs_tree_mark')) {
  559. newArr.push({icon: 'star', label: '标记为首件', key: "mark"})
  560. TreeMark.value = true
  561. }
  562. if (HcIsButton('wbs_tree_copy')) {
  563. newArr.push({icon: 'file-copy-2', label: '复制节点', key: "copy"})
  564. }
  565. if (HcIsButton('wbs_tree_add')) {
  566. newArr.push({icon: 'add-circle', label: '新增节点', key: "add"})
  567. }
  568. if (HcIsButton('wbs_tree_upload')) {
  569. newArr.push({icon: 'file-upload', label: '上传图纸', key: "upload"})
  570. }
  571. if (HcIsButton('wbs_tree_del')) {
  572. newArr.push({icon: 'delete-bin', label: '删除节点', key: "del"})
  573. }
  574. if (HcIsButton('wbs_tree_sort')) {
  575. newArr.push({icon: 'sort-asc', label: '调整排序', key: "sort"})
  576. }
  577. if (HcIsButton('wbs_views_division_btn')) {
  578. newArr.push({icon:'folder-shared', label: '工程划分', key: "nodetree"})
  579. }
  580. } else if (contractType === 2) {
  581. if (HcIsButton('wbs_tree_copy')) {
  582. newArr.push({icon: 'file-copy-2', label: '复制节点', key: "copy"})
  583. }
  584. if (HcIsButton('wbs_tree_add')) {
  585. newArr.push({icon: 'add-circle', label: '新增节点', key: "add"})
  586. }
  587. }
  588. ElTreeMenu.value = newArr
  589. }
  590. //树相关变量
  591. const primaryKeyId = ref('')
  592. const nodeItemInfo = ref({})
  593. const nodeDataInfo = ref({})
  594. const searchTreeVal = ref('')
  595. const searchTreeData = ref([])
  596. //回车
  597. const searchTreeKeyUp = (e) => {
  598. if (e.key === "Enter") {
  599. searchTreeClick()
  600. }
  601. }
  602. const changeisSearch=()=>{
  603. isSearchTree.value=false
  604. }
  605. const treeLoading = ref(false)
  606. const searchTreeClick = async () => {
  607. isSearchTree.value=true
  608. }
  609. // if (searchTreeVal.value) {
  610. // isSearchTree.value = true
  611. // treeLoading.value = true
  612. // const {error, code, data} = await wbsApi.searchContractTree({
  613. // contractId: contractId.value,
  614. // queryValue: searchTreeVal.value
  615. // })
  616. // //判断状态
  617. // if (!error && code === 200) {
  618. // searchTreeData.value = getArrValue(data)
  619. // treeLoading.value = false
  620. // } else {
  621. // treeLoading.value = false
  622. // searchTreeData.value = []
  623. // }
  624. // } else {
  625. // treeLoading.value = false
  626. // isSearchTree.value = false
  627. // }
  628. //树被点击
  629. const wbsElTreeClick = ({node, data, keys}) => {
  630. nodeItemInfo.value = node
  631. nodeDataInfo.value = data
  632. primaryKeyId.value = data?.primaryKeyId || ''
  633. setStoreData('wbsTreeExpandKeys',keys)
  634. TreeAutoExpandKeys.value = keys || []
  635. getTableDataAll()
  636. }
  637. //树加载完成
  638. const ElTreeNodeLoading = () => {
  639. treeLoading.value = false
  640. }
  641. //树菜单被点击
  642. const ElTreeMenuClick = async ({key,node,data,keys}) => {
  643. nodeItemInfo.value = node
  644. nodeDataInfo.value = data
  645. setStoreData('wbsTreeExpandKeys',keys)
  646. setTreeMenuDataClick({key,node,data})
  647. }
  648. //导图结构数据
  649. const NodeTreeRef = ref(null)
  650. //鼠标左键单击事件
  651. const NodeTreeClick = ({keys}) => {
  652. setStoreData('wbsTreeExpandKeys',keys)
  653. TreeAutoExpandKeys.value = keys || []
  654. }
  655. //双击事件
  656. const isDrawer = ref(false)
  657. const NodeTreeDblClick = ({node,data}) => {
  658. nodeItemInfo.value = node
  659. nodeDataInfo.value = data
  660. primaryKeyId.value = data?.primaryKeyId || ''
  661. isDrawer.value = true;
  662. getTableDataAll()
  663. }
  664. const drawerClose = () => {
  665. isDrawer.value = false;
  666. ListItemDatas.value = []
  667. }
  668. //导图树菜单被点击
  669. const NodeTreeMenuClick = async ({key,node,data}) => {
  670. nodeItemInfo.value = node
  671. nodeDataInfo.value = data
  672. setTreeMenuDataClick({key,node,data})
  673. }
  674. //处理菜单被点击数据
  675. const setTreeMenuDataClick = ({key,node,data}) => {
  676. const tabKey = wbsTypeTabKey.value
  677. if (key === 'mark' || key === 'cancel_mark') {
  678. firstItemBox()
  679. } else if (key === 'edit') {
  680. if (tabKey === 'tree') {
  681. const parent = deepClone(node?.parent?.data || {})
  682. formEditNodeModel.value = {...deepClone(data), parent: parent}
  683. } else if (tabKey === 'map') {
  684. const parent = deepClone(node?.parentNodes?.data || {})
  685. formEditNodeModel.value = {...deepClone(data), parent: parent}
  686. }
  687. editNodeModal.value = true
  688. } else if (key === 'copy') {
  689. if (tabKey === 'tree') {
  690. const parent = deepClone(node?.parent?.data || {})
  691. formCopyNodeModel.value = {...deepClone(data), parent: parent}
  692. } else if (tabKey === 'map') {
  693. const parent = deepClone(node?.parentNodes?.data || {})
  694. formCopyNodeModel.value = {...deepClone(data), parent: parent}
  695. }
  696. copyNodeTabKey.value = '1'
  697. copyNodeTable.value = []
  698. copyNodeLoading.value = false
  699. copyNodeModal.value = true
  700. } else if (key === 'add') {
  701. addTreeNodeId.value = data?.id
  702. addTreeNodeOldId.value = data?.oldId
  703. addNodeLoading.value = false
  704. addNodeModal.value = true
  705. } else if (key === 'upload') {
  706. document.getElementById('upload-drawing').click()
  707. } else if (key === 'del') {
  708. if(data['colorStatus']===1||data['colorStatus']===2){
  709. delModalClick()
  710. }else{
  711. window?.$message?.warning('该节点已存在上报数据,不允许删除')
  712. }
  713. } else if (key === 'sort') {
  714. let nodes = [], childNodes = []
  715. if (tabKey === 'tree') {
  716. childNodes = node?.parent?.childNodes || []
  717. } else if (tabKey === 'map') {
  718. childNodes = node?.parentNodes?.childrenNodes || []
  719. }
  720. for (let i = 0; i < childNodes.length; i++) {
  721. const res = childNodes[i]?.data
  722. nodes.push({
  723. id: res?.primaryKeyId,
  724. title: res?.title
  725. })
  726. }
  727. sortNodeData.value = nodes
  728. sortNodeModal.value = true
  729. }else if (key === 'nodetree') {
  730. divisionClick()
  731. }
  732. }
  733. //复制节点位置
  734. const copyText=()=> {
  735. let copyCon = document.getElementById("copyText");
  736. copyCon.select(); // 选中文本
  737. document.execCommand("copy"); // 执行浏览器复制命令
  738. window.$message?.success("复制成功!");
  739. }
  740. //上传前
  741. const loadingReactive = ref(null)
  742. const beforeUpload = () => {
  743. loadingReactive.value = window.$loading?.service({
  744. lock: true,
  745. text: '图纸上传中...',
  746. background: 'rgba(0, 0, 0, 0.7)',
  747. })
  748. return true
  749. }
  750. //上传完成
  751. const uploadFinish = async (response) => {
  752. const res = getObjValue(response.data)
  753. const info = nodeDataInfo.value;
  754. if (res?.link) {
  755. const { error, code, data } = await wbsApi.saveContractTreeDrawings({
  756. fileUrl: res?.link,
  757. id: info['drawingsId'],
  758. primaryKeyId: info['primaryKeyId']
  759. },false)
  760. //处理数据
  761. loadingReactive.value.close();
  762. if (!error && code === 200) {
  763. nodeDataInfo.value['drawingsId'] = data
  764. nodeDataInfo.value['fileUrl'] = res?.link
  765. window?.$message?.success('图纸上传成功')
  766. } else {
  767. window?.$message?.error('图纸保存失败')
  768. }
  769. } else {
  770. loadingReactive.value.close();
  771. window?.$message?.error('图纸上传失败')
  772. }
  773. }
  774. //上传失败
  775. const uploadError = () => {
  776. loadingReactive.value.close();
  777. window?.$message?.error('图纸上传失败')
  778. }
  779. //确认标记为首件
  780. const firstItemBox = () => {
  781. const info = nodeDataInfo.value;
  782. window?.$messageBox?.alert(`<div class="text-base font-bold">
  783. <span>请确认将</span>
  784. <span class="text-main">【${info['title']}】</span>
  785. <span>${info['isFirst']?'取消':''}标记为首件</span>
  786. </div>`, '标记首件制', {
  787. showCancelButton: true,
  788. dangerouslyUseHTMLString: true,
  789. callback: (action) => {
  790. if (action === 'confirm') {
  791. firstItemHttp(info)
  792. }
  793. }
  794. })
  795. }
  796. //首件请求
  797. const firstItemHttp = async (info) => {
  798. const { error, code } = await wbsApi.wbsTreeFirstSave({
  799. primaryKeyId: info['primaryKeyId'],
  800. saveOrDeleted: !!info['isFirst']?1:0,
  801. })
  802. //处理数据
  803. if (!error && code === 200) {
  804. window?.$message?.success('操作成功')
  805. window?.location?.reload() //刷新页面
  806. }
  807. }
  808. //编辑节点
  809. const editNodeModal = ref(false)
  810. //获取节点类型
  811. const nodeTypeData = ref([])
  812. const getDictionaryApi = async () => {
  813. const { data } = await getDictionary({
  814. code: 'wbs_node_type'
  815. })
  816. //处理数据
  817. let newArr = []
  818. const newData = getArrValue(data)
  819. for (let i = 0; i < newData.length; i++) {
  820. newArr.push({
  821. label: newData[i]['dictValue'],
  822. value: Number(newData[i]['dictKey']),
  823. })
  824. }
  825. nodeTypeData.value = newArr
  826. }
  827. const formEditNodeRef = ref(null)
  828. const formEditNodeModel = ref({})
  829. const formEditNodeRules = {
  830. title: {
  831. required: true,
  832. trigger: 'blur',
  833. message: "请输入节点名称"
  834. },
  835. }
  836. const editNodeLoading = ref(false)
  837. //保存编辑节点数据
  838. const editNodeClick = async () => {
  839. const validate = await formValidate(formEditNodeRef.value)
  840. if (validate) {
  841. //发起请求
  842. editNodeLoading.value = true
  843. const { primaryKeyId, title, partitionCode } = formEditNodeModel.value
  844. const { error, code } = await wbsApi.wbsTreeUpdateNode({
  845. nodeName: title || '',
  846. pKeyId: primaryKeyId || '',
  847. partitionCode: partitionCode || ''
  848. })
  849. //处理数据
  850. editNodeLoading.value = false
  851. if (!error && code === 200) {
  852. window?.$message?.success('修改成功')
  853. nodeDataInfo.value['title'] = title || ''
  854. nodeDataInfo.value['partitionCode'] = partitionCode || ''
  855. editNodeModal.value = false
  856. window?.location?.reload() //刷新页面
  857. }
  858. }
  859. }
  860. //复制节点
  861. const copyNodeModal = ref(false)
  862. //复制节点类型tab数据和相关处理
  863. const copyNodeTabKey = ref('1')
  864. const copyNodeTab = ref([
  865. {key:'1', name: '单份复制'},
  866. {key:'2', name: '多份复制'},
  867. {key:'3', name: '复制数据'}
  868. ]);
  869. const copyNodeTabChange = (key) => {
  870. if (key !== copyNodeTabKey.value) {
  871. copyNodeTabKey.value = key;
  872. copyNodeTable.value = []
  873. copyNodeLoading.value = false
  874. }
  875. }
  876. //复制节点变量
  877. const copyNodeLoading = ref(false)
  878. const formCopyNodeModel = ref({})
  879. const classifyList=ref([])
  880. const copyNodeTable = ref([])
  881. //复制树被点击
  882. const copyNodeElTreeClick = ({data}) => {
  883. const TabKey = copyNodeTabKey.value;
  884. const {title, type,partitionCode} = formCopyNodeModel.value;
  885. if (TabKey === '2') {
  886. //1 单位工程,2 分部工程,3 子分部工程,4 分项工程, 5 子分项工程,6 工序
  887. //工序节点不能复制到工序节点下面
  888. // if (type === 6 && (data['type'] === 4 || data['type'] === 5 || data['type'] == 6)) {
  889. // setCopyNodeTable(data, title)
  890. // }
  891. if (type === 6 && (data['type'] === 4 || data['type'] === 5 || data['type'] !== 6)) {
  892. setCopyNodeTable(data, title,partitionCode)
  893. }
  894. if (type === 5 && data['type'] === 4) {
  895. setCopyNodeTable(data, title,partitionCode)
  896. }
  897. if (type === 4 && (data['type'] === 2 || data['type'] === 3)) {
  898. setCopyNodeTable(data, title,partitionCode)
  899. }
  900. if (type === 3 && data['type'] === 2) {
  901. setCopyNodeTable(data, title,partitionCode)
  902. }
  903. if (type === 2 && data['type'] === 1) {
  904. setCopyNodeTable(data, title,partitionCode)
  905. }
  906. if (type === 1 && data['type'] === 1) {
  907. setCopyNodeTable(data, title,partitionCode)
  908. }
  909. } else if (TabKey === '3') {
  910. //限制复制数据不能复制到本身节点下
  911. if(data['id']!==formCopyNodeModel.value.id){
  912. // console.log(formCopyNodeModel.value,'formCopyNodeModel.value');
  913. // console.log(data,'data');
  914. // if(data['colorStatus']===1||data['colorStatus']===2){
  915. // // delModalClick()
  916. // }else{
  917. // window?.$message?.warning('该节点已存在上报数据,不允许复制')
  918. // }
  919. if (data['notExsitChild']) {
  920. if(data['nodeType']===6){
  921. let oldarr= copyNodeTable.value
  922. let result = oldarr.some(item => item.primaryKeyId===data['primaryKeyId']) //true
  923. //限制点工序节点的时候,只能加一个,只针对复制数据
  924. if(!result){
  925. setCopyNodeTable(data, data?.title)
  926. }
  927. }else{
  928. setCopyNodeTable(data, data?.title)
  929. }
  930. }
  931. }
  932. }
  933. }
  934. const setCopyNodeTable = (data, title) => {
  935. copyNodeTable.value.push({
  936. title: data?.title || '',
  937. nodeName: title || '',
  938. primaryKeyId: data?.primaryKeyId || '',
  939. })
  940. }
  941. //节点表单
  942. const formCopyNodeModelRef = ref(null)
  943. const formCopyNodeModelRules = {
  944. title: {
  945. required: true,
  946. trigger: "blur",
  947. message: "请输入节点名称"
  948. }
  949. }
  950. //表格节点表单
  951. const copyNodeTableRef = ref(null)
  952. const copyNodeTableRules = {
  953. nodeName: {
  954. required: true,
  955. trigger: "blur",
  956. message: "请输入节点名称"
  957. }
  958. }
  959. //删除选中的节点
  960. const copyNodeTableDel = (index) => {
  961. copyNodeTable.value.splice(index,1)
  962. }
  963. //复制节点
  964. const copyNodeClick = async () => {
  965. const type = copyNodeTabKey.value
  966. const form = formCopyNodeModel.value
  967. const table = copyNodeTable.value
  968. let classify=''
  969. let arr=[]
  970. if(classifyList.value.length>0){
  971. classifyList.value.forEach((item)=>{
  972. if(item==='施工'){
  973. arr.push(1)
  974. }else if(item==='监理'){
  975. arr.push(2)
  976. }
  977. })
  978. classify=arr.join(',')
  979. }
  980. //效验数据
  981. if (type === '1') {
  982. const validate = await formValidate(formCopyNodeModelRef.value)
  983. if (validate) await copyContractTreeNode(type, form,[])
  984. } else if (type === '2') {
  985. if (table.length > 0) {
  986. const validate = await formValidate(copyNodeTableRef.value)
  987. if (validate) await copyContractTreeNode(type, form,table)
  988. } else {
  989. window?.$message?.warning('请先在左侧选择要复制到的节点')
  990. }
  991. } else if (type === '3') {
  992. if (table.length > 0&&classify.length>0) {
  993. await copyContractNodeSubmitBusinessData(form,table,classify)
  994. } else {
  995. window?.$message?.warning('请先在左侧选择要复制的节点或选择所属方')
  996. }
  997. }
  998. }
  999. //单个复制、多份复制请求
  1000. const copyContractTreeNode = async (type, form,table) => {
  1001. copyNodeLoading.value = true
  1002. if(type=='1'){
  1003. const {error, code} = await wbsApi.copyContractTreeNode({
  1004. copyType: type,
  1005. needCopyNodeName: form?.title || '',
  1006. partitionCode:form?.partitionCode || '',
  1007. needCopyPrimaryKeyId: form?.primaryKeyId || '',
  1008. parentPrimaryKeyId: form?.parent?.primaryKeyId || '',
  1009. copyBatchToPaths: table
  1010. })
  1011. //判断状态
  1012. if (!error && code === 200) {
  1013. window?.$message?.success('复制成功')
  1014. copyNodeLoading.value = false
  1015. copyNodeModal.value = false
  1016. window?.location?.reload() //刷新页面
  1017. }
  1018. }else{
  1019. const {error, code} = await wbsApi.copyContractTreeNode({
  1020. copyType: type,
  1021. needCopyNodeName: form?.title || '',
  1022. needCopyPrimaryKeyId: form?.primaryKeyId || '',
  1023. parentPrimaryKeyId: form?.parent?.primaryKeyId || '',
  1024. copyBatchToPaths: table
  1025. })
  1026. //判断状态
  1027. if (!error && code === 200) {
  1028. window?.$message?.success('复制成功')
  1029. copyNodeLoading.value = false
  1030. copyNodeModal.value = false
  1031. window?.location?.reload() //刷新页面
  1032. }
  1033. }
  1034. }
  1035. //复制数据
  1036. const copyContractNodeSubmitBusinessData = async (form,table,classify) => {
  1037. copyNodeLoading.value = true
  1038. const {error, code} = await wbsApi.copyContractNodeSubmitBusinessData({
  1039. needCopyPrimaryKeyId: form?.primaryKeyId || '',
  1040. copyBatchToPaths: table,
  1041. classify:classify
  1042. })
  1043. //判断状态
  1044. if (!error && code === 200) {
  1045. window?.$message?.success('复制成功')
  1046. copyNodeLoading.value = false
  1047. copyNodeModal.value = false
  1048. window?.location?.reload() //刷新页面
  1049. }else{
  1050. copyNodeLoading.value = false
  1051. // copyNodeModal.value = false
  1052. }
  1053. }
  1054. //新增节点
  1055. const addNodeModal = ref(false)
  1056. const addTreeNodeId = ref('')
  1057. const addTreeNodeOldId = ref('')
  1058. const addTreeNodeType = ref('1')
  1059. //选中的节点
  1060. const allSelectedList = ref([])
  1061. const halfSelectedList = ref([])
  1062. const addTreeNodeCheckChange = (nodes) => {
  1063. let NodesArr = [], halfArr = []
  1064. //全选数据
  1065. const keys = nodes.checkedNodes || []
  1066. for (let i = 0; i < keys.length; i++) {
  1067. NodesArr.push({
  1068. nodeName: keys[i].title,
  1069. primaryKeyId: keys[i].primaryKeyId
  1070. })
  1071. }
  1072. allSelectedList.value = NodesArr
  1073. //半选数据
  1074. const halfNodes = nodes.halfCheckedNodes || []
  1075. for (let i = 0; i < halfNodes.length; i++) {
  1076. halfArr.push({
  1077. nodeName: halfNodes[i].title,
  1078. primaryKeyId: halfNodes[i].primaryKeyId
  1079. })
  1080. }
  1081. halfSelectedList.value = halfArr
  1082. }
  1083. //新增节点
  1084. const addNodeLoading = ref(false)
  1085. const addNodeClick = async () => {
  1086. const keys = allSelectedList.value || []
  1087. if (keys.length <= 0) {
  1088. window?.$message?.warning('请先选择节点')
  1089. } else {
  1090. //发起请求
  1091. addNodeLoading.value = true
  1092. const primaryKeyId = nodeDataInfo.value?.primaryKeyId || ''
  1093. const {error, code} = await wbsApi.saveContractTreeNode({
  1094. projectId: projectId.value,
  1095. contractId: contractId.value,
  1096. saveType: addTreeNodeType.value,
  1097. allSelectedList: allSelectedList.value,
  1098. halfSelectedList: halfSelectedList.value,
  1099. currentNodePrimaryKeyId: primaryKeyId
  1100. })
  1101. //判断状态
  1102. addNodeLoading.value = false
  1103. if (!error && code === 200) {
  1104. window?.$message?.success('新增成功')
  1105. addNodeModal.value = false
  1106. window?.location?.reload() //刷新页面
  1107. }
  1108. }
  1109. }
  1110. //删除节点
  1111. const delModalClick = () => {
  1112. window?.$messageBox?.alert('请谨慎考虑后,确认是否需要删除?', '删除节点', {
  1113. showCancelButton: true,
  1114. confirmButtonText: '确认删除',
  1115. cancelButtonText: '取消',
  1116. callback: (action) => {
  1117. if (action === 'confirm') {
  1118. removeContractTreeNode()
  1119. }
  1120. }
  1121. })
  1122. }
  1123. const removeContractTreeNode = async () => {
  1124. const {error, code} = await wbsApi.removeContractTreeNode({
  1125. ids: nodeDataInfo.value?.primaryKeyId || ''
  1126. })
  1127. if (!error && code === 200) {
  1128. window?.$message?.success('删除成功')
  1129. window?.location?.reload() //刷新页面
  1130. }
  1131. }
  1132. //调整排序
  1133. const sortNodeModal = ref(false)
  1134. const sortNodeLoading = ref(false)
  1135. const sortNodeData = ref([])
  1136. const sortNodeDrag = ref(false)
  1137. //向下
  1138. const downSortClick = (index) => {
  1139. const indexs = index + 1
  1140. const data = sortNodeData.value || []
  1141. if(indexs !== data.length) {
  1142. const tmp = data.splice(indexs,1);
  1143. sortNodeData.value.splice(index,0,tmp[0]);
  1144. } else {
  1145. window?.$message?.warning('已经处于置底,无法下移')
  1146. }
  1147. }
  1148. //向上
  1149. const upSortClick = (index) => {
  1150. const data = sortNodeData.value || []
  1151. if(index !== 0) {
  1152. const tmp = data.splice(index - 1,1);
  1153. sortNodeData.value.splice(index,0,tmp[0]);
  1154. } else {
  1155. window?.$message?.warning('已经处于置顶,无法上移')
  1156. }
  1157. }
  1158. //确认排序
  1159. const sortNodeClick = async () => {
  1160. const sortList = [];
  1161. const nodes = sortNodeData.value || []
  1162. nodes.forEach(item => {
  1163. sortList.push(item?.id)
  1164. })
  1165. //发起请求
  1166. sortNodeLoading.value = true
  1167. const { error, code } = await wbsApi.diySortTreeNode({sortList})
  1168. sortNodeLoading.value = false
  1169. //判断状态
  1170. if (!error && code === 200) {
  1171. window?.$message?.success('保存成功')
  1172. sortNodeModal.value = false
  1173. window?.location?.reload() //刷新页面
  1174. }
  1175. }
  1176. //查看图纸
  1177. const drawingsShow = ref(false);
  1178. const viewsDrawings = () => {
  1179. const {primaryKeyId, fileUrl} = nodeDataInfo.value
  1180. if (!primaryKeyId) {
  1181. window?.$message?.warning('请先选择树节点')
  1182. } else if (!fileUrl) {
  1183. window?.$message?.warning('该节点暂未上传图纸')
  1184. } else {
  1185. drawingsShow.value = true
  1186. }
  1187. }
  1188. const drawingsClose = (res) => {
  1189. drawingsShow.value = res
  1190. }
  1191. //设置滚动条位置
  1192. const ListItemScrollRef = ref(null)
  1193. const ListItemOffsetTop = (offsetTop) => {
  1194. if (offsetTop > 0) {
  1195. setTimeout(() => {
  1196. ListItemScrollRef.value?.setScrollTop(offsetTop)
  1197. }, 350)
  1198. } else {
  1199. ListItemScrollRef.value?.setScrollTop(offsetTop)
  1200. }
  1201. }
  1202. //获取数据列表
  1203. const ListItemDatas = ref([]);
  1204. const ListItemLoading = ref(false);
  1205. const searchNodeAllTable = async () => {
  1206. ListItemDatas.value = []
  1207. const info = nodeDataInfo.value;
  1208. ListItemLoading.value = true
  1209. const {error, code, data} = await wbsApi.searchNodeAllTable({
  1210. projectId: projectId.value,
  1211. contractId: contractId.value,
  1212. primaryKeyId: info['primaryKeyId'],
  1213. type: authBtnTabKey.value
  1214. })
  1215. //处理数据
  1216. ListItemLoading.value = false
  1217. if (!error && code === 200) {
  1218. ListItemDatas.value = getArrValue(data)
  1219. } else {
  1220. ListItemDatas.value = []
  1221. }
  1222. }
  1223. //查询状态
  1224. const NodeStatus = ref('1')
  1225. const queryNodeStatus = async () => {
  1226. const info = nodeDataInfo.value;
  1227. console.log(info,'info')
  1228. if (contractInfo.value?.contractType==1) {
  1229. const {error, code, data} = await wbsApi.queryNodeStatus({
  1230. primaryKeyId:info['primaryKeyId'],
  1231. //classify:1
  1232. classify: authBtnTabKey.value
  1233. })
  1234. //1 未填报,2待上报,3已上报
  1235. if (!error && code === 200) {
  1236. NodeStatus.value = data ?? '1'
  1237. } else {
  1238. NodeStatus.value = '1'
  1239. }
  1240. }else{
  1241. const {error, code, data} = await wbsApi.queryNodeStatusJl({
  1242. // primaryKeyId: info['contractIdRelation'] ? info['id'] : info['primaryKeyId'],
  1243. primaryKeyId: info['primaryKeyId'],
  1244. //classify: 1
  1245. classify: authBtnTabKey.value
  1246. })
  1247. //1 未填报,2待上报,3已上报
  1248. if (!error && code === 200) {
  1249. NodeStatus.value = data ?? '1'
  1250. } else {
  1251. NodeStatus.value = '1'
  1252. }
  1253. }
  1254. }
  1255. //批量上报
  1256. const reportIds = ref('')
  1257. const reportTaskName = ref('')
  1258. const reportAddition = ref({})
  1259. const showReportModal = ref(false)
  1260. const reportLoading = ref(false)
  1261. const reportTypeData = ref([])
  1262. const reportModalClick = async () => {
  1263. const info = nodeDataInfo.value;
  1264. const rows = ListItemDatas.value;
  1265. if (rows.length > 0) {
  1266. reportLoading.value = true
  1267. const taskCheck = await eVisaTaskCheckApi({
  1268. projectId: projectId.value,
  1269. contractId:contractInfo.value?.contractType==2?info?.contractIdRelation:contractId.value
  1270. // contractId: contractId.value
  1271. })
  1272. //处理数据
  1273. let newArr = [];
  1274. for (let i = 0; i < rows.length; i++) {
  1275. newArr.push(rows[i]['isTypePrivatePid'])
  1276. }
  1277. reportTypeData.value = newArr
  1278. reportLoading.value = false
  1279. if (taskCheck) {
  1280. //初始弹出弹窗,防呆
  1281. reportIds.value = info['primaryKeyId']
  1282. reportAddition.value = {
  1283. classify: authBtnTabKey.value,
  1284. contractIdRelation: info['contractIdRelation'],
  1285. }
  1286. showReportModal.value = true
  1287. //请求文件题名
  1288. const {data} = await wbsApi.queryDocumentTitle({
  1289. primaryKeyId: info['primaryKeyId'],
  1290. classify: authBtnTabKey.value
  1291. })
  1292. reportTaskName.value = isString(data)? data : ''
  1293. }
  1294. } else {
  1295. window.$message?.warning('暂无相关数据')
  1296. }
  1297. }
  1298. //上报完成
  1299. const showReportFinish = () => {
  1300. showReportModal.value = false
  1301. getTableDataAll()
  1302. // window?.location?.reload() //刷新页面
  1303. }
  1304. //表单变量
  1305. const ListItemRef = ref(null)
  1306. const ListItemsRef = ref(null)
  1307. //保存
  1308. const tableFormSaveLoading = ref(false)
  1309. const tableFormSaveClick = async () => {
  1310. //获取数据
  1311. let FormData = [], FormRegExpJson = {};
  1312. if (isDrawer.value) {
  1313. FormData = ListItemsRef.value?.getFormData()
  1314. FormRegExpJson = ListItemsRef.value?.getFormRegExpJson()
  1315. } else {
  1316. FormData = ListItemRef.value?.getFormData()
  1317. FormRegExpJson = ListItemRef.value?.getFormRegExpJson()
  1318. }
  1319. //效验数据
  1320. if (getObjNullValue(FormRegExpJson)) {
  1321. setFormRegExpJson(FormRegExpJson)
  1322. } else if (FormData.length > 0) {
  1323. tableFormSaveLoading.value = true
  1324. console.log(FormData,'FormData')
  1325. const {error, code} = await wbsApi.saveExcelBussData({
  1326. dataInfo: {orderList: FormData}
  1327. })
  1328. tableFormSaveLoading.value = false
  1329. if (!error && code === 200) {
  1330. window?.$message?.success('保存成功')
  1331. bussPdfsClick()
  1332. getTableDataAll()
  1333. }
  1334. } else {
  1335. //http://testcandao.hcxxy.com/bug-view-819.html
  1336. bussPdfsClick()
  1337. }
  1338. }
  1339. //效验数据
  1340. const setFormRegExpJson = (FormRegExpJson) => {
  1341. let nodeName = '', itemId = '';
  1342. Object.keys(FormRegExpJson).forEach(key => {
  1343. const name = FormRegExpJson[key]?.nodeName ?? ''
  1344. if (name) {
  1345. if (nodeName) {
  1346. nodeName += ',' + name
  1347. } else {
  1348. nodeName = name
  1349. itemId = FormRegExpJson[key]?.itemId
  1350. }
  1351. }
  1352. })
  1353. //const activeKey = ListItemRef.value?.getActiveKey()
  1354. //弹出提示
  1355. const val = '<div style="font-size: 16px;">请先完善 <span style="color:#1ECC95;">' + nodeName + '</span> 的数据内容</div>'
  1356. window?.$messageBox?.alert(val, '表单完善提醒', {
  1357. confirmButtonText: '确定',
  1358. dangerouslyUseHTMLString: true,
  1359. callback: (action) => {
  1360. if (action === 'confirm') {
  1361. ListItemRef.value?.setActiveKey(itemId)
  1362. ListItemOffsetTop(0)
  1363. setTimeout(() => {
  1364. const offsetTop = document.getElementById(itemId)?.offsetTop
  1365. ListItemOffsetTop(offsetTop)
  1366. }, 350)
  1367. }
  1368. }
  1369. })
  1370. }
  1371. //多表预览
  1372. const bussPdfsLoading = ref(false)
  1373. const bussPdfsClick = async () => {
  1374. const info = nodeDataInfo.value;
  1375. console.log(info,'info')
  1376. bussPdfsLoading.value = true
  1377. const {error, code, data} = await wbsApi.getBussPdfs({
  1378. nodeId: info?.primaryKeyId || '',
  1379. classify: authBtnTabKey.value,
  1380. projectId: projectId.value,
  1381. // contractId: contractId.value
  1382. contractId:contractInfo.value?.contractType==2?info?.contractIdRelation:contractId.value
  1383. })
  1384. tableFormSaveLoading.value = false
  1385. bussPdfsLoading.value = false
  1386. if (!error && code === 200) {
  1387. window.open(data,'_blank')
  1388. } else {
  1389. window.$message?.warning('获取PDF失败')
  1390. }
  1391. }
  1392. //撤回上报流程
  1393. const abolishOneClick = () => {
  1394. window?.$messageBox?.alert('请谨慎考虑后,是否确定撤回?', '撤回上报', {
  1395. showCancelButton: true,
  1396. confirmButtonText: '确定撤回',
  1397. cancelButtonText: '取消',
  1398. callback: (action) => {
  1399. if (action === 'confirm') {
  1400. abolishOneSave()
  1401. }
  1402. }
  1403. })
  1404. }
  1405. //撤回请求
  1406. const abolishOneSave = async () => {
  1407. const info = nodeDataInfo.value;
  1408. const {error, code} = await wbsApi.abolishOne({
  1409. primaryKeyId: info?.primaryKeyId || '',
  1410. classify: authBtnTabKey.value
  1411. })
  1412. if (!error && code === 200) {
  1413. window.$message?.success('撤回成功')
  1414. getTableDataAll()
  1415. window?.location?.reload() //刷新页面
  1416. }
  1417. }
  1418. //划分变更
  1419. const divisionClick = () => {
  1420. router.push({
  1421. path: '/data-fill/division'
  1422. })
  1423. }
  1424. const isShowLefticon=ref(true)
  1425. //
  1426. const isShowleftbox = () => {
  1427. let item = document.getElementById("wbs-left-tree");
  1428. item.style.display="block"
  1429. isShowLefticon.value=true
  1430. }
  1431. const isHiddenleftbox = () => {
  1432. let item = document.getElementById("wbs-left-tree");
  1433. item.style.display="none"
  1434. isShowLefticon.value=false
  1435. }
  1436. //左右拖动,改变树形结构宽度
  1437. const leftWidth = ref(382);
  1438. const onmousedown = () => {
  1439. const leftNum = isCollapse.value ? 142 : 272
  1440. document.onmousemove = (ve) => {
  1441. let diffVal = ve.clientX - leftNum;
  1442. if(diffVal >= 310 && diffVal <= 900) {
  1443. leftWidth.value = diffVal;
  1444. }
  1445. }
  1446. document.onmouseup = () => {
  1447. document.onmousemove = null;
  1448. document.onmouseup = null;
  1449. }
  1450. }
  1451. </script>
  1452. <style lang="scss" scoped>
  1453. @import "../../styles/data-fill/wbs.scss";
  1454. .hc-add-node-modal-foot-box {
  1455. position: relative;
  1456. display: flex;
  1457. align-items: center;
  1458. .left-box {
  1459. position: relative;
  1460. flex: 1;
  1461. display: flex;
  1462. align-items: center;
  1463. }
  1464. .right-box {
  1465. position: relative;
  1466. }
  1467. }
  1468. html.theme-dark {
  1469. .bg-svg-xml {
  1470. background-color: initial;
  1471. background-image: initial;
  1472. }
  1473. .hc-layout-box .hc-layout-content-box .hc-card-max-h-box.node-tree .hc-tree-foot-tip-box {
  1474. border-top: 1px solid #303030;
  1475. }
  1476. }
  1477. </style>
  1478. <style lang="scss">
  1479. .data-fill-wbs-content {
  1480. position: relative;
  1481. height: 100%;
  1482. .n-drawer-container {
  1483. margin: -20px -24px;
  1484. }
  1485. .n-drawer.n-drawer--top-placement {
  1486. height: auto !important;
  1487. background-color: initial;
  1488. pointer-events: none;
  1489. bottom: 0;
  1490. }
  1491. .drawer-data-fill-content-box {
  1492. position: relative;
  1493. height: 100%;
  1494. padding: 24px;
  1495. .n-card {
  1496. pointer-events: auto;
  1497. height: 100%;
  1498. overflow: auto;
  1499. }
  1500. .data-fill-content {
  1501. position: relative;
  1502. height: 100%;
  1503. overflow-y: auto;
  1504. scroll-behavior: smooth;
  1505. .data-fill-list-box .data-fill-list-item-content {
  1506. height: calc(100vh - 470px);
  1507. .data-fill-table-form-box {
  1508. height: 100%;
  1509. }
  1510. }
  1511. }
  1512. .data-fill-foot {
  1513. position: relative;
  1514. text-align: center;
  1515. }
  1516. }
  1517. }
  1518. .n-card.hc-card-overflow-box .n-card__content {
  1519. padding: 24px;
  1520. }
  1521. .n-card.hc-custom-card > .n-card-header {
  1522. padding: 15px 24px;
  1523. }
  1524. .n-card.hc-custom-card.copy {
  1525. width: 1200px;
  1526. max-height: 90vh;
  1527. overflow: auto;
  1528. .n-card-header .n-card-header__close {
  1529. display: none;
  1530. }
  1531. &.one {
  1532. width: 600px;
  1533. }
  1534. &.many {
  1535. width: 1200px;
  1536. }
  1537. }
  1538. .img-preview-box {
  1539. position: relative;
  1540. height: 100%;
  1541. width: 100%;
  1542. }
  1543. .hc-layout-content-box{
  1544. position: relative;
  1545. }
  1546. .hc-layout-content-box-lefticon {
  1547. position: absolute;
  1548. left: -28px;
  1549. top:50%;
  1550. z-index: 1000;
  1551. font-size: 50px;
  1552. color: var(--el-color-primary);
  1553. cursor:pointer;
  1554. // float: left;
  1555. }
  1556. .hc-layout-content-box-righticon {
  1557. position: absolute;
  1558. left: -28px;
  1559. top:50%;
  1560. z-index: 1001;
  1561. font-size: 50px;
  1562. color: var(--el-color-primary);
  1563. cursor:pointer;
  1564. // float: left;
  1565. }
  1566. .hc-arrow-icon {
  1567. width: 28px;
  1568. height: 28px;
  1569. display: flex;
  1570. font-size: 20px;
  1571. align-items: center;
  1572. justify-content: center;
  1573. cursor: pointer;
  1574. transition: color 0.2s;
  1575. border-radius: 50%;
  1576. box-shadow: var(--hc-shadow);
  1577. background:var(--el-color-primary-light-9);
  1578. &:hover {
  1579. color: var(--el-color-primary);
  1580. }
  1581. }
  1582. </style>