index.vue 128 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856185718581859186018611862186318641865186618671868186918701871187218731874187518761877187818791880188118821883188418851886188718881889189018911892189318941895189618971898189919001901190219031904190519061907190819091910191119121913191419151916191719181919192019211922192319241925192619271928192919301931193219331934193519361937193819391940194119421943194419451946194719481949195019511952195319541955195619571958195919601961196219631964196519661967196819691970197119721973197419751976197719781979198019811982198319841985198619871988198919901991199219931994199519961997199819992000200120022003200420052006200720082009201020112012201320142015201620172018201920202021202220232024202520262027202820292030203120322033203420352036203720382039204020412042204320442045204620472048204920502051205220532054205520562057205820592060206120622063206420652066206720682069207020712072207320742075207620772078207920802081208220832084208520862087208820892090209120922093209420952096209720982099210021012102210321042105210621072108210921102111211221132114211521162117211821192120212121222123212421252126212721282129213021312132213321342135213621372138213921402141214221432144214521462147214821492150215121522153215421552156215721582159216021612162216321642165216621672168216921702171217221732174217521762177217821792180218121822183218421852186218721882189219021912192219321942195219621972198219922002201220222032204220522062207220822092210221122122213221422152216221722182219222022212222222322242225222622272228222922302231223222332234223522362237223822392240224122422243224422452246224722482249225022512252225322542255225622572258225922602261226222632264226522662267226822692270227122722273227422752276227722782279228022812282228322842285228622872288228922902291229222932294229522962297229822992300230123022303230423052306230723082309231023112312231323142315231623172318231923202321232223232324232523262327232823292330233123322333233423352336233723382339234023412342234323442345234623472348234923502351235223532354235523562357235823592360236123622363236423652366236723682369237023712372237323742375237623772378237923802381238223832384238523862387238823892390239123922393239423952396239723982399240024012402240324042405240624072408240924102411241224132414241524162417241824192420242124222423242424252426242724282429243024312432243324342435243624372438243924402441244224432444244524462447244824492450245124522453245424552456245724582459246024612462246324642465246624672468246924702471247224732474247524762477247824792480248124822483248424852486248724882489249024912492249324942495249624972498249925002501250225032504250525062507250825092510251125122513251425152516251725182519252025212522252325242525252625272528252925302531253225332534253525362537253825392540254125422543254425452546254725482549255025512552255325542555255625572558255925602561256225632564256525662567256825692570257125722573257425752576257725782579258025812582258325842585258625872588258925902591259225932594259525962597259825992600260126022603260426052606260726082609261026112612261326142615261626172618261926202621262226232624262526262627262826292630263126322633263426352636263726382639264026412642264326442645264626472648264926502651265226532654265526562657265826592660266126622663266426652666266726682669267026712672267326742675267626772678267926802681268226832684268526862687268826892690269126922693269426952696269726982699270027012702270327042705270627072708270927102711271227132714271527162717
  1. <template>
  2. <normalLayout style="background: #f8f8f8;">
  3. <template #refresh>
  4. <div style="margin-right:15px">
  5. <el-button style="font-size:14px !important;color: #3874f6" type="text" size="small" @click="$refs.scroll.wrap.scrollTop=0">返回顶部</el-button>
  6. </div>
  7. <!-- <i class="el-icon-refresh-right" @click="refresh" v-loading.fullscreen.lock="fullscreenLoading"></i> -->
  8. </template>
  9. <template #content>
  10. <div style="padding: 16px;">
  11. <el-scrollbar ref="scroll">
  12. <div style="height:calc(100vh - 230px);padding:5rem">
  13. <div class=" inline-16">
  14. <label class="search__label" >部门:</label>
  15. <el-cascader
  16. ref="selectdep"
  17. size="small"
  18. v-model="depment"
  19. :options="deplist"
  20. :props="{emitPath:true,expandTrigger:'hover',checkStrictly:true,label:'label',value:'departmentid',children:'children'}"
  21. @change="selectDep"
  22. clearable
  23. ></el-cascader>
  24. </div>
  25. <div class="data-all">
  26. <div style="margin-bottom:20px">项目</div>
  27. <div class="data-all-wrapper">
  28. <div class="data-left">
  29. <div class="data-item">
  30. <p>{{ tool.formatAmount(dataAll.totalqty) }}</p>
  31. <p>项目总数</p>
  32. </div>
  33. <div class="data-item">
  34. <p>{{ tool.formatAmount(dataAll.reportProject)}}</p>
  35. <p >
  36. 报备项目数
  37. <el-tooltip class="item" effect="dark" content="报备项目数:统计已报备的项目数量" placement="top">
  38. <img style="vertical-align: middle" src="@/assets/icons/prompt_icon.svg" alt="">
  39. </el-tooltip>
  40. </p>
  41. </div>
  42. <div class="data-item">
  43. <p>{{ tool.formatAmount(dataAll.startproject) }}</p>
  44. <p>
  45. 进行中项目数
  46. <el-tooltip class="item" effect="dark" content="参与项目客户数:参与有下订单的项目的关联客户数" placement="top">
  47. <img style="vertical-align: middle" src="@/assets/icons/prompt_icon.svg" alt="">
  48. </el-tooltip>
  49. </p>
  50. </div>
  51. <div class="data-item">
  52. <p>{{ tool.formatAmount(dataAll.dealProject) }}</p>
  53. <p>
  54. 项目成交数
  55. <el-tooltip class="item" effect="dark" content="项目成交数:统计有关联审核过的订单的项目数量" placement="top">
  56. <img style="vertical-align: middle" src="@/assets/icons/prompt_icon.svg" alt="">
  57. </el-tooltip>
  58. </p>
  59. </div>
  60. <div class="data-item">
  61. <p>{{ dataAll.cjl }}%</p>
  62. <p>
  63. 项目成交率
  64. <el-tooltip class="item" effect="dark" content="项目成交率=有关联审核订单的项目数÷项目总数×100%" placement="top">
  65. <img style="vertical-align: middle" src="@/assets/icons/prompt_icon.svg" alt="">
  66. </el-tooltip>
  67. </p>
  68. </div>
  69. </div>
  70. <div class="data-right">
  71. <div class="data-item" v-for="item in dataAll.projecttype" :key="item.rowindex">
  72. <p>{{ tool.formatAmount(item.qty) }}</p>
  73. <p>
  74. {{ item.value }}
  75. <el-tooltip class="item" effect="dark" content="无分类客户数:统计没有客户分类信息的客户数量" placement="top" v-if="item.value == '无分类客户'">
  76. <img style="vertical-align: middle" src="@/assets/icons/prompt_icon.svg" alt="">
  77. </el-tooltip>
  78. <el-tooltip class="item" effect="dark" content="A核心客户:客户分类为A核心客户的数量" placement="top" v-else-if="item.value == 'A核心客户'">
  79. <img style="vertical-align: middle" src="@/assets/icons/prompt_icon.svg" alt="">
  80. </el-tooltip>
  81. <el-tooltip class="item" effect="dark" content="B重要客户:客户分类为B重要客户的数量" placement="top" v-else-if="item.value == 'B重要客户'">
  82. <img style="vertical-align: middle" src="@/assets/icons/prompt_icon.svg" alt="">
  83. </el-tooltip>
  84. <el-tooltip class="item" effect="dark" content="C普通客户:客户分类为C普通客户的数量" placement="top" v-else-if="item.value == 'C普通客户'">
  85. <img style="vertical-align: middle" src="@/assets/icons/prompt_icon.svg" alt="">
  86. </el-tooltip>
  87. <el-tooltip class="item" effect="dark" content="D一般客户:客户分类为D一般客户的数量" placement="top" v-else-if="item.value == 'D一般客户'">
  88. <img style="vertical-align: middle" src="@/assets/icons/prompt_icon.svg" alt="">
  89. </el-tooltip>
  90. </p>
  91. </div>
  92. </div>
  93. </div>
  94. </div>
  95. <!--项目类型-->
  96. <div class="data-panel" id="projectType">
  97. <div class="panel-content-wrapper" >
  98. <div class="panel-header">
  99. <div class="title">项目类型分析</div>
  100. <div class="panel-select">
  101. <div class="mt-10 inline-16">
  102. <label class="search__label" >部门:</label>
  103. <el-cascader
  104. :append-to-body="false"
  105. ref="selectdep"
  106. size="small"
  107. v-model="typeTableParam.content.dataid"
  108. :options="deplist"
  109. :props="{emitPath:true,expandTrigger:'hover',checkStrictly:true,label:'label',value:'departmentid',children:'children'}"
  110. @change="$event => {if($event.length) {typeMapParam.content.type=1;typeMapParam.content.dataid=$event[$event.length - 1];typeTableParam.content.type=1;typeTableParam.content.username='';typeTableParam.content.pageNumber = 1;$refs.typeTable.listData();typeInit()} else {typeMapParam.content.type='';typeMapParam.content.dataid='';typeTableParam.content.dataid='';typeTableParam.content.type='';typeTableParam.content.username='';typeTableParam.content.pageNumber = 1;$refs.typeTable.listData();typeInit()}}"></el-cascader>
  111. </div>
  112. <div class="mt-10 inline-16">
  113. <label class="search__label" >业务员:</label>
  114. <el-select v-model="typeTableParam.content.username" filterable placeholder="请选择" size="small"
  115. :popper-append-to-body="false"
  116. @change="$event => {if($event) {typeMapParam.content.type=0;typeMapParam.content.dataid=$event;typeTableParam.content.type=0;typeTableParam.content.dataid=$event;typeTableParam.content.depname='';typeTableParam.content.pageNumber = 1;$refs.typeTable.listData();typeInit()} else {typeMapParam.content.type='';typeMapParam.content.dataid='';typeTableParam.content.dataid='';typeTableParam.content.type='';typeTableParam.content.depname='';typeTableParam.content.pageNumber = 1;$refs.typeTable.listData();typeInit()}}"
  117. >
  118. <el-option
  119. v-for="item in personnelList"
  120. :key="item.index"
  121. :label="item.name"
  122. :value="item.userid">
  123. </el-option>
  124. </el-select>
  125. </div>
  126. <div class="mt-10 inline-15">
  127. <exportFile :param="typeTableParam" :columns="tool.tabelCol($route.name).projectTable.tablecols" fileName="项目类型分析" :dataid="typeMapParam.content.dataid"></exportFile>
  128. </div>
  129. <div style="display: inline-block;vertical-align: middle">
  130. <FullScroll domId="projectType" @onFull="onFull" @backFull="backFull"></FullScroll>
  131. </div>
  132. </div>
  133. </div>
  134. <div class="panel-content">
  135. <div ref="typeEl" style="width:30%"></div>
  136. <div class="panel-table" style="width:70%">
  137. <pageTable
  138. ref="typeTable"
  139. :tablecols="tool.tabelCol($route.name).projectTable.tablecols"
  140. :param="typeTableParam"
  141. :custom="true"
  142. fixedName="operation"
  143. >
  144. <template v-slot:custom="scope">
  145. <div v-if="scope.data.columnname == 'sys_tag'">
  146. <el-tag size="small" v-for="(item,index) in scope.data.data.sys_tag" :key="index">{{ item }}</el-tag>
  147. </div>
  148. <div v-else-if="scope.data.columnname == 'operation'">
  149. <el-button type="text" size="small" @click="goDetail(scope.data.data)" :disabled="isFull">详情</el-button>
  150. </div>
  151. <div v-else-if="scope.data.columnname == 'signamount_due'">
  152. {{ tool.formatAmount(scope.data.data.signamount_due,2,'¥') }}
  153. </div>
  154. <div v-else-if="scope.data.columnname === 'industry'">
  155. <el-tag size="small" v-for="(item,index) in scope.data.data.industry" :key="index">{{ item }}</el-tag>
  156. </div>
  157. <div v-else-if="scope.data.columnname === 'tradingstatus'">
  158. <span style="color:#3874f6" v-if="scope.data.data[[scope.data.columnname]] == '未成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  159. <span style="color:#fa8c16" v-else-if="scope.data.data[[scope.data.columnname]] == '已成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  160. <span style="color:#333333" v-else-if="scope.data.data[[scope.data.columnname]] == '多次成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  161. </div>
  162. <div v-else-if="scope.data.columnname === 'status'">
  163. <span style="color:rgb(250, 140, 22)" v-if="scope.data.data[[scope.data.columnname]] == '已成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  164. <span style="color:#52c41a" v-else-if="scope.data.data[[scope.data.columnname]] == '跟进中'">{{scope.data.data[[scope.data.columnname]]}}</span>
  165. <span style="color:#999999" v-else-if="scope.data.data[[scope.data.columnname]] == '已失败' || scope.data.data[[scope.data.columnname]] == '已结案'">{{scope.data.data[[scope.data.columnname]]}}</span>
  166. </div>
  167. <div v-else-if="scope.data.columnname == 'scale'">
  168. {{scope.data.data.scale ? scope.data.data.scale + scope.data.data.unitname : '' }}
  169. </div>
  170. <div v-else>
  171. {{ scope.data.data[scope.data.columnname] }}
  172. </div>
  173. </template>
  174. </pageTable>
  175. </div>
  176. </div>
  177. </div>
  178. </div>
  179. <!--项目等级分析-->
  180. <div class="data-panel" id="projectGrad">
  181. <div class="panel-content-wrapper" >
  182. <div class="panel-header">
  183. <div class="title">项目等级分析</div>
  184. <div class="panel-select">
  185. <div class="mt-10 inline-16">
  186. <label class="search__label" >部门:</label>
  187. <el-cascader
  188. :append-to-body="false"
  189. ref="selectdep"
  190. size="small"
  191. v-model="gradTableParam.content.dataid"
  192. :options="deplist"
  193. :props="{emitPath:true,expandTrigger:'hover',checkStrictly:true,label:'label',value:'departmentid',children:'children'}"
  194. @change="$event => {if($event.length) {gradMapParam.content.type=1;gradMapParam.content.dataid=$event[$event.length - 1];gradTableParam.content.type=1;gradTableParam.content.username='';gradTableParam.content.pageNumber = 1;$refs.gradTable.listData();gradInit()} else {gradMapParam.content.type='';gradMapParam.content.dataid='';gradTableParam.content.dataid='';gradTableParam.content.type='';gradTableParam.content.username='';gradTableParam.content.pageNumber = 1;$refs.gradTable.listData();gradInit()}}"></el-cascader>
  195. </div>
  196. <div class="mt-10 inline-16">
  197. <label class="search__label" >业务员:</label>
  198. <el-select v-model="gradTableParam.content.username" filterable placeholder="请选择" size="small"
  199. :popper-append-to-body="false"
  200. @change="$event => {if($event) {gradMapParam.content.type=0;gradMapParam.content.dataid=$event;gradTableParam.content.type=0;gradTableParam.content.dataid=$event;gradTableParam.content.depname='';gradTableParam.content.pageNumber = 1;$refs.gradTable.listData();gradInit()} else {gradMapParam.content.type='';gradMapParam.content.dataid='';gradTableParam.content.dataid='';gradTableParam.content.type='';gradTableParam.content.depname='';gradTableParam.content.pageNumber = 1;$refs.gradTable.listData();gradInit()}}"
  201. >
  202. <el-option
  203. v-for="item in personnelList"
  204. :key="item.index"
  205. :label="item.name"
  206. :value="item.userid">
  207. </el-option>
  208. </el-select>
  209. </div>
  210. <div class="mt-10 inline-15">
  211. <exportFile :param="gradTableParam" :columns="tool.tabelCol($route.name).projectTable.tablecols" fileName="项目等级分析" :dataid="gradMapParam.content.dataid"></exportFile>
  212. </div>
  213. <div style="display: inline-block;vertical-align: middle">
  214. <FullScroll domId="projectGrad" @onFull="onFull" @backFull="backFull"></FullScroll>
  215. </div>
  216. </div>
  217. </div>
  218. <div class="panel-content">
  219. <div ref="gradEl" style="width:30%"></div>
  220. <div class="panel-table" style="width:70%">
  221. <pageTable
  222. ref="gradTable"
  223. :tablecols="tool.tabelCol($route.name).projectTable.tablecols"
  224. :param="gradTableParam"
  225. :custom="true"
  226. fixedName="operation"
  227. >
  228. <template v-slot:custom="scope">
  229. <div v-if="scope.data.columnname == 'sys_tag'">
  230. <el-tag size="small" v-for="(item,index) in scope.data.data.sys_tag" :key="index">{{ item }}</el-tag>
  231. </div>
  232. <div v-else-if="scope.data.columnname == 'operation'">
  233. <el-button type="text" size="small" @click="goDetail(scope.data.data)" :disabled="isFull">详情</el-button>
  234. </div>
  235. <div v-else-if="scope.data.columnname == 'signamount_due'">
  236. {{ tool.formatAmount(scope.data.data.signamount_due,2,'¥') }}
  237. </div>
  238. <div v-else-if="scope.data.columnname === 'industry'">
  239. <el-tag size="small" v-for="(item,index) in scope.data.data.industry" :key="index">{{ item }}</el-tag>
  240. </div>
  241. <div v-else-if="scope.data.columnname === 'tradingstatus'">
  242. <span style="color:#3874f6" v-if="scope.data.data[[scope.data.columnname]] == '未成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  243. <span style="color:#fa8c16" v-else-if="scope.data.data[[scope.data.columnname]] == '已成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  244. <span style="color:#333333" v-else-if="scope.data.data[[scope.data.columnname]] == '多次成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  245. </div>
  246. <div v-else-if="scope.data.columnname === 'status'">
  247. <span style="color:rgb(250, 140, 22)" v-if="scope.data.data[[scope.data.columnname]] == '已成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  248. <span style="color:#52c41a" v-else-if="scope.data.data[[scope.data.columnname]] == '跟进中'">{{scope.data.data[[scope.data.columnname]]}}</span>
  249. <span style="color:#999999" v-else-if="scope.data.data[[scope.data.columnname]] == '已失败' || scope.data.data[[scope.data.columnname]] == '已结案'">{{scope.data.data[[scope.data.columnname]]}}</span>
  250. </div>
  251. <div v-else-if="scope.data.columnname == 'scale'">
  252. {{scope.data.data.scale ? scope.data.data.scale + scope.data.data.unitname : '' }}
  253. </div>
  254. <div v-else>
  255. {{ scope.data.data[scope.data.columnname] }}
  256. </div>
  257. </template>
  258. </pageTable>
  259. </div>
  260. </div>
  261. </div>
  262. </div>
  263. <!--项目评估分析-->
  264. <div class="data-panel" style="height:800px" id="projectScore1">
  265. <div class="panel-content-wrapper" >
  266. <div class="panel-header">
  267. <div class="title">
  268. 项目评估分析
  269. <el-tooltip class="item" effect="dark" placement="top">
  270. <template #content>
  271. 项目指标分类比例:
  272. <div v-for="(item,index) in projectScoreDescript" :key="index">
  273. <span>{{ item.name }}:</span>
  274. <span>{{ item.range }}</span>
  275. </div>
  276. </template>
  277. <img style="vertical-align: middle" src="@/assets/icons/prompt_icon.svg" alt="">
  278. </el-tooltip>
  279. </div>
  280. <div class="panel-select">
  281. <div class="mt-10 inline-16">
  282. <label class="search__label" >部门:</label>
  283. <el-cascader
  284. ref="selectdep"
  285. size="small"
  286. v-model="scoreTableParam1.content.dataid"
  287. :options="deplist"
  288. :props="{emitPath:true,expandTrigger:'hover',checkStrictly:true,label:'label',value:'departmentid',children:'children'}"
  289. @change="$event => {if($event.length) {scoreMapParam1.content.type=1;scoreMapParam1.content.dataid=$event[$event.length - 1];scoreTableParam1.content.type=1;scoreTableParam1.content.username='';scoreTableParam1.content.pageNumber = 1;$refs.scoreTable.listData();scoreInit()} else {scoreMapParam1.content.type='';scoreMapParam1.content.dataid='';scoreTableParam1.content.dataid='';scoreTableParam1.content.type='';scoreTableParam1.content.username='';scoreTableParam1.content.pageNumber = 1;$refs.scoreTable.listData();scoreInit()}}"></el-cascader>
  290. </div>
  291. <div class="mt-10 inline-16">
  292. <label class="search__label" >业务员:</label>
  293. <el-select v-model="scoreTableParam1.content.username" filterable placeholder="请选择" size="small"
  294. @change="$event => {if($event) {scoreMapParam1.content.type=0;scoreMapParam1.content.dataid=$event;scoreTableParam1.content.type=0;scoreTableParam1.content.dataid=$event;scoreTableParam1.content.depname='';scoreTableParam1.content.pageNumber = 1;$refs.scoreTable.listData();scoreInit()} else {scoreMapParam1.content.type='';gradMapParam.content.dataid='';scoreTableParam1.content.dataid='';scoreTableParam1.content.type='';scoreTableParam1.content.depname='';scoreTableParam1.content.pageNumber = 1;$refs.scoreTable.listData();scoreInit()}}"
  295. >
  296. <el-option
  297. v-for="item in personnelList"
  298. :key="item.index"
  299. :label="item.name"
  300. :value="item.userid">
  301. </el-option>
  302. </el-select>
  303. </div>
  304. <div class="mt-10 inline-15">
  305. <exportFile :param="scoreTableParam1" :columns="tool.tabelCol($route.name).projectTable2.tablecols.splice(0,tool.tabelCol($route.name).projectTable2.tablecols.length - 1)" fileName="项目评估分析" :dataid="scoreMapParam1.content.dataid"></exportFile>
  306. </div>
  307. <div style="display: inline-block;vertical-align: middle">
  308. <FullScroll domId="projectScore1"></FullScroll>
  309. </div>
  310. </div>
  311. </div>
  312. <div style="height:calc(100% - 44px)">
  313. <div ref="scoreEl" style="height:30%"></div>
  314. <div class="panel-table" style="height:70%">
  315. <div class="mt-10 inline-16" style="margin:10px 0;display:flex !important;justify-content:space-between">
  316. <span style="font-size:16px;color:#333333">{{ scoreStatus ? scoreStatus : '全部' }}</span>
  317. <div style="display:flex;align-items:center">
  318. <div>
  319. <label class="search__label" >评估分档位:</label>
  320. <el-select v-model="scoreTableParam1.content.where.taskType" filterable placeholder="请选择" size="small"
  321. :popper-append-to-body="false"
  322. @change="$refs.scoreTable.listData()"
  323. >
  324. <el-option label="全部" value="" />
  325. <el-option label="高分档" value="高分档" />
  326. <el-option label="中分档" value="中分档" />
  327. <el-option label="低分档" value="低分档" />
  328. </el-select>
  329. </div>
  330. <el-tooltip class="item" effect="dark" placement="top">
  331. <template #content>
  332. <div>高分档: 200分以上</div>
  333. <div>中分档:100-200分</div>
  334. <div>低分档:100分以下</div>
  335. </template>
  336. <img style="vertical-align: middle;margin-left:10px" src="@/assets/icons/prompt_icon.svg" alt="">
  337. </el-tooltip>
  338. </div>
  339. </div>
  340. <pageTable
  341. style="height:calc(100% - 60px) !important"
  342. ref="scoreTable"
  343. :tablecols="tool.tabelCol($route.name).projectTable2.tablecols.splice(0,tool.tabelCol($route.name).projectTable2.tablecols.length - 1)"
  344. :param="scoreTableParam1"
  345. :custom="true"
  346. fixedName="operation"
  347. >
  348. <template v-slot:custom="scope">
  349. <div v-if="scope.data.columnname == 'sys_tag'">
  350. <el-tag size="small" v-for="(item,index) in scope.data.data.sys_tag" :key="index">{{ item }}</el-tag>
  351. </div>
  352. <div v-else-if="scope.data.columnname == 'operation'">
  353. <el-button type="text" size="small" @click="goDetail(scope.data.data)">详情</el-button>
  354. </div>
  355. <div v-else-if="scope.data.columnname == 'signamount_due'">
  356. {{ tool.formatAmount(scope.data.data.signamount_due,2,'¥') }}
  357. </div>
  358. <div v-else-if="scope.data.columnname == 'dealamount'">
  359. {{ tool.formatAmount(scope.data.data.dealamount,2,'¥') }}
  360. </div>
  361. <div v-else-if="scope.data.columnname === 'industry'">
  362. <el-tag size="small" v-for="(item,index) in scope.data.data.industry" :key="index">{{ item }}</el-tag>
  363. </div>
  364. <div v-else-if="scope.data.columnname === 'tradingstatus'">
  365. <span style="color:#3874f6" v-if="scope.data.data[[scope.data.columnname]] == '未成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  366. <span style="color:#fa8c16" v-else-if="scope.data.data[[scope.data.columnname]] == '已成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  367. <span style="color:#333333" v-else-if="scope.data.data[[scope.data.columnname]] == '多次成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  368. </div>
  369. <div v-else-if="scope.data.columnname === 'status'">
  370. <span style="color:rgb(250, 140, 22)" v-if="scope.data.data[[scope.data.columnname]] == '已成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  371. <span style="color:#52c41a" v-else-if="scope.data.data[[scope.data.columnname]] == '跟进中'">{{scope.data.data[[scope.data.columnname]]}}</span>
  372. <span style="color:#999999" v-else-if="scope.data.data[[scope.data.columnname]] == '已失败' || scope.data.data[[scope.data.columnname]] == '已结案'">{{scope.data.data[[scope.data.columnname]]}}</span>
  373. </div>
  374. <div v-else-if="scope.data.columnname == 'scale'">
  375. {{scope.data.data.scale ? scope.data.data.scale + scope.data.data.unitname : '' }}
  376. </div>
  377. <div v-else>
  378. {{ scope.data.data[scope.data.columnname] }}
  379. </div>
  380. </template>
  381. </pageTable>
  382. </div>
  383. </div>
  384. </div>
  385. </div>
  386. <!--12月项目新增-->
  387. <div class="data-panel" id="projectAdd">
  388. <div class="panel-content-wrapper" >
  389. <div class="panel-header">
  390. <div class="title">近12月项目新增分析</div>
  391. <div class="panel-select">
  392. <div class="mt-10 inline-16">
  393. <label class="search__label" >部门:</label>
  394. <el-cascader
  395. ref="selectdep"
  396. size="small"
  397. :append-to-body="false"
  398. v-model="addParam.content.dataid"
  399. :options="deplist"
  400. :props="{emitPath:true,expandTrigger:'hover',checkStrictly:true,label:'label',value:'departmentid',children:'children'}"
  401. @change="$event => {if($event.length) {addParam.content.type=1;addParam.content.username='';addFun()} else {addParam.content.dataid='';addParam.content.type='';addParam.content.username='';addFun()}}"></el-cascader>
  402. </div>
  403. <div class="mt-10 inline-16">
  404. <label class="search__label" >业务员:</label>
  405. <el-select v-model="addParam.content.username" filterable placeholder="请选择" size="small"
  406. :popper-append-to-body="false"
  407. @change="$event => {if($event) {addParam.content.type=0;addParam.content.dataid=$event;addParam.content.depname='';addFun()} else {addParam.content.dataid='';addParam.content.type='';addParam.content.depname='';addFun()}}"
  408. >
  409. <el-option
  410. v-for="item in personnelList"
  411. :key="item.index"
  412. :label="item.name"
  413. :value="item.userid">
  414. </el-option>
  415. </el-select>
  416. </div>
  417. <div class="mt-10 inline-15">
  418. <label class="search__label" >分析日期:</label>
  419. <el-date-picker
  420. :append-to-body="false"
  421. v-model="addParam.content.enddate"
  422. format="yyyy-MM-dd"
  423. value-format="yyyy-MM-dd"
  424. type="date"
  425. size="small"
  426. placeholder="选择日期"
  427. @change="addFun()">
  428. </el-date-picker>
  429. </div>
  430. <div style="display: inline-block;vertical-align: middle">
  431. <FullScroll domId="projectAdd"></FullScroll>
  432. </div>
  433. </div>
  434. </div>
  435. <div ref="addEl" style="height: calc(100% - 55px)"></div>
  436. </div>
  437. </div>
  438. <!--12月项目报备-->
  439. <div class="data-panel" id="projectBaobei">
  440. <div class="panel-content-wrapper" >
  441. <div class="panel-header">
  442. <div class="title">近12月项目报备分析</div>
  443. <div class="panel-select">
  444. <div class="mt-10 inline-16">
  445. <label class="search__label" >部门:</label>
  446. <el-cascader
  447. :append-to-body="false"
  448. ref="selectdep"
  449. size="small"
  450. v-model="baobeiParam.content.dataid"
  451. :options="deplist"
  452. :props="{emitPath:true,expandTrigger:'hover',checkStrictly:true,label:'label',value:'departmentid',children:'children'}"
  453. @change="$event => {if($event.length) {baobeiParam.content.type=1;baobeiParam.content.username='';baobeiFun()} else {baobeiParam.content.dataid='';baobeiParam.content.type='';baobeiParam.content.username='';baobeiFun()}}"></el-cascader>
  454. </div>
  455. <div class="mt-10 inline-16">
  456. <label class="search__label" >业务员:</label>
  457. <el-select v-model="baobeiParam.content.username" filterable placeholder="请选择" size="small"
  458. :popper-append-to-body="false"
  459. @change="$event => {if($event) {baobeiParam.content.type=0;baobeiParam.content.dataid=$event;baobeiParam.content.depname='';baobeiFun()} else {baobeiParam.content.dataid='';baobeiParam.content.type='';baobeiParam.content.depname='';baobeiFun()}}"
  460. >
  461. <el-option
  462. v-for="item in personnelList"
  463. :key="item.index"
  464. :label="item.name"
  465. :value="item.userid">
  466. </el-option>
  467. </el-select>
  468. </div>
  469. <div class="mt-10 inline-15">
  470. <label class="search__label" >分析日期:</label>
  471. <el-date-picker
  472. :append-to-body="false"
  473. v-model="baobeiParam.content.enddate"
  474. format="yyyy-MM-dd"
  475. value-format="yyyy-MM-dd"
  476. type="date"
  477. size="small"
  478. placeholder="选择日期"
  479. @change="baobeiFun()">
  480. </el-date-picker>
  481. </div>
  482. <div style="display: inline-block;vertical-align: middle">
  483. <FullScroll domId="projectBaobei"></FullScroll>
  484. </div>
  485. </div>
  486. </div>
  487. <div ref="baobeiEl" style="height:calc(100% - 55px)"></div>
  488. </div>
  489. </div>
  490. <!--12月项目报价-->
  491. <div class="data-panel" id="projectBaojia">
  492. <div class="panel-content-wrapper" >
  493. <div class="panel-header">
  494. <div class="title">近12月项目报价分析</div>
  495. <div class="panel-select">
  496. <div class="mt-10 inline-16">
  497. <label class="search__label" >部门:</label>
  498. <el-cascader
  499. :append-to-body="false"
  500. ref="selectdep"
  501. size="small"
  502. v-model="baojiaParam.content.dataid"
  503. :options="deplist"
  504. :props="{emitPath:true,expandTrigger:'hover',checkStrictly:true,label:'label',value:'departmentid',children:'children'}"
  505. @change="$event => {if($event.length) {baojiaParam.content.type=1;baojiaParam.content.username='';baojiaFun()} else {baojiaParam.content.dataid='';baojiaParam.content.type='';baojiaParam.content.username='';baojiaFun()}}"></el-cascader>
  506. </div>
  507. <div class="mt-10 inline-16">
  508. <label class="search__label" >业务员:</label>
  509. <el-select v-model="baojiaParam.content.username" filterable placeholder="请选择" size="small"
  510. :popper-append-to-body="false"
  511. @change="$event => {if($event) {baojiaParam.content.type=0;baojiaParam.content.dataid=$event;baojiaParam.content.depname='';baojiaFun()} else {baojiaParam.content.dataid='';baojiaParam.content.type='';baojiaParam.content.depname='';baojiaFun()}}"
  512. >
  513. <el-option
  514. v-for="item in personnelList"
  515. :key="item.index"
  516. :label="item.name"
  517. :value="item.userid">
  518. </el-option>
  519. </el-select>
  520. </div>
  521. <div class="mt-10 inline-15">
  522. <label class="search__label" >分析日期:</label>
  523. <el-date-picker
  524. :append-to-body="false"
  525. v-model="baojiaParam.content.enddate"
  526. format="yyyy-MM-dd"
  527. value-format="yyyy-MM-dd"
  528. type="date"
  529. size="small"
  530. placeholder="选择日期"
  531. @change="baojiaFun()">
  532. </el-date-picker>
  533. </div>
  534. <div style="display: inline-block;vertical-align: middle">
  535. <FullScroll domId="projectBaojia"></FullScroll>
  536. </div>
  537. </div>
  538. </div>
  539. <div ref="baojiaEl" style="height:calc(100% - 55px)"></div>
  540. </div>
  541. </div>
  542. <!--12月项目跟进-->
  543. <div class="data-panel" id="projectFllow">
  544. <div class="panel-content-wrapper" >
  545. <div class="panel-header">
  546. <div class="title">近12月项目跟进分析</div>
  547. <div class="panel-select">
  548. <div class="mt-10 inline-16">
  549. <label class="search__label" >部门:</label>
  550. <el-cascader
  551. :append-to-body="false"
  552. ref="selectdep"
  553. size="small"
  554. v-model="fllowParam.content.dataid"
  555. :options="deplist"
  556. :props="{emitPath:true,expandTrigger:'hover',checkStrictly:true,label:'label',value:'departmentid',children:'children'}"
  557. @change="$event => {if($event.length) {fllowParam.content.type=1;fllowParam.content.username='';fllowFun()} else {fllowParam.content.dataid='';fllowParam.content.type='';fllowParam.content.username='';fllowFun()}}"></el-cascader>
  558. </div>
  559. <div class="mt-10 inline-16">
  560. <label class="search__label" >业务员:</label>
  561. <el-select v-model="fllowParam.content.username" filterable placeholder="请选择" size="small"
  562. :popper-append-to-body="false"
  563. @change="$event => {if($event) {fllowParam.content.type=0;fllowParam.content.dataid=$event;fllowParam.content.depname='';fllowFun()} else {fllowParam.content.dataid='';fllowParam.content.type='';fllowParam.content.depname='';fllowFun()}}"
  564. >
  565. <el-option
  566. v-for="item in personnelList"
  567. :key="item.index"
  568. :label="item.name"
  569. :value="item.userid">
  570. </el-option>
  571. </el-select>
  572. </div>
  573. <div class="mt-10 inline-15">
  574. <label class="search__label" >分析日期:</label>
  575. <el-date-picker
  576. :append-to-body="false"
  577. v-model="fllowParam.content.enddate"
  578. format="yyyy-MM-dd"
  579. value-format="yyyy-MM-dd"
  580. type="date"
  581. size="small"
  582. placeholder="选择日期"
  583. @change="fllowFun()">
  584. </el-date-picker>
  585. </div>
  586. <div style="display: inline-block;vertical-align: middle">
  587. <FullScroll domId="projectFllow"></FullScroll>
  588. </div>
  589. </div>
  590. </div>
  591. <div ref="fllowEl" style="height:calc(100% - 55px)"></div>
  592. </div>
  593. </div>
  594. <!--项目跟进情况-->
  595. <div class="data-panel" id="projectFllow1">
  596. <div class="panel-content-wrapper" >
  597. <div class="panel-header">
  598. <div class="title">项目跟进情况统计</div>
  599. <div class="panel-select">
  600. <div class="mt-10 inline-16">
  601. <label class="search__label" >部门:</label>
  602. <el-cascader
  603. :append-to-body="false"
  604. ref="selectdep"
  605. size="small"
  606. v-model="fllowTableParam.content.dataid"
  607. :options="deplist"
  608. :props="{emitPath:true,expandTrigger:'hover',checkStrictly:true,label:'label',value:'departmentid',children:'children'}"
  609. @change="$event => {if($event.length) {fllowMapParam.content.type=1;fllowMapParam.content.dataid=$event[$event.length - 1];fllowTableParam.content.type=1;fllowTableParam.content.username='';fllowTableParam.content.pageNumber = 1;$refs.projectFllowTable.listData();fllowInit()} else {fllowMapParam.content.type='';fllowMapParam.content.dataid='';fllowTableParam.content.dataid='';fllowTableParam.content.type='';fllowTableParam.content.username='';fllowTableParam.content.pageNumber = 1;$refs.projectFllowTable.listData();fllowInit()}}"></el-cascader>
  610. </div>
  611. <div class="mt-10 inline-16">
  612. <label class="search__label" >业务员:</label>
  613. <el-select v-model="fllowTableParam.content.username" filterable placeholder="请选择" size="small"
  614. :popper-append-to-body="false"
  615. @change="$event => {if($event) {fllowMapParam.content.type=0;fllowMapParam.content.dataid=$event;fllowTableParam.content.type=0;fllowTableParam.content.dataid=$event;fllowTableParam.content.depname='';fllowTableParam.content.pageNumber = 1;$refs.projectFllowTable.listData();fllowInit()} else {fllowMapParam.content.type='';fllowMapParam.content.dataid='';fllowTableParam.content.dataid='';fllowTableParam.content.type='';fllowTableParam.content.depname='';fllowTableParam.content.pageNumber = 1;$refs.projectFllowTable.listData();fllowInit()}}"
  616. >
  617. <el-option
  618. v-for="item in personnelList"
  619. :key="item.index"
  620. :label="item.name"
  621. :value="item.userid">
  622. </el-option>
  623. </el-select>
  624. </div>
  625. <div class="mt-10 inline-15">
  626. <exportFile :param="fllowTableParam" :columns="tool.tabelCol($route.name).projectTable.tablecols" fileName="项目跟进情况统计" :dataid="fllowMapParam.content.dataid"></exportFile>
  627. </div>
  628. <div style="display: inline-block;vertical-align: middle">
  629. <FullScroll domId="projectFllow1" @onFull="onFull" @backFull="backFull"></FullScroll>
  630. </div>
  631. </div>
  632. </div>
  633. <div class="panel-content">
  634. <div ref="projectFllowEl" style="width:30%"></div>
  635. <div class="panel-table" style="width:70%">
  636. <pageTable
  637. ref="projectFllowTable"
  638. :tablecols="tool.tabelCol($route.name).projectTable.tablecols"
  639. :param="fllowTableParam"
  640. :custom="true"
  641. fixedName="operation"
  642. >
  643. <template v-slot:custom="scope">
  644. <div v-if="scope.data.columnname == 'sys_tag'">
  645. <el-tag size="small" v-for="(item,index) in scope.data.data.sys_tag" :key="index">{{ item }}</el-tag>
  646. </div>
  647. <div v-else-if="scope.data.columnname == 'operation'">
  648. <el-button type="text" size="small" @click="goDetail(scope.data.data)" :disabled="isFull">详情</el-button>
  649. </div>
  650. <div v-else-if="scope.data.columnname == 'signamount_due'">
  651. {{ tool.formatAmount(scope.data.data.signamount_due,2,'¥') }}
  652. </div>
  653. <div v-else-if="scope.data.columnname === 'industry'">
  654. <el-tag size="small" v-for="(item,index) in scope.data.data.industry" :key="index">{{ item }}</el-tag>
  655. </div>
  656. <div v-else-if="scope.data.columnname === 'tradingstatus'">
  657. <span style="color:#3874f6" v-if="scope.data.data[[scope.data.columnname]] == '未成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  658. <span style="color:#fa8c16" v-else-if="scope.data.data[[scope.data.columnname]] == '已成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  659. <span style="color:#333333" v-else-if="scope.data.data[[scope.data.columnname]] == '多次成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  660. </div>
  661. <div v-else-if="scope.data.columnname === 'status'">
  662. <span style="color:rgb(250, 140, 22)" v-if="scope.data.data[[scope.data.columnname]] == '已成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  663. <span style="color:#52c41a" v-else-if="scope.data.data[[scope.data.columnname]] == '跟进中'">{{scope.data.data[[scope.data.columnname]]}}</span>
  664. <span style="color:#999999" v-else-if="scope.data.data[[scope.data.columnname]] == '已失败' || scope.data.data[[scope.data.columnname]] == '已结案'">{{scope.data.data[[scope.data.columnname]]}}</span>
  665. </div>
  666. <div v-else-if="scope.data.columnname == 'scale'">
  667. {{scope.data.data.scale ? scope.data.data.scale + scope.data.data.unitname : '' }}
  668. </div>
  669. <div v-else>
  670. {{ scope.data.data[scope.data.columnname] }}
  671. </div>
  672. </template>
  673. </pageTable>
  674. </div>
  675. </div>
  676. </div>
  677. </div>
  678. <!--项目联系人情况-->
  679. <div class="data-panel" id="projectContact">
  680. <div class="panel-content-wrapper" >
  681. <div class="panel-header">
  682. <div class="title">项目联系人情况统计</div>
  683. <div class="panel-select">
  684. <div class="mt-10 inline-16">
  685. <label class="search__label" >部门:</label>
  686. <el-cascader
  687. :append-to-body="false"
  688. ref="selectdep"
  689. size="small"
  690. v-model="contactTableParam.content.dataid"
  691. :options="deplist"
  692. :props="{emitPath:true,expandTrigger:'hover',checkStrictly:true,label:'label',value:'departmentid',children:'children'}"
  693. @change="$event => {if($event.length) {contactMapParam.content.type=1;contactMapParam.content.dataid=$event[$event.length - 1];contactTableParam.content.type=1;contactTableParam.content.username='';contactTableParam.content.pageNumber = 1;$refs.projectContactTable.listData();contactInit()} else {contactMapParam.content.type='';contactMapParam.content.dataid='';contactTableParam.content.dataid='';contactTableParam.content.type='';contactTableParam.content.username='';contactTableParam.content.pageNumber = 1;$refs.projectContactTable.listData();contactInit()}}"></el-cascader>
  694. </div>
  695. <div class="mt-10 inline-16">
  696. <label class="search__label" >业务员:</label>
  697. <el-select v-model="contactTableParam.content.username" filterable placeholder="请选择" size="small"
  698. :popper-append-to-body="false"
  699. @change="$event => {if($event) {contactMapParam.content.type=0;contactMapParam.content.dataid=$event;contactTableParam.content.type=0;contactTableParam.content.dataid=$event;contactTableParam.content.depname='';contactTableParam.content.pageNumber = 1;$refs.projectContactTable.listData();contactInit()} else {contactMapParam.content.type='';contactMapParam.content.dataid='';contactTableParam.content.dataid='';contactTableParam.content.type='';contactTableParam.content.depname='';contactTableParam.content.pageNumber = 1;$refs.projectContactTable.listData();contactInit()}}"
  700. >
  701. <el-option
  702. v-for="item in personnelList"
  703. :key="item.index"
  704. :label="item.name"
  705. :value="item.userid">
  706. </el-option>
  707. </el-select>
  708. </div>
  709. <div class="mt-10 inline-15">
  710. <exportFile :param="contactTableParam" :columns="tool.tabelCol($route.name).projectTable.tablecols" fileName="项目联系人情况统计" :dataid="contactMapParam.content.dataid"></exportFile>
  711. </div>
  712. <div style="display: inline-block;vertical-align: middle">
  713. <FullScroll domId="projectContact" @onFull="onFull" @backFull="backFull"></FullScroll>
  714. </div>
  715. </div>
  716. </div>
  717. <div class="panel-content">
  718. <div ref="projectContactEl" style="width:30%"></div>
  719. <div class="panel-table" style="width:70%">
  720. <pageTable
  721. ref="projectContactTable"
  722. :tablecols="tool.tabelCol($route.name).projectTable.tablecols"
  723. :param="contactTableParam"
  724. :custom="true"
  725. fixedName="operation"
  726. >
  727. <template v-slot:custom="scope">
  728. <div v-if="scope.data.columnname == 'sys_tag'">
  729. <el-tag size="small" v-for="(item,index) in scope.data.data.sys_tag" :key="index">{{ item }}</el-tag>
  730. </div>
  731. <div v-else-if="scope.data.columnname == 'operation'">
  732. <el-button type="text" size="small" @click="goDetail(scope.data.data)" :disabled="isFull">详情</el-button>
  733. </div>
  734. <div v-else-if="scope.data.columnname == 'signamount_due'">
  735. {{ tool.formatAmount(scope.data.data.signamount_due,2,'¥') }}
  736. </div>
  737. <div v-else-if="scope.data.columnname === 'industry'">
  738. <el-tag size="small" v-for="(item,index) in scope.data.data.industry" :key="index">{{ item }}</el-tag>
  739. </div>
  740. <div v-else-if="scope.data.columnname === 'tradingstatus'">
  741. <span style="color:#3874f6" v-if="scope.data.data[[scope.data.columnname]] == '未成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  742. <span style="color:#fa8c16" v-else-if="scope.data.data[[scope.data.columnname]] == '已成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  743. <span style="color:#333333" v-else-if="scope.data.data[[scope.data.columnname]] == '多次成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  744. </div>
  745. <div v-else-if="scope.data.columnname === 'status'">
  746. <span style="color:rgb(250, 140, 22)" v-if="scope.data.data[[scope.data.columnname]] == '已成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  747. <span style="color:#52c41a" v-else-if="scope.data.data[[scope.data.columnname]] == '跟进中'">{{scope.data.data[[scope.data.columnname]]}}</span>
  748. <span style="color:#999999" v-else-if="scope.data.data[[scope.data.columnname]] == '已失败' || scope.data.data[[scope.data.columnname]] == '已结案'">{{scope.data.data[[scope.data.columnname]]}}</span>
  749. </div>
  750. <div v-else-if="scope.data.columnname == 'scale'">
  751. {{scope.data.data.scale ? scope.data.data.scale + scope.data.data.unitname : '' }}
  752. </div>
  753. <div v-else>
  754. {{ scope.data.data[scope.data.columnname] }}
  755. </div>
  756. </template>
  757. </pageTable>
  758. </div>
  759. </div>
  760. </div>
  761. </div>
  762. <!--项目关联客户情况-->
  763. <div class="data-panel" id="projectCustomer">
  764. <div class="panel-content-wrapper" >
  765. <div class="panel-header">
  766. <div class="title">项目关联客户情况统计</div>
  767. <div class="panel-select">
  768. <div class="mt-10 inline-16">
  769. <label class="search__label" >部门:</label>
  770. <el-cascader
  771. :append-to-body="false"
  772. ref="selectdep"
  773. size="small"
  774. v-model="customerTableParam.content.dataid"
  775. :options="deplist"
  776. :props="{emitPath:true,expandTrigger:'hover',checkStrictly:true,label:'label',value:'departmentid',children:'children'}"
  777. @change="$event => {if($event.length) {customerMapParam.content.type=1;customerMapParam.content.dataid=$event[$event.length - 1];customerTableParam.content.type=1;customerTableParam.content.username='';customerTableParam.content.pageNumber = 1;$refs.projectCustomerTable.listData();customerInit()} else {customerMapParam.content.type='';customerMapParam.content.dataid='';customerTableParam.content.dataid='';customerTableParam.content.type='';customerTableParam.content.username='';customerTableParam.content.pageNumber = 1;$refs.projectCustomerTable.listData();customerInit()}}"></el-cascader>
  778. </div>
  779. <div class="mt-10 inline-16">
  780. <label class="search__label" >业务员:</label>
  781. <el-select v-model="customerTableParam.content.username" filterable placeholder="请选择" size="small"
  782. :popper-append-to-body="false"
  783. @change="$event => {if($event) {customerMapParam.content.type=0;customerMapParam.content.dataid=$event;customerTableParam.content.type=0;customerTableParam.content.dataid=$event;customerTableParam.content.depname='';customerTableParam.content.pageNumber = 1;$refs.projectCustomerTable.listData();customerInit()} else {customerMapParam.content.type='';customerMapParam.content.dataid='';customerTableParam.content.dataid='';customerTableParam.content.type='';customerTableParam.content.depname='';customerTableParam.content.pageNumber = 1;$refs.projectCustomerTable.listData();customerInit()}}"
  784. >
  785. <el-option
  786. v-for="item in personnelList"
  787. :key="item.index"
  788. :label="item.name"
  789. :value="item.userid">
  790. </el-option>
  791. </el-select>
  792. </div>
  793. <div class="mt-10 inline-15">
  794. <exportFile :param="customerTableParam" :columns="tool.tabelCol($route.name).projectTable.tablecols" fileName="项目关联客户情况统计" :dataid="customerMapParam.content.dataid"></exportFile>
  795. </div>
  796. <div style="display: inline-block;vertical-align: middle">
  797. <FullScroll domId="projectCustomer" @onFull="onFull" @backFull="backFull"></FullScroll>
  798. </div>
  799. </div>
  800. </div>
  801. <div class="panel-content">
  802. <div ref="projectCustomerEl" style="width:30%"></div>
  803. <div class="panel-table" style="width:70%">
  804. <pageTable
  805. ref="projectCustomerTable"
  806. :tablecols="tool.tabelCol($route.name).projectTable.tablecols"
  807. :param="customerTableParam"
  808. :custom="true"
  809. fixedName="operation"
  810. >
  811. <template v-slot:custom="scope">
  812. <div v-if="scope.data.columnname == 'sys_tag'">
  813. <el-tag size="small" v-for="(item,index) in scope.data.data.sys_tag" :key="index">{{ item }}</el-tag>
  814. </div>
  815. <div v-else-if="scope.data.columnname == 'operation'">
  816. <el-button type="text" size="small" @click="goDetail(scope.data.data)" :disabled="isFull">详情</el-button>
  817. </div>
  818. <div v-else-if="scope.data.columnname == 'signamount_due'">
  819. {{ tool.formatAmount(scope.data.data.signamount_due,2,'¥') }}
  820. </div>
  821. <div v-else-if="scope.data.columnname === 'industry'">
  822. <el-tag size="small" v-for="(item,index) in scope.data.data.industry" :key="index">{{ item }}</el-tag>
  823. </div>
  824. <div v-else-if="scope.data.columnname === 'tradingstatus'">
  825. <span style="color:#3874f6" v-if="scope.data.data[[scope.data.columnname]] == '未成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  826. <span style="color:#fa8c16" v-else-if="scope.data.data[[scope.data.columnname]] == '已成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  827. <span style="color:#333333" v-else-if="scope.data.data[[scope.data.columnname]] == '多次成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  828. </div>
  829. <div v-else-if="scope.data.columnname === 'status'">
  830. <span style="color:rgb(250, 140, 22)" v-if="scope.data.data[[scope.data.columnname]] == '已成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  831. <span style="color:#52c41a" v-else-if="scope.data.data[[scope.data.columnname]] == '跟进中'">{{scope.data.data[[scope.data.columnname]]}}</span>
  832. <span style="color:#999999" v-else-if="scope.data.data[[scope.data.columnname]] == '已失败' || scope.data.data[[scope.data.columnname]] == '已结案'">{{scope.data.data[[scope.data.columnname]]}}</span>
  833. </div>
  834. <div v-else-if="scope.data.columnname == 'scale'">
  835. {{scope.data.data.scale ? scope.data.data.scale + scope.data.data.unitname : '' }}
  836. </div>
  837. <div v-else>
  838. {{ scope.data.data[scope.data.columnname] }}
  839. </div>
  840. </template>
  841. </pageTable>
  842. </div>
  843. </div>
  844. </div>
  845. </div>
  846. <!--项目评估情况-->
  847. <div class="data-panel" id="projectScore">
  848. <div class="panel-content-wrapper" >
  849. <div class="panel-header">
  850. <div class="title">项目评估情况统计</div>
  851. <div class="panel-select">
  852. <div class="mt-10 inline-16">
  853. <label class="search__label" >部门:</label>
  854. <el-cascader
  855. :append-to-body="false"
  856. ref="selectdep"
  857. size="small"
  858. v-model="scoreTableParam.content.dataid"
  859. :options="deplist"
  860. :props="{emitPath:true,expandTrigger:'hover',checkStrictly:true,label:'label',value:'departmentid',children:'children'}"
  861. @change="$event => {if($event.length) {scoreMapParam.content.type=1;scoreMapParam.content.dataid=$event[$event.length - 1];scoreTableParam.content.type=1;scoreTableParam.content.username='';scoreTableParam.content.pageNumber = 1;$refs.projectScoreTable.listData();projectScoreInit()} else {scoreMapParam.content.type='';scoreMapParam.content.dataid='';scoreTableParam.content.dataid='';scoreTableParam.content.type='';scoreTableParam.content.username='';scoreTableParam.content.pageNumber = 1;$refs.projectScoreTable.listData();projectScoreInit()}}"></el-cascader>
  862. </div>
  863. <div class="mt-10 inline-16">
  864. <label class="search__label" >业务员:</label>
  865. <el-select v-model="scoreTableParam.content.username" filterable placeholder="请选择" size="small"
  866. :popper-append-to-body="false"
  867. @change="$event => {if($event) {scoreMapParam.content.type=0;scoreMapParam.content.dataid=$event;scoreTableParam.content.type=0;scoreTableParam.content.dataid=$event;scoreTableParam.content.depname='';scoreTableParam.content.pageNumber = 1;$refs.projectScoreTable.listData();projectScoreInit()} else {scoreMapParam.content.type='';scoreMapParam.content.dataid='';scoreTableParam.content.dataid='';scoreTableParam.content.type='';scoreTableParam.content.depname='';scoreTableParam.content.pageNumber = 1;$refs.projectScoreTable.listData();projectScoreInit()}}"
  868. >
  869. <el-option
  870. v-for="item in personnelList"
  871. :key="item.index"
  872. :label="item.name"
  873. :value="item.userid">
  874. </el-option>
  875. </el-select>
  876. </div>
  877. <div class="mt-10 inline-15">
  878. <exportFile :param="scoreTableParam" :columns="tool.tabelCol($route.name).projectTable.tablecols" fileName="项目评估情况统计" :dataid="scoreMapParam.content.dataid"></exportFile>
  879. </div>
  880. <div style="display: inline-block;vertical-align: middle">
  881. <FullScroll domId="projectScore" @onFull="onFull" @backFull="backFull"></FullScroll>
  882. </div>
  883. </div>
  884. </div>
  885. <div class="panel-content">
  886. <div ref="projectScoreEl" style="width:30%"></div>
  887. <div class="panel-table" style="width:70%">
  888. <pageTable
  889. ref="projectScoreTable"
  890. :tablecols="tool.tabelCol($route.name).projectTable.tablecols"
  891. :param="scoreTableParam"
  892. :custom="true"
  893. fixedName="operation"
  894. >
  895. <template v-slot:custom="scope">
  896. <div v-if="scope.data.columnname == 'sys_tag'">
  897. <el-tag size="small" v-for="(item,index) in scope.data.data.sys_tag" :key="index">{{ item }}</el-tag>
  898. </div>
  899. <div v-else-if="scope.data.columnname == 'operation'">
  900. <el-button type="text" size="small" @click="goDetail(scope.data.data)" :disabled="isFull">详情</el-button>
  901. </div>
  902. <div v-else-if="scope.data.columnname == 'signamount_due'">
  903. {{ tool.formatAmount(scope.data.data.signamount_due,2,'¥') }}
  904. </div>
  905. <div v-else-if="scope.data.columnname === 'industry'">
  906. <el-tag size="small" v-for="(item,index) in scope.data.data.industry" :key="index">{{ item }}</el-tag>
  907. </div>
  908. <div v-else-if="scope.data.columnname === 'tradingstatus'">
  909. <span style="color:#3874f6" v-if="scope.data.data[[scope.data.columnname]] == '未成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  910. <span style="color:#fa8c16" v-else-if="scope.data.data[[scope.data.columnname]] == '已成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  911. <span style="color:#333333" v-else-if="scope.data.data[[scope.data.columnname]] == '多次成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  912. </div>
  913. <div v-else-if="scope.data.columnname === 'status'">
  914. <span style="color:rgb(250, 140, 22)" v-if="scope.data.data[[scope.data.columnname]] == '已成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  915. <span style="color:#52c41a" v-else-if="scope.data.data[[scope.data.columnname]] == '跟进中'">{{scope.data.data[[scope.data.columnname]]}}</span>
  916. <span style="color:#999999" v-else-if="scope.data.data[[scope.data.columnname]] == '已失败' || scope.data.data[[scope.data.columnname]] == '已结案'">{{scope.data.data[[scope.data.columnname]]}}</span>
  917. </div>
  918. <div v-else-if="scope.data.columnname == 'scale'">
  919. {{scope.data.data.scale ? scope.data.data.scale + scope.data.data.unitname : '' }}
  920. </div>
  921. <div v-else>
  922. {{ scope.data.data[scope.data.columnname] }}
  923. </div>
  924. </template>
  925. </pageTable>
  926. </div>
  927. </div>
  928. </div>
  929. </div>
  930. <!--有效项目未跟进情况-->
  931. <div class="data-panel" style="height:800px" id="projectUnfllow">
  932. <div class="panel-content-wrapper" >
  933. <div class="panel-header">
  934. <div class="title">有效项目未跟进天数分析</div>
  935. <div class="panel-select">
  936. <div class="mt-10 inline-16">
  937. <label class="search__label" >部门:</label>
  938. <el-cascader
  939. :append-to-body="false"
  940. ref="selectdep"
  941. size="small"
  942. v-model="unfllowTableParam.content.dataid"
  943. :options="deplist"
  944. :props="{emitPath:true,expandTrigger:'hover',checkStrictly:true,label:'label',value:'departmentid',children:'children'}"
  945. @change="$event => {if($event.length) {unfllowMapParam.content.type=1;unfllowMapParam.content.dataid=$event[$event.length - 1];unfllowTableParam.content.type=1;unfllowTableParam.content.username='';unfllowTableParam.content.pageNumber = 1;$refs.customerUnfllowTable.listData();customerUnfllowInit()} else {unfllowMapParam.content.type='';unfllowMapParam.content.dataid='';unfllowTableParam.content.dataid='';unfllowTableParam.content.type='';unfllowTableParam.content.username='';unfllowTableParam.content.pageNumber = 1;$refs.customerUnfllowTable.listData();customerUnfllowInit()}}"></el-cascader>
  946. </div>
  947. <div class="mt-10 inline-16">
  948. <label class="search__label" >业务员:</label>
  949. <el-select v-model="unfllowTableParam.content.username" filterable placeholder="请选择" size="small"
  950. :popper-append-to-body="false"
  951. @change="$event => {if($event) {unfllowMapParam.content.type=0;unfllowMapParam.content.dataid=$event;unfllowTableParam.content.type=0;unfllowTableParam.content.dataid=$event;unfllowTableParam.content.depname='';unfllowTableParam.content.pageNumber = 1;$refs.customerUnfllowTable.listData();customerUnfllowInit()} else {unfllowMapParam.content.type='';unfllowMapParam.content.dataid='';unfllowTableParam.content.dataid='';unfllowTableParam.content.type='';unfllowTableParam.content.depname='';unfllowTableParam.content.pageNumber = 1;$refs.customerUnfllowTable.listData();customerUnfllowInit()}}"
  952. >
  953. <el-option
  954. v-for="item in personnelList"
  955. :key="item.index"
  956. :label="item.name"
  957. :value="item.userid">
  958. </el-option>
  959. </el-select>
  960. </div>
  961. <div class="mt-10 inline-16">
  962. <label class="search__label">项目类型:</label>
  963. <el-select
  964. v-model="unfllowMapParam.content.where.projecttype"
  965. placeholder="请选择项目类型"
  966. :popper-append-to-body="false"
  967. @change="$event => {if($event.length) {unfllowTableParam.content.where.projecttype=$event;unfllowTableParam.content.pageNumber = 1;$refs.customerUnfllowTable.listData();customerUnfllowInit()} else {unfllowTableParam.content.where.projecttype='';$refs.customerUnfllowTable.listData();customerUnfllowInit()}}"
  968. size="small" clearable>
  969. <el-option
  970. v-for="item in projectType"
  971. :key="item.value"
  972. :label="item.value"
  973. :value="item.value">
  974. <span style="float: left">{{ item.value }}</span>
  975. <span style="float: right; color: #8492a6; font-size: 12px">{{ item.remarks?item.remarks:'暂无描述' }}</span>
  976. </el-option>
  977. </el-select>
  978. </div>
  979. <div class="mt-10 inline-16">
  980. <label class="search__label" >分析日期:</label>
  981. <el-date-picker
  982. :append-to-body="false"
  983. v-model="unfllowMapParam.content.enddate"
  984. format="yyyy-MM-dd"
  985. value-format="yyyy-MM-dd"
  986. type="date"
  987. size="small"
  988. placeholder="选择日期"
  989. @change="unfllowTableParam.content.enddate=unfllowMapParam.content.enddate;unfllowTableParam.content.pageNumber = 1;customerUnfllowInit();$refs.customerUnfllowTable.listData()">
  990. </el-date-picker>
  991. </div>
  992. <div class="mt-10 inline-15">
  993. <exportFile :param="unfllowTableParam" :columns="tool.tabelCol($route.name).projectTable1.tablecols.splice(0,tool.tabelCol($route.name).projectTable1.tablecols.length - 1)" fileName="有效项目未跟进天数分析" :dataid="unfllowMapParam.content.dataid"></exportFile>
  994. </div>
  995. <div style="display: inline-block;vertical-align: middle">
  996. <FullScroll domId="projectUnfllow"></FullScroll>
  997. </div>
  998. </div>
  999. </div>
  1000. <div style="height:calc(100% - 55px)">
  1001. <div ref="customerUnfllowEl" style="height:30%"></div>
  1002. <div style="font-size:16px;color:#333333;margin:10px 0">{{ unfllowStatus ? unfllowStatus : '全部' }}</div>
  1003. <div :style="{height:windowWidth>1784?'70%':'65%'}">
  1004. <pageTable
  1005. style="height:calc(100% - 50px)"
  1006. v-if="projectType[0].value != ''"
  1007. ref="customerUnfllowTable"
  1008. :tablecols="tool.tabelCol($route.name).projectTable1.tablecols.splice(0,tool.tabelCol($route.name).projectTable1.tablecols.length - 1)"
  1009. :param="unfllowTableParam"
  1010. :custom="true"
  1011. @handleParam="handleUnfllowParam"
  1012. >
  1013. <template v-slot:custom="scope">
  1014. <div v-if="scope.data.columnname == 'sys_tag'">
  1015. <el-tag size="small" v-for="(item,index) in scope.data.data.sys_tag" :key="index">{{ item }}</el-tag>
  1016. </div>
  1017. <div v-else-if="scope.data.columnname == 'operation'">
  1018. <el-button type="text" size="small" @click="goDetail(scope.data.data)">详情</el-button>
  1019. </div>
  1020. <div v-else-if="scope.data.columnname == 'signamount_due'">
  1021. {{ tool.formatAmount(scope.data.data.signamount_due,2,'¥') }}
  1022. </div>
  1023. <div v-else-if="scope.data.columnname === 'industry'">
  1024. <el-tag size="small" v-for="(item,index) in scope.data.data.industry" :key="index">{{ item }}</el-tag>
  1025. </div>
  1026. <div v-else-if="scope.data.columnname === 'tradingstatus'">
  1027. <span style="color:#3874f6" v-if="scope.data.data[[scope.data.columnname]] == '未成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  1028. <span style="color:#fa8c16" v-else-if="scope.data.data[[scope.data.columnname]] == '已成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  1029. <span style="color:#333333" v-else-if="scope.data.data[[scope.data.columnname]] == '多次成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  1030. </div>
  1031. <div v-else-if="scope.data.columnname === 'status'">
  1032. <span style="color:rgb(250, 140, 22)" v-if="scope.data.data[[scope.data.columnname]] == '已成交'">{{scope.data.data[[scope.data.columnname]]}}</span>
  1033. <span style="color:#52c41a" v-else-if="scope.data.data[[scope.data.columnname]] == '跟进中'">{{scope.data.data[[scope.data.columnname]]}}</span>
  1034. <span style="color:#999999" v-else-if="scope.data.data[[scope.data.columnname]] == '已失败' || scope.data.data[[scope.data.columnname]] == '已结案'">{{scope.data.data[[scope.data.columnname]]}}</span>
  1035. </div>
  1036. <div v-else>
  1037. {{ scope.data.data[scope.data.columnname] }}
  1038. </div>
  1039. </template>
  1040. </pageTable>
  1041. </div>
  1042. </div>
  1043. </div>
  1044. </div>
  1045. <!--项目生命周期分析-->
  1046. <div style="margin-top:16px" class="data-all">
  1047. <div class="panel-header">
  1048. <div class="title">
  1049. 项目生命周期分析
  1050. <el-tooltip class="item" effect="dark" content="统计项目生命周期中的会个关键节点之间平均周期" placement="top">
  1051. <img style="vertical-align: middle" src="@/assets/icons/prompt_icon.svg" alt="">
  1052. </el-tooltip>
  1053. </div>
  1054. </div>
  1055. <div class="progress" v-if="dateList.length">
  1056. <div class="progress-item" :style="[{'--bg':colorArr[index]},{'--width':item.avg}]" v-for="(item,index) in dateList" :key="index">
  1057. <div class="day">平均周期:{{ item.dateavg.toFixed(2) }}天</div>
  1058. <div class="start" v-if="index == 0">
  1059. <span>{{ item.start }}</span>
  1060. <span v-if="item.end == '立项'">项目立项</span>
  1061. <span v-else-if="item.end == '报备'">项目报备审核</span>
  1062. <span v-else-if="item.end == '报价'">项目报价审核</span>
  1063. <span v-else-if="item.end == '合同'">项目合同审核</span>
  1064. <span v-else-if="item.end == '订单'">项目订单审核</span>
  1065. <span v-else-if="item.end == '结案'">项目结案</span>
  1066. </div>
  1067. <div class="end">
  1068. <span>{{ item.end }}</span>
  1069. <span v-if="item.end == '立项'">项目立项</span>
  1070. <span v-else-if="item.end == '报备'">项目报备审核</span>
  1071. <span v-else-if="item.end == '报价'">项目报价审核</span>
  1072. <span v-else-if="item.end == '合同'">项目合同审核</span>
  1073. <span v-else-if="item.end == '订单'">项目订单审核</span>
  1074. <span v-else-if="item.end == '结案'">项目结案</span>
  1075. </div>
  1076. </div>
  1077. </div>
  1078. <el-empty class="progress-item" description="暂无数据" :image-size="80" v-else></el-empty>
  1079. <div class="panel-select" :style="{marginTop:dateList.length?'90px':'30px'}">
  1080. <div class="mt-10 inline-16">
  1081. <label class="search__label" >部门:</label>
  1082. <el-cascader
  1083. clearable
  1084. ref="selectdep"
  1085. size="small"
  1086. v-model="dateParam.content.dataid"
  1087. :options="deplist"
  1088. :props="{emitPath:true,expandTrigger:'hover',checkStrictly:true,label:'label',value:'departmentid',children:'children'}"
  1089. @change="$event => {if($event.length) {[$event.length - 1];dateParam.content.type=1;dateParam.content.username='';getDate()} else {dateParam.content.dataid='';dateParam.content.type='';dateParam.content.username='';getDate()}}"></el-cascader>
  1090. </div>
  1091. <div class="mt-10 inline-16">
  1092. <label class="search__label">项目类型:</label>
  1093. <el-select v-model="dateParam.content.where.projecttype" placeholder="请选择项目类型" @change="getDate" size="small" clearable>
  1094. <el-option
  1095. v-for="item in projectType"
  1096. :key="item.value"
  1097. :label="item.value"
  1098. :value="item.value">
  1099. <span style="float: left">{{ item.value }}</span>
  1100. <span style="float: right; color: #8492a6; font-size: 12px">{{ item.remarks?item.remarks:'暂无描述' }}</span>
  1101. </el-option>
  1102. </el-select>
  1103. </div>
  1104. <div class="mt-10 inline-16">
  1105. <label class="search__label">项目等级:</label>
  1106. <el-select v-model="dateParam.content.where.grade" placeholder="请选择项目等级" @change="getDate" size="small" clearable>
  1107. <el-option
  1108. v-for="item in projectLead"
  1109. :key="item.value"
  1110. :label="item.value"
  1111. :value="item.value">
  1112. <span style="float: left">{{ item.value }}</span>
  1113. <span style="float: right; color: #8492a6; font-size: 12px">{{ item.remarks?item.remarks:'暂无描述' }}</span>
  1114. </el-option>
  1115. </el-select>
  1116. </div>
  1117. <div class="mt-10 inline-16">
  1118. <label class="search__label">领域:</label>
  1119. <el-select v-model="dateParam.content.where.tradefield" placeholder="请选择领域" @change="getDate" size="small" clearable>
  1120. <el-option
  1121. v-for="item in tradefieldSelect"
  1122. :key="item.value"
  1123. :label="item.value"
  1124. :value="item.value">
  1125. <span style="float: left">{{ item.value }}</span>
  1126. <span style="float: right; color: #8492a6; font-size: 12px">{{ item.remarks?item.remarks:'暂无描述' }}</span>
  1127. </el-option>
  1128. </el-select>
  1129. </div>
  1130. </div>
  1131. <div class="mt-10 inline-16" style="margin-top:10px">
  1132. <label class="search__label" >项目名称:</label>
  1133. <selectProject :projectType="projectType" :projectLead="projectLead" :tradefieldSelect="tradefieldSelect" @selectRow="selectRow" ref="selectProject">
  1134. <div slot="input" style="display:flex;align-items:center">
  1135. <el-input v-model="projectname" style="width:300px" size="small" placeholder="请选择项目" @focus="$refs.selectProject.visible=true"></el-input>
  1136. <el-button style="margin-left:10px" @click="clearSelect" size="mini" type="text" v-if="dateParam.content.where.sa_projectid">清空</el-button>
  1137. </div>
  1138. </selectProject>
  1139. </div>
  1140. <div style="margin-top:10px">
  1141. <div class="mt-10 inline-16">
  1142. <label class="search__label">开始节点:</label>
  1143. <el-select v-model="dateParam.content.begnode" placeholder="开始节点" @change="getDate" size="small" clearable>
  1144. <el-option label="立项" value="立项"></el-option>
  1145. <el-option label="报备" value="报备"></el-option>
  1146. <el-option label="报价" value="报价"></el-option>
  1147. <el-option label="合同" value="合同"></el-option>
  1148. <el-option label="订单" value="订单"></el-option>
  1149. <el-option label="结案" value="结案"></el-option>
  1150. </el-select>
  1151. </div>
  1152. <span style="margin:0 35px 0 25px">至</span>
  1153. <div class="mt-10 inline-16">
  1154. <label class="search__label">结束节点:</label>
  1155. <el-select v-model="dateParam.content.endnode" placeholder="结束节点" @change="getDate" size="small" clearable>
  1156. <el-option label="立项" value="立项"></el-option>
  1157. <el-option label="报备" value="报备"></el-option>
  1158. <el-option label="报价" value="报价"></el-option>
  1159. <el-option label="合同" value="合同"></el-option>
  1160. <el-option label="订单" value="订单"></el-option>
  1161. <el-option label="结案" value="结案"></el-option>
  1162. </el-select>
  1163. </div>
  1164. </div>
  1165. </div>
  1166. </div>
  1167. </el-scrollbar>
  1168. </div>
  1169. </template>
  1170. </normalLayout>
  1171. </template>
  1172. <script>
  1173. import { DualAxes,Pie,measureTextWidth,Column,Line,Bar } from '@antv/g2plot'
  1174. import pageTable from './components/pageTable.vue'
  1175. import selectProject from './components/selectProject.vue'
  1176. import borderTemp from '@/HDrpManagement/dataanalysis/components/border.vue'
  1177. import FullScroll from '@/components/fullScroll/index.vue'
  1178. import exportFile from '@/components/export_file/index'
  1179. export default {
  1180. name:'projectData',
  1181. components:{borderTemp,pageTable,selectProject,FullScroll,exportFile},
  1182. data () {
  1183. return {
  1184. isFull:false,
  1185. colorArr:['#3874f6','#00b32b','#ffae02','#f53f3f','#f2f2f2'],
  1186. windowWidth: document.documentElement.clientWidth, //实时屏幕宽度
  1187. deplist:[],
  1188. personnelList:[],
  1189. depmentParam:{
  1190. "id": 20230620102004,
  1191. "content": {
  1192. }
  1193. },
  1194. projectType:[{value:''}],
  1195. projectLead:[],
  1196. tradefieldSelect:[],
  1197. projectname:'',
  1198. projectScoreDescript:[],
  1199. depment:'',
  1200. dataAll:{
  1201. data:{}
  1202. },
  1203. scoreStatus:'',
  1204. unfllowStatus:'',
  1205. person:'',
  1206. //项目类型分析
  1207. typeMap:'',
  1208. typeMapParam: {
  1209. "id": 20231018140404,
  1210. "content": {
  1211. "type": '',
  1212. "username":JSON.parse(sessionStorage.getItem('accountinfo')).name,
  1213. "dataid": '',
  1214. "where":{
  1215. "projecttype":""
  1216. }
  1217. }
  1218. },
  1219. typeTableParam:{
  1220. "id": 20231019090104,
  1221. "content": {
  1222. "type": '',
  1223. "dataid": '',
  1224. "username":JSON.parse(sessionStorage.getItem('accountinfo')).name,
  1225. "where": {
  1226. // "isfollowup": "", // 有跟进 无跟进 ------项目跟进情况统计列表使用该字段
  1227. // "grade": "", // 项目等级统计列表使用该字段
  1228. // "iscontacts": "", //无联系人 有联系人 ------项目联系人情况统计列表使用该字段
  1229. // "iscustomers": "", //无关联客户 有关联客户 ------项目关联客户情况统计列表使用该字段
  1230. // "istask":"",// 有评估记录 无评估记录 ------ 项目评估情况统计列表使用该字段
  1231. "projecttype":""// 项目类型分析统计列表使用该最低端
  1232. }
  1233. }
  1234. },
  1235. typeData:{
  1236. map:[],
  1237. },
  1238. //项目等级分析
  1239. gradMap:'',
  1240. gradMapParam: {
  1241. "id": 20231018141804,
  1242. "content": {
  1243. "type": '',
  1244. "dataid": '',
  1245. "username":JSON.parse(sessionStorage.getItem('accountinfo')).name,
  1246. "where":{
  1247. "grade":""
  1248. }
  1249. }
  1250. },
  1251. gradTableParam:{
  1252. "id": 20231019090104,
  1253. "content": {
  1254. "type": '',
  1255. "dataid": '',
  1256. "username":JSON.parse(sessionStorage.getItem('accountinfo')).name,
  1257. "where": {
  1258. "grade": "", // 项目等级统计列表使用该字段
  1259. }
  1260. }
  1261. },
  1262. gradData:{
  1263. map:[],
  1264. },
  1265. //项目评估分析
  1266. scoreMap:'',
  1267. scoreMapParam1: {
  1268. "id": 20231024103104,
  1269. "content": {
  1270. "type": '',
  1271. "dataid": '',
  1272. "username":JSON.parse(sessionStorage.getItem('accountinfo')).name,
  1273. }
  1274. },
  1275. scoreTableParam1:{
  1276. "id": 20231024112004,
  1277. "content": {
  1278. "type": "",
  1279. "dataid": "",
  1280. "occupancyratio":"",
  1281. "username":JSON.parse(sessionStorage.getItem('accountinfo')).name,
  1282. "where":{
  1283. "taskType":""
  1284. },
  1285. "pageSize":20,
  1286. "pageNumber":1
  1287. }
  1288. },
  1289. scoreData:{
  1290. map:[],
  1291. },
  1292. //项目12月新增分析
  1293. addMap:'',
  1294. addParam: {
  1295. "id": 20231018155804,
  1296. "content": {
  1297. "username":JSON.parse(sessionStorage.getItem('accountinfo')).name,
  1298. "type": '',
  1299. "dataid": '',
  1300. "enddate":`${new Date().getFullYear()}-${new Date().getMonth() + 1}-${new Date().getDate()}`
  1301. }
  1302. },
  1303. addData: {
  1304. arr1:[],
  1305. arr2:[]
  1306. },
  1307. //项目12月报备分析
  1308. baobeiMap:'',
  1309. baobeiParam: {
  1310. "id": 20231018160504,
  1311. "content": {
  1312. "type": '',
  1313. "enddate":`${new Date().getFullYear()}-${new Date().getMonth() + 1}-${new Date().getDate()}`,
  1314. "username":JSON.parse(sessionStorage.getItem('accountinfo')).name,
  1315. "dataid": '',
  1316. }
  1317. },
  1318. baobeiData: {
  1319. arr1:[],
  1320. arr2:[]
  1321. },
  1322. //项目12月跟进分析
  1323. fllowMap:'',
  1324. fllowParam: {
  1325. "id": 20231018163004,
  1326. "content": {
  1327. "type": '',
  1328. "username":JSON.parse(sessionStorage.getItem('accountinfo')).name,
  1329. "enddate":`${new Date().getFullYear()}-${new Date().getMonth() + 1}-${new Date().getDate()}`,
  1330. "dataid": '',
  1331. }
  1332. },
  1333. fllowData: {
  1334. },
  1335. //项目12月报价分析
  1336. baojiaMap:'',
  1337. baojiaParam: {
  1338. "id": 20231018161604,
  1339. "content": {
  1340. "type": '',
  1341. "username":JSON.parse(sessionStorage.getItem('accountinfo')).name,
  1342. "enddate":`${new Date().getFullYear()}-${new Date().getMonth() + 1}-${new Date().getDate()}`,
  1343. "dataid": '',
  1344. }
  1345. },
  1346. baojiaData: {
  1347. },
  1348. //项目跟进分析
  1349. /* projectFllowMap:'',*/
  1350. fllowMapParam: {
  1351. "id": 20231019085304,
  1352. "content": {
  1353. "type": '',
  1354. "username":JSON.parse(sessionStorage.getItem('accountinfo')).name,
  1355. "dataid": '',
  1356. "enddate":`${new Date().getFullYear()}-${new Date().getMonth() + 1}-${new Date().getDate()}`,
  1357. "where":{
  1358. "grade":""
  1359. }
  1360. }
  1361. },
  1362. fllowTableParam:{
  1363. "id": 20231019090104,
  1364. "content": {
  1365. "type": '',
  1366. "username":JSON.parse(sessionStorage.getItem('accountinfo')).name,
  1367. "dataid": '',
  1368. "where": {
  1369. "isfollowup": "", // 有跟进 无跟进 ------项目跟进情况统计列表使用该字段
  1370. }
  1371. }
  1372. },
  1373. projectFllowData:{
  1374. map:[],
  1375. },
  1376. //项目联系人分析
  1377. projectFllowMap:'',
  1378. contactMapParam: {
  1379. "id": 20231019085404,
  1380. "content": {
  1381. "type": '',
  1382. "dataid": '',
  1383. "username":JSON.parse(sessionStorage.getItem('accountinfo')).name,
  1384. "where":{
  1385. "grade":""
  1386. }
  1387. }
  1388. },
  1389. contactTableParam:{
  1390. "id": 20231019090104,
  1391. "content": {
  1392. "type": '',
  1393. "dataid": '',
  1394. "username":JSON.parse(sessionStorage.getItem('accountinfo')).name,
  1395. "where": {
  1396. "iscontacts": "", //无联系人 有联系人 ------项目联系人情况统计列表使用该字段
  1397. }
  1398. }
  1399. },
  1400. projectContactData:{
  1401. map:[],
  1402. },
  1403. //项目关联客户分析
  1404. projectCustomerMap:'',
  1405. customerMapParam: {
  1406. "id": 20231019085504,
  1407. "content": {
  1408. "type": '',
  1409. "dataid": '',
  1410. "username":JSON.parse(sessionStorage.getItem('accountinfo')).name,
  1411. "where":{
  1412. "iscustomers":""
  1413. }
  1414. }
  1415. },
  1416. customerTableParam:{
  1417. "id": 20231019090104,
  1418. "content": {
  1419. "type": '',
  1420. "dataid": '',
  1421. "username":JSON.parse(sessionStorage.getItem('accountinfo')).name,
  1422. "where": {
  1423. "iscustomers": "", //无关联客户 有关联客户 ------项目关联客户情况统计列表使用该字段
  1424. }
  1425. }
  1426. },
  1427. projectCustomerData:{
  1428. map:[],
  1429. },
  1430. //项目评估分析
  1431. projectScoreMap:'',
  1432. scoreMapParam: {
  1433. "id": 20231019085604,
  1434. "content": {
  1435. "type": '',
  1436. "dataid": '',
  1437. "username":JSON.parse(sessionStorage.getItem('accountinfo')).name,
  1438. "where":{
  1439. "istask":""
  1440. }
  1441. }
  1442. },
  1443. scoreTableParam:{
  1444. "id": 20231019090104,
  1445. "content": {
  1446. "type": '',
  1447. "username":JSON.parse(sessionStorage.getItem('accountinfo')).name,
  1448. "dataid": '',
  1449. "where": {
  1450. "istask":"",// 有评估记录 无评估记录 ------ 项目评估情况统计列表使用该字段
  1451. }
  1452. }
  1453. },
  1454. projectScoreData:{
  1455. map:[],
  1456. },
  1457. //未跟进情况
  1458. customerUnfllowMap:'',
  1459. unfllowMapParam: {
  1460. "id": 20231019095804,
  1461. "content": {
  1462. "type": '',
  1463. "username":JSON.parse(sessionStorage.getItem('accountinfo')).name,
  1464. "dataid": '',
  1465. "where": {
  1466. "projecttype":""
  1467. }
  1468. }
  1469. },
  1470. unfllowTableParam:{
  1471. "id": 20231019095904,
  1472. "content": {
  1473. "type": '',
  1474. "dataid": '',
  1475. "username":JSON.parse(sessionStorage.getItem('accountinfo')).name,
  1476. "where": {
  1477. "projecttype":"",
  1478. "dateType":""
  1479. }
  1480. }
  1481. },
  1482. customerUnfllowData:{
  1483. map:[],
  1484. },
  1485. //项目周期分析
  1486. dateParam: {
  1487. "id": 20231023092304,
  1488. "content": {
  1489. "type": 1,
  1490. "dataid": '',
  1491. "username":JSON.parse(sessionStorage.getItem('accountinfo')).name,
  1492. "begnode":"",//开始节点
  1493. "endnode":"",//结束节点
  1494. "where": {
  1495. "projecttype": "",//项目类型
  1496. "grade":"",//项目等级
  1497. "tradefield":"",//领域
  1498. "sa_projectid":""//项目id
  1499. }
  1500. }
  1501. },
  1502. dateList:{}
  1503. }
  1504. },
  1505. methods:{
  1506. goDetail (data) {
  1507. this.$router.push({
  1508. path:'/projectChangeDetail',
  1509. query:{
  1510. id:data.sa_projectid,
  1511. }
  1512. })
  1513. this.$store.dispatch('changeDetailDrawer',true)
  1514. },
  1515. //获取数据总览
  1516. async getdataAll () {
  1517. let res = await this.$api.requested({
  1518. id:20231018110404,
  1519. content:{}
  1520. })
  1521. this.dataAll = res.data
  1522. console.log(this.dataAll,'数据总览');
  1523. },
  1524. async departmentrtment() {
  1525. const res = await this.$api.requested(this.depmentParam)
  1526. this.deplist = this.createMenu(res.data.dep)
  1527. this.personnelList = res.data.hr
  1528. },
  1529. //12月跟进初始化
  1530. async chart2Fun (init) {
  1531. let res = await this.$api.requested(this.chartParam2)
  1532. console.log(res.data,'近12月跟进');
  1533. this.chartMapData = res.data
  1534. if (init) {
  1535. this.chartMap = new DualAxes(this.$refs.chart2, {
  1536. data: [this.chartMapData.followup, this.chartMapData.tbzzl],
  1537. xField: 'date',
  1538. yField: ['value', 'value'],
  1539. geometryOptions: [
  1540. {
  1541. geometry: 'line',
  1542. seriesField:'key',
  1543. color: '#5B8FF9',
  1544. },
  1545. {
  1546. geometry: 'line',
  1547. seriesField:'key',
  1548. color: '#5AD8A6',
  1549. },
  1550. ],
  1551. });
  1552. this.chartMap.render();
  1553. } else {
  1554. this.chartMap.changeData([this.chartMapData.followup, this.chartMapData.tbzzl])
  1555. }
  1556. },
  1557. //项目类型图初始化
  1558. async typeInit (init) {
  1559. let res = await this.$api.requested(this.typeMapParam)
  1560. this.typeData.map = res.data
  1561. console.log(this.typeData.map,'项目类型数据');
  1562. if (init) {
  1563. this.typeMap = new Pie(this.$refs.typeEl, {
  1564. appendPadding: 10,
  1565. data:this.typeData.map,
  1566. angleField: 'ratio',
  1567. colorField: 'key',
  1568. radius: 1,
  1569. innerRadius: 0.64,
  1570. label:{
  1571. formatter: (datum) => `${datum.ratio}%`
  1572. },
  1573. tooltip:{
  1574. formatter: (datum) => {
  1575. return { name: datum.key, value: datum.ratio + '%' };
  1576. },
  1577. },
  1578. statistic: {
  1579. title: {
  1580. offsetY: -4,
  1581. style: {
  1582. fontSize:'16px'
  1583. },
  1584. content:'项目总数'
  1585. },
  1586. content: {
  1587. offsetY: 4,
  1588. style: {
  1589. whiteSpace: 'pre-wrap',
  1590. overflow: 'hidden',
  1591. textOverflow: 'ellipsis',
  1592. fontSize:'16px'
  1593. },
  1594. customHtml: (container, view, datum, data) => {
  1595. const text = data[0].totalqty
  1596. return text
  1597. },
  1598. },
  1599. },
  1600. legend: {
  1601. position:'left'
  1602. },
  1603. // 添加 中心统计文本 交互
  1604. interactions: [{ type: 'element-single-selected' },{ type: 'element-active' }],
  1605. });
  1606. this.typeMap.on('element:click',(v) => {
  1607. if (v.data.data.value != this.typeTableParam.content.where.projecttype) {
  1608. this.typeTableParam.content.where.projecttype = v.data.data.value
  1609. this.typeTableParam.content.pageNumber = 1
  1610. this.$refs.typeTable.listData()
  1611. } else {
  1612. this.typeTableParam.content.where.projecttype = ''
  1613. this.typeTableParam.content.pageNumber = 1
  1614. this.$refs.typeTable.listData()
  1615. }
  1616. })
  1617. this.typeMap.render();
  1618. } else {
  1619. this.typeMap.changeData(this.typeData.map)
  1620. }
  1621. },
  1622. //项目等级图初始化
  1623. async gradInit (init) {
  1624. let res = await this.$api.requested(this.gradMapParam)
  1625. this.gradData.map = res.data
  1626. console.log(this.gradData.map,'项目等级数据');
  1627. if (init) {
  1628. this.gradMap = new Pie(this.$refs.gradEl, {
  1629. appendPadding: 10,
  1630. data:this.gradData.map,
  1631. angleField: 'ratio',
  1632. colorField: 'key',
  1633. radius: 1,
  1634. innerRadius: 0.64,
  1635. label:{
  1636. formatter: (datum) => `${datum.ratio}%`
  1637. },
  1638. tooltip:{
  1639. formatter: (datum) => {
  1640. return { name: datum.key, value: datum.ratio + '%' };
  1641. },
  1642. },
  1643. statistic: {
  1644. title: {
  1645. offsetY: -4,
  1646. style: {
  1647. fontSize:'16px'
  1648. },
  1649. content:'项目总数'
  1650. },
  1651. content: {
  1652. offsetY: 4,
  1653. style: {
  1654. whiteSpace: 'pre-wrap',
  1655. overflow: 'hidden',
  1656. textOverflow: 'ellipsis',
  1657. fontSize:'16px'
  1658. },
  1659. customHtml: (container, view, datum, data) => {
  1660. const text = data[0].totalqty
  1661. return text
  1662. },
  1663. },
  1664. },
  1665. legend: {
  1666. position:'left'
  1667. },
  1668. // 添加 中心统计文本 交互
  1669. interactions: [{ type: 'element-selected' },{ type: 'element-active' }],
  1670. });
  1671. this.gradMap.on('element:click',(v) => {
  1672. if (v.data.data.key != this.gradTableParam.content.where.grade) {
  1673. this.gradTableParam.content.where.grade = v.data.data.key
  1674. this.gradTableParam.content.pageNumber = 1
  1675. this.$refs.gradTable.listData()
  1676. } else {
  1677. this.gradTableParam.content.where.grade = ''
  1678. this.gradTableParam.content.pageNumber = 1
  1679. this.$refs.gradTable.listData()
  1680. }
  1681. })
  1682. this.gradMap.render();
  1683. } else {
  1684. this.gradMap.changeData(this.gradData.map)
  1685. }
  1686. },
  1687. //项目评估图初始化
  1688. async scoreInit (init) {
  1689. let res = await this.$api.requested(this.scoreMapParam1)
  1690. this.scoreData.map = res.data
  1691. if (init) {
  1692. this.scoreMap = new Bar(this.$refs.scoreEl, {
  1693. data:this.scoreData.map,
  1694. xField: 'value',
  1695. yField: 'key',
  1696. seriesField: 'key',
  1697. minBarWidth: 20,
  1698. maxBarWidth: 40,
  1699. legend: {
  1700. position: 'top-left',
  1701. },
  1702. interactions: [{ type: 'element-single-selected' }],
  1703. });
  1704. this.scoreMap.on('element:click',(v) => {
  1705. if (v.data.data.key != this.scoreTableParam1.content.occupancyratio) {
  1706. this.scoreStatus = v.data.data.key
  1707. this.scoreTableParam1.content.occupancyratio = v.data.data.key
  1708. this.scoreTableParam1.content.pageNumber = 1
  1709. this.$refs.scoreTable.listData()
  1710. } else {
  1711. this.scoreStatus = ''
  1712. this.scoreTableParam1.content.occupancyratio = ''
  1713. this.scoreTableParam1.content.pageNumber = 1
  1714. this.$refs.scoreTable.listData()
  1715. }
  1716. })
  1717. this.scoreMap.render();
  1718. } else {
  1719. this.scoreMap.changeData(this.scoreData.map)
  1720. }
  1721. },
  1722. //12月新增初始化
  1723. async addFun (init) {
  1724. let param = JSON.parse(JSON.stringify(this.addParam))
  1725. if (param.content.dataid instanceof Array) {
  1726. param.content.dataid = param.content.dataid[param.content.dataid.length - 1]
  1727. }
  1728. let res = await this.$api.requested(param)
  1729. this.addData.arr1 = res.data.histogram
  1730. res.data.lineChart.forEach(item => item[`同比增长率`] = item.value)
  1731. this.addData.arr2 = res.data.lineChart
  1732. if (init) {
  1733. this.addMap = new DualAxes(this.$refs.addEl, {
  1734. data: [this.addData.arr1,this.addData.arr2],
  1735. xField: 'date',
  1736. yField: ['value', '同比增长率'],
  1737. geometryOptions: [
  1738. {
  1739. geometry: 'column',
  1740. isGroup: true,
  1741. seriesField: 'key',
  1742. },
  1743. {
  1744. geometry: 'line',
  1745. lineStyle: {
  1746. lineWidth: 2,
  1747. },
  1748. },
  1749. ],
  1750. tooltip: {
  1751. formatter: (datum) => {
  1752. return { name: datum.key?datum.key:'同比增长率', value: datum.key? datum.value : datum.同比增长率 + '%'};
  1753. },
  1754. },
  1755. });
  1756. this.addMap.render()
  1757. } else {
  1758. this.addMap.changeData([this.addData.arr1,this.addData.arr2])
  1759. }
  1760. },
  1761. //12月报备初始化
  1762. async baobeiFun (init) {
  1763. let param = JSON.parse(JSON.stringify(this.baobeiParam))
  1764. if (param.content.dataid instanceof Array) {
  1765. param.content.dataid = param.content.dataid[param.content.dataid.length - 1]
  1766. }
  1767. let res = await this.$api.requested(param)
  1768. this.baobeiData.arr1 = res.data.histogram
  1769. res.data.lineChart.forEach(item => item[`同比增长率`] = item.value)
  1770. this.baobeiData.arr2 = res.data.lineChart
  1771. if (init) {
  1772. this.baobeiMap = new DualAxes(this.$refs.baobeiEl, {
  1773. data: [this.baobeiData.arr1,this.baobeiData.arr2],
  1774. xField: 'date',
  1775. yField: ['value', '同比增长率'],
  1776. geometryOptions: [
  1777. {
  1778. geometry: 'column',
  1779. isGroup: true,
  1780. seriesField: 'key',
  1781. },
  1782. {
  1783. geometry: 'line',
  1784. lineStyle: {
  1785. lineWidth: 2,
  1786. },
  1787. },
  1788. ],
  1789. tooltip: {
  1790. formatter: (datum) => {
  1791. return { name: datum.key?datum.key:'同比增长率', value: datum.key? datum.value : datum.同比增长率 + '%'};
  1792. },
  1793. },
  1794. });
  1795. this.baobeiMap.render()
  1796. } else {
  1797. this.baobeiMap.changeData([this.baobeiData.arr1,this.baobeiData.arr2])
  1798. }
  1799. },
  1800. //12月跟进初始化
  1801. async fllowFun (init) {
  1802. let param = JSON.parse(JSON.stringify(this.fllowParam))
  1803. if (param.content.dataid instanceof Array) {
  1804. param.content.dataid = param.content.dataid[param.content.dataid.length - 1]
  1805. }
  1806. let res = await this.$api.requested(param)
  1807. this.fllowData = res.data
  1808. this.fllowData.tbzzl.forEach(item => item.key = '同比增长率')
  1809. console.log(res.data,'跟进数据');
  1810. if (init) {
  1811. this.fllowMap = new DualAxes(this.$refs.fllowEl, {
  1812. data: [this.fllowData.followup, this.fllowData.tbzzl],
  1813. xField: 'date',
  1814. yField: ['value', 'value'],
  1815. geometryOptions: [
  1816. {
  1817. geometry: 'column',
  1818. seriesField:'key',
  1819. isGroup: 'true',
  1820. color: '#5B8FF9',
  1821. },
  1822. {
  1823. geometry: 'line',
  1824. seriesField:'key',
  1825. color: '#5AD8A6',
  1826. },
  1827. ],
  1828. tooltip: {
  1829. formatter: (datum) => {
  1830. return { name: datum.key, value: datum.key == '同比增长率'? datum.value + '%' : datum.value };
  1831. },
  1832. },
  1833. })
  1834. this.fllowMap.render()
  1835. } else {
  1836. this.fllowMap.changeData([this.fllowData.followup, this.fllowData.tbzzl])
  1837. }
  1838. },
  1839. //12月报价初始化
  1840. async baojiaFun (init) {
  1841. let param = JSON.parse(JSON.stringify(this.baojiaParam))
  1842. if (param.content.dataid instanceof Array) {
  1843. param.content.dataid = param.content.dataid[param.content.dataid.length - 1]
  1844. }
  1845. let res = await this.$api.requested(param)
  1846. this.baojiaData = res.data
  1847. console.log(res.data,'报价数据');
  1848. if (init) {
  1849. this.baojiaMap = new Line(this.$refs.baojiaEl, {
  1850. data:this.baojiaData,
  1851. xField: 'date',
  1852. yField: 'value',
  1853. seriesField: 'key',
  1854. xAxis: {
  1855. type: 'time',
  1856. },
  1857. yAxis: {
  1858. // label: {
  1859. // // 数值格式化为千分位
  1860. // formatter: (v) => `${v}`.replace(/\d{1,3}(?=(\d{3})+$)/g, (s) => `${s},`),
  1861. // },
  1862. },
  1863. })
  1864. this.baojiaMap.render()
  1865. } else {
  1866. this.baojiaMap.changeData(this.baojiaData)
  1867. }
  1868. },
  1869. //项目跟进图初始化
  1870. async fllowInit (init) {
  1871. let res = await this.$api.requested(this.fllowMapParam)
  1872. this.projectFllowData.map = res.data
  1873. console.log(this.projectFllowData.map,'项目跟进数据');
  1874. if (init) {
  1875. this.projectFllowMap = new Pie(this.$refs.projectFllowEl, {
  1876. appendPadding: 10,
  1877. data:this.projectFllowData.map,
  1878. angleField: 'ratio',
  1879. colorField: 'key',
  1880. radius: 1,
  1881. innerRadius: 0.64,
  1882. label:{
  1883. formatter: (datum) => `${datum.ratio}%`
  1884. },
  1885. tooltip:{
  1886. formatter: (datum) => {
  1887. return { name: datum.key, value: datum.ratio + '%' };
  1888. },
  1889. },
  1890. statistic: {
  1891. title: {
  1892. offsetY: -4,
  1893. style: {
  1894. fontSize:'16px'
  1895. },
  1896. content:'项目总数'
  1897. },
  1898. content: {
  1899. offsetY: 4,
  1900. style: {
  1901. whiteSpace: 'pre-wrap',
  1902. overflow: 'hidden',
  1903. textOverflow: 'ellipsis',
  1904. fontSize:'16px'
  1905. },
  1906. customHtml: (container, view, datum, data) => {
  1907. const text = data[0].totalqty
  1908. return text
  1909. },
  1910. },
  1911. },
  1912. legend: {
  1913. position:'left'
  1914. },
  1915. // 添加 中心统计文本 交互
  1916. interactions: [{ type: 'element-selected' },{ type: 'element-active' }],
  1917. });
  1918. this.projectFllowMap.on('element:click',(v) => {
  1919. if (v.data.data.value != this.fllowTableParam.content.where.isfollowup) {
  1920. this.fllowTableParam.content.where.isfollowup = v.data.data.value
  1921. this.fllowTableParam.content.pageNumber = 1
  1922. this.$refs.projectFllowTable.listData()
  1923. } else {
  1924. this.fllowTableParam.content.where.isfollowup = ''
  1925. this.fllowTableParam.content.pageNumber = 1
  1926. this.$refs.projectFllowTable.listData()
  1927. }
  1928. })
  1929. this.projectFllowMap.render();
  1930. } else {
  1931. this.projectFllowMap.changeData(this.projectFllowData.map)
  1932. }
  1933. },
  1934. //项目联系人图初始化
  1935. async contactInit (init) {
  1936. let res = await this.$api.requested(this.contactMapParam)
  1937. this.projectContactData.map = res.data
  1938. console.log(this.projectContactData.map,'项目联系人数据');
  1939. if (init) {
  1940. this.projectContactMap = new Pie(this.$refs.projectContactEl, {
  1941. appendPadding: 10,
  1942. data:this.projectContactData.map,
  1943. angleField: 'ratio',
  1944. colorField: 'key',
  1945. radius: 1,
  1946. innerRadius: 0.64,
  1947. label:{
  1948. formatter: (datum) => `${datum.ratio}%`
  1949. },
  1950. tooltip:{
  1951. formatter: (datum) => {
  1952. return { name: datum.key, value: datum.ratio + '%' };
  1953. },
  1954. },
  1955. statistic: {
  1956. title: {
  1957. offsetY: -4,
  1958. style: {
  1959. fontSize:'16px'
  1960. },
  1961. content:'项目总数'
  1962. },
  1963. content: {
  1964. offsetY: 4,
  1965. style: {
  1966. whiteSpace: 'pre-wrap',
  1967. overflow: 'hidden',
  1968. textOverflow: 'ellipsis',
  1969. fontSize:'16px'
  1970. },
  1971. customHtml: (container, view, datum, data) => {
  1972. const text = data[0].totalqty
  1973. return text
  1974. },
  1975. },
  1976. },
  1977. legend: {
  1978. position:'left'
  1979. },
  1980. // 添加 中心统计文本 交互
  1981. interactions: [{ type: 'element-selected' },{ type: 'element-active' }],
  1982. });
  1983. this.projectContactMap.on('element:click',(v) => {
  1984. if (v.data.data.key != this.contactTableParam.content.where.iscontacts) {
  1985. this.contactTableParam.content.where.iscontacts = v.data.data.key
  1986. this.contactTableParam.content.pageNumber = 1
  1987. this.$refs.projectContactTable.listData()
  1988. } else {
  1989. this.contactTableParam.content.where.iscontacts = ''
  1990. this.contactTableParam.content.pageNumber = 1
  1991. this.$refs.projectContactTable.listData()
  1992. }
  1993. })
  1994. this.projectContactMap.render();
  1995. } else {
  1996. this.projectContactMap.changeData(this.projectContactData.map)
  1997. }
  1998. },
  1999. //项目关联客户图初始化
  2000. async customerInit (init) {
  2001. let res = await this.$api.requested(this.customerMapParam)
  2002. this.projectCustomerData.map = res.data
  2003. console.log(this.projectCustomerData.map,'项目关联客户数据');
  2004. if (init) {
  2005. this.projectCustomerMap = new Pie(this.$refs.projectCustomerEl, {
  2006. appendPadding: 10,
  2007. data:this.projectCustomerData.map,
  2008. angleField: 'ratio',
  2009. colorField: 'key',
  2010. radius: 1,
  2011. innerRadius: 0.64,
  2012. label:{
  2013. formatter: (datum) => `${datum.ratio}%`
  2014. },
  2015. tooltip:{
  2016. formatter: (datum) => {
  2017. return { name: datum.key, value: datum.ratio + '%' };
  2018. },
  2019. },
  2020. statistic: {
  2021. title: {
  2022. offsetY: -4,
  2023. style: {
  2024. fontSize:'16px'
  2025. },
  2026. content:'项目总数'
  2027. },
  2028. content: {
  2029. offsetY: 4,
  2030. style: {
  2031. whiteSpace: 'pre-wrap',
  2032. overflow: 'hidden',
  2033. textOverflow: 'ellipsis',
  2034. fontSize:'16px'
  2035. },
  2036. customHtml: (container, view, datum, data) => {
  2037. const text = data[0].totalqty
  2038. return text
  2039. },
  2040. },
  2041. },
  2042. legend: {
  2043. position:'left'
  2044. },
  2045. // 添加 中心统计文本 交互
  2046. interactions: [{ type: 'element-selected' },{ type: 'element-active' }],
  2047. });
  2048. this.projectCustomerMap.on('element:click',(v) => {
  2049. if (v.data.data.key != this.customerTableParam.content.where.iscustomers) {
  2050. this.customerTableParam.content.where.iscustomers = v.data.data.key
  2051. this.customerTableParam.content.pageNumber = 1
  2052. this.$refs.projectCustomerTable.listData()
  2053. } else {
  2054. this.customerTableParam.content.where.iscustomers = ''
  2055. this.customerTableParam.content.pageNumber = 1
  2056. this.$refs.projectCustomerTable.listData()
  2057. }
  2058. })
  2059. this.projectCustomerMap.render();
  2060. } else {
  2061. this.projectCustomerMap.changeData(this.projectCustomerData.map)
  2062. }
  2063. },
  2064. //项目评估图初始化
  2065. async projectScoreInit (init) {
  2066. let res = await this.$api.requested(this.scoreMapParam)
  2067. this.projectScoreData.map = res.data
  2068. console.log(this.projectScoreData.map,'项目评估数据');
  2069. if (init) {
  2070. this.projectScoreMap = new Pie(this.$refs.projectScoreEl, {
  2071. appendPadding: 10,
  2072. data:this.projectScoreData.map,
  2073. angleField: 'ratio',
  2074. colorField: 'key',
  2075. radius: 1,
  2076. innerRadius: 0.64,
  2077. label:{
  2078. formatter: (datum) => `${datum.ratio}%`
  2079. },
  2080. tooltip:{
  2081. formatter: (datum) => {
  2082. return { name: datum.key, value: datum.ratio + '%' };
  2083. },
  2084. },
  2085. statistic: {
  2086. title: {
  2087. offsetY: -4,
  2088. style: {
  2089. fontSize:'16px'
  2090. },
  2091. content:'项目总数'
  2092. },
  2093. content: {
  2094. offsetY: 4,
  2095. style: {
  2096. whiteSpace: 'pre-wrap',
  2097. overflow: 'hidden',
  2098. textOverflow: 'ellipsis',
  2099. fontSize:'16px'
  2100. },
  2101. customHtml: (container, view, datum, data) => {
  2102. const text = data[0].totalqty
  2103. return text
  2104. },
  2105. },
  2106. },
  2107. legend: {
  2108. position:'left'
  2109. },
  2110. // 添加 中心统计文本 交互
  2111. interactions: [{ type: 'element-highlight-by-x ' },{ type: 'element-active' }],
  2112. });
  2113. this.projectScoreMap.on('element:click',(v) => {
  2114. if (v.data.data.key != this.scoreTableParam.content.where.istask) {
  2115. this.scoreTableParam.content.where.istask = v.data.data.key
  2116. this.scoreTableParam.content.pageNumber = 1
  2117. this.$refs.projectScoreTable.listData()
  2118. } else {
  2119. this.scoreTableParam.content.where.istask = ''
  2120. this.scoreTableParam.content.pageNumber = 1
  2121. this.$refs.projectScoreTable.listData()
  2122. }
  2123. })
  2124. this.projectScoreMap.render();
  2125. } else {
  2126. this.projectScoreMap.changeData(this.projectScoreData.map)
  2127. }
  2128. },
  2129. async getDate (init) {
  2130. if(init === true) this.dateParam.content.where.projecttype = this.projectType.length ? this.projectType[0].value : ''
  2131. let param = JSON.parse(JSON.stringify(this.dateParam))
  2132. if (param.content.dataid instanceof Array) {
  2133. param.content.dataid = param.content.dataid[param.content.dataid.length - 1]
  2134. }
  2135. let res = await this.$api.requested(param)
  2136. this.dateList = res.data
  2137. console.log(this.dateList,'周期数据');
  2138. },
  2139. //项目未跟进情况图初始化
  2140. async customerUnfllowInit (init) {
  2141. let res = await this.$api.requested(this.unfllowMapParam)
  2142. this.customerUnfllowData.map = res.data
  2143. console.log(this.customerUnfllowData,'未跟进数据');
  2144. if (init) {
  2145. this.customerUnfllowMap = new Column(this.$refs.customerUnfllowEl, {
  2146. data:this.customerUnfllowData.map,
  2147. isGroup: true,
  2148. xField: 'datetype',
  2149. yField: 'value',
  2150. seriesField: 'key',
  2151. /** 设置颜色 */
  2152. //color: ['#1ca9e6', '#f88c24'],
  2153. /** 设置间距 */
  2154. // marginRatio: 0.1,
  2155. label: {
  2156. // 可手动配置 label 数据标签位置
  2157. position: 'middle', // 'top', 'middle', 'bottom'
  2158. // 可配置附加的布局方法
  2159. layout: [
  2160. // 柱形图数据标签位置自动调整
  2161. { type: 'interval-adjust-position' },
  2162. // 数据标签防遮挡
  2163. { type: 'interval-hide-overlap' },
  2164. // 数据标签文颜色自动调整
  2165. { type: 'adjust-color' },
  2166. ],
  2167. },
  2168. interactions: [{ type: 'element-highlight-by-x' }],
  2169. });
  2170. this.customerUnfllowMap.on('element:click',(v) => {
  2171. console.log(v);
  2172. if (v.data.data.datetype == this.unfllowTableParam.content.where.dateType) {
  2173. this.unfllowStatus = ''
  2174. this.unfllowTableParam.content.where.dateType = ''
  2175. this.unfllowTableParam.content.pageNumber = 1
  2176. } else {
  2177. this.unfllowStatus = v.data.data.datetype
  2178. this.unfllowTableParam.content.where.dateType = v.data.data.datetype
  2179. this.unfllowTableParam.content.pageNumber = 1
  2180. }
  2181. this.$refs.customerUnfllowTable.listData()
  2182. })
  2183. this.customerUnfllowMap.render()
  2184. } else {
  2185. this.customerUnfllowMap.changeData(this.customerUnfllowData.map)
  2186. }
  2187. },
  2188. renderStatistic(containerWidth, text, style) {
  2189. const textWidth = measureTextWidth(text, style);
  2190. const textHeight = style.lineHeight || style.fontSize
  2191. const R = containerWidth / 2;
  2192. // r^2 = (w / 2)^2 + (h - offsetY)^2
  2193. let scale = 1;
  2194. if (containerWidth < textWidth) {
  2195. scale = Math.min(Math.sqrt(Math.abs(Math.pow(R, 2) / (Math.pow(textWidth / 2, 2) + Math.pow(textHeight, 2)))), 1);
  2196. }
  2197. const textStyleStr = `width:${containerWidth}px;`;
  2198. return `<div style="${textStyleStr};font-size:${scale}em;line-height:${scale < 1 ? 1 : 'inherit'};">${text}</div>`;
  2199. },
  2200. async getProjectScoreDescript () {
  2201. let res = await this.$api.requested({
  2202. "id": 20231101091904,
  2203. "content": {}
  2204. })
  2205. this.projectScoreDescript = res.data
  2206. console.log(this.projectScoreDescript,'评估描述');
  2207. },
  2208. createMenu (array) {
  2209. var that = this
  2210. let arr = []
  2211. function convertToElementTree(node) {
  2212. // 新节点
  2213. if (node.subdep.length === 0){
  2214. var elNode = {
  2215. label: node["depname"],
  2216. parentid:node['parentid'],
  2217. parentname:node['parentname'],
  2218. departmentid:node["departmentid"],
  2219. value:node["departmentid"],
  2220. remarks:node["remarks"],
  2221. isused:node["isused"],
  2222. changedate:node['changedate'],
  2223. changeby:node['changeby'],
  2224. createdate:node['createdate'],
  2225. createby:node['createby'],
  2226. depno:node['depno'],
  2227. disabled:that.pageOnlyRead,
  2228. }
  2229. }else {
  2230. var elNode = {
  2231. label: node["depname"],
  2232. parentid:node['parentid'],
  2233. parentname:node['parentname'],
  2234. departmentid:node["departmentid"],
  2235. value:node["departmentid"],
  2236. remarks:node["remarks"],
  2237. isused:node["isused"],
  2238. changedate:node['changedate'],
  2239. changeby:node['changeby'],
  2240. createdate:node['createdate'],
  2241. createby:node['createby'],
  2242. depno:node['depno'],
  2243. disabled:that.pageOnlyRead,
  2244. children: []
  2245. }
  2246. }
  2247. if (node.subdep && node.subdep.length > 0) {
  2248. // 如果存在子节点
  2249. for (var index = 0; index < node.subdep.length; index++) {
  2250. // 遍历子节点, 把每个子节点看做一颗独立的树, 传入递归构造子树, 并把结果放回到新node的children中
  2251. elNode.children.push(convertToElementTree(node.subdep[index]));
  2252. }
  2253. }
  2254. return elNode;
  2255. }
  2256. array.forEach((element) => {
  2257. arr.push(convertToElementTree(element))
  2258. });
  2259. return arr
  2260. },
  2261. selectDep (val) {
  2262. let id = val[val.length - 1]
  2263. if (val.length) {
  2264. /*项目类型分析*/
  2265. this.typeMapParam.content.dataid = id
  2266. this.typeMapParam.content.type = 1
  2267. this.typeInit()
  2268. this.typeTableParam.content.dataid = id
  2269. this.typeTableParam.content.type = 1
  2270. this.typeTableParam.content.username = ''
  2271. this.$refs.typeTable.listData()
  2272. /*项目等级分析*/
  2273. this.gradMapParam.content.dataid = id
  2274. this.gradMapParam.content.type = 1
  2275. this.gradInit()
  2276. this.gradTableParam.content.dataid = id
  2277. this.gradTableParam.content.type = 1
  2278. this.gradTableParam.content.username = ''
  2279. this.$refs.gradTable.listData()
  2280. /*项目评估分析*/
  2281. this.scoreMapParam1.content.dataid = id
  2282. this.scoreMapParam1.content.type = 1
  2283. this.scoreInit()
  2284. this.scoreTableParam1.content.dataid = id
  2285. this.scoreTableParam1.content.type = 1
  2286. this.scoreTableParam1.content.username = ''
  2287. this.$refs.scoreTable.listData()
  2288. /*近12月项目新增分析*/
  2289. this.addParam.content.dataid = id
  2290. this.addParam.content.type = 1
  2291. this.addParam.content.username = ''
  2292. this.addFun()
  2293. /*近12月项目报备分析*/
  2294. this.baobeiParam.content.dataid = id
  2295. this.baobeiParam.content.type = 1
  2296. this.baobeiParam.content.username = ''
  2297. this.baobeiFun()
  2298. /*近12月项目跟进分析*/
  2299. this.fllowParam.content.dataid = id
  2300. this.fllowParam.content.type = 1
  2301. this.fllowParam.content.username = ''
  2302. this.fllowFun()
  2303. /*近12月项目报价分析*/
  2304. this.baojiaParam.content.dataid = id
  2305. this.baojiaParam.content.type = 1
  2306. this.baojiaParam.content.username = ''
  2307. this.baojiaFun()
  2308. /*近12月项目跟进分析*/
  2309. this.fllowMapParam.content.dataid = id
  2310. this.fllowMapParam.content.type = 1
  2311. this.fllowInit()
  2312. this.fllowTableParam.content.dataid = id
  2313. this.fllowTableParam.content.type = 1
  2314. this.fllowTableParam.content.username = ''
  2315. this.$refs.projectFllowTable.listData()
  2316. /*项目联系人情况统计*/
  2317. this.contactMapParam.content.dataid = id
  2318. this.contactMapParam.content.type = 1
  2319. this.contactInit()
  2320. this.contactTableParam.content.dataid = id
  2321. this.contactTableParam.content.type = 1
  2322. this.contactTableParam.content.username = ''
  2323. this.$refs.projectContactTable.listData()
  2324. /*项目关联客户情况统计*/
  2325. this.customerMapParam.content.dataid = id
  2326. this.customerMapParam.content.type = 1
  2327. this.customerInit()
  2328. this.customerTableParam.content.dataid = id
  2329. this.customerTableParam.content.type = 1
  2330. this.customerTableParam.content.username = ''
  2331. this.$refs.projectCustomerTable.listData()
  2332. /*项目评估情况统计*/
  2333. this.scoreMapParam.content.dataid = id
  2334. this.scoreMapParam.content.type = 1
  2335. this.projectScoreInit()
  2336. this.scoreTableParam.content.dataid = id
  2337. this.scoreTableParam.content.type = 1
  2338. this.scoreTableParam.content.username = ''
  2339. this.$refs.projectScoreTable.listData()
  2340. /*有效项目未跟进天数分析*/
  2341. this.unfllowMapParam.content.dataid = id
  2342. this.unfllowMapParam.content.type = 1
  2343. this.customerUnfllowInit()
  2344. this.unfllowTableParam.content.dataid = id
  2345. this.unfllowTableParam.content.type = 1
  2346. this.unfllowTableParam.content.username = ''
  2347. this.$refs.customerUnfllowTable.listData()
  2348. /*项目生命周期分析*/
  2349. this.dateParam.content.dataid = id
  2350. this.dateParam.content.type = 1
  2351. this.dateParam.content.username = ''
  2352. this.getDate()
  2353. } else {
  2354. /*项目类型分析*/
  2355. let name = JSON.parse(sessionStorage.getItem('accountinfo')).name
  2356. this.typeMapParam.content.dataid = ''
  2357. this.typeMapParam.content.type = ''
  2358. this.typeInit()
  2359. this.typeTableParam.content.dataid = ''
  2360. this.typeTableParam.content.type = ''
  2361. this.typeTableParam.content.username = name
  2362. this.$refs.typeTable.listData()
  2363. /*项目等级分析*/
  2364. this.gradMapParam.content.dataid = ''
  2365. this.gradMapParam.content.type = ''
  2366. this.gradInit()
  2367. this.gradTableParam.content.dataid = ''
  2368. this.gradTableParam.content.type = ''
  2369. this.gradTableParam.content.username = name
  2370. this.$refs.gradTable.listData()
  2371. /*项目评估分析*/
  2372. this.scoreMapParam1.content.dataid = ''
  2373. this.scoreMapParam1.content.type = ''
  2374. this.scoreInit()
  2375. this.scoreTableParam1.content.dataid = ''
  2376. this.scoreTableParam1.content.type = ''
  2377. this.scoreTableParam1.content.username = name
  2378. this.$refs.scoreTable.listData()
  2379. /*近12月项目新增分析*/
  2380. this.addParam.content.dataid = ''
  2381. this.addParam.content.type = ''
  2382. this.addParam.content.username = name
  2383. this.addFun()
  2384. /*近12月项目报备分析*/
  2385. this.baobeiParam.content.dataid = ''
  2386. this.baobeiParam.content.type = ''
  2387. this.baobeiParam.content.username = name
  2388. this.baobeiFun()
  2389. /*近12月项目跟进分析*/
  2390. this.fllowParam.content.dataid = ''
  2391. this.fllowParam.content.type = ''
  2392. this.fllowParam.content.username = name
  2393. this.fllowFun()
  2394. /*近12月项目报价分析*/
  2395. this.baojiaParam.content.dataid = ''
  2396. this.baojiaParam.content.type = ''
  2397. this.baojiaParam.content.username = name
  2398. this.baojiaFun()
  2399. /*近12月项目跟进分析*/
  2400. this.fllowMapParam.content.dataid = ''
  2401. this.fllowMapParam.content.type = ''
  2402. this.fllowInit()
  2403. this.fllowTableParam.content.dataid = ''
  2404. this.fllowTableParam.content.type = ''
  2405. this.fllowTableParam.content.username = name
  2406. this.$refs.projectFllowTable.listData()
  2407. /*项目联系人情况统计*/
  2408. this.contactMapParam.content.dataid = ''
  2409. this.contactMapParam.content.type = ''
  2410. this.contactInit()
  2411. this.contactTableParam.content.dataid = ''
  2412. this.contactTableParam.content.type = ''
  2413. this.contactTableParam.content.username = name
  2414. this.$refs.projectContactTable.listData()
  2415. /*项目关联客户情况统计*/
  2416. this.customerMapParam.content.dataid = ''
  2417. this.customerMapParam.content.type = ''
  2418. this.customerInit()
  2419. this.customerTableParam.content.dataid = ''
  2420. this.customerTableParam.content.type = ''
  2421. this.customerTableParam.content.username = name
  2422. this.$refs.projectCustomerTable.listData()
  2423. /*项目评估情况统计*/
  2424. this.scoreMapParam.content.dataid = ''
  2425. this.scoreMapParam.content.type = ''
  2426. this.projectScoreInit()
  2427. this.scoreTableParam.content.dataid = ''
  2428. this.scoreTableParam.content.type = ''
  2429. this.scoreTableParam.content.username = name
  2430. this.$refs.projectScoreTable.listData()
  2431. /*有效项目未跟进天数分析*/
  2432. this.unfllowMapParam.content.dataid = ''
  2433. this.unfllowMapParam.content.type = ''
  2434. this.customerUnfllowInit()
  2435. this.unfllowTableParam.content.dataid = ''
  2436. this.unfllowTableParam.content.type = ''
  2437. this.unfllowTableParam.content.username = name
  2438. this.$refs.customerUnfllowTable.listData()
  2439. /*项目生命周期分析*/
  2440. this.dateParam.content.dataid = ''
  2441. this.dateParam.content.type = ''
  2442. this.dateParam.content.username = name
  2443. this.getDate()
  2444. }
  2445. },
  2446. selectRow (data) {
  2447. this.projectname = data.projectname
  2448. this.dateParam.content.where.sa_projectid = data.sa_projectid
  2449. this.dateParam.content.type = ''
  2450. this.dateParam.content.dataid = ''
  2451. this.dateParam.content.where.projecttype = ''
  2452. this.dateParam.content.where.grade = ''
  2453. this.dateParam.content.where.tradefield = ''
  2454. this.getDate()
  2455. },
  2456. clearSelect () {
  2457. this.projectname=''
  2458. this.dateParam.content.where.sa_projectid=''
  2459. this.dateParam.content.where.projecttype = this.projectType.length ? this.projectType[0].value : ''
  2460. this.getDate()
  2461. },
  2462. handleUnfllowParam (param) {
  2463. console.log('触发',param,this.projectType);
  2464. param.content.where.projecttype = this.projectType.length ? this.projectType[0].value : ''
  2465. this.unfllowMapParam.content.where.projecttype = this.projectType.length ? this.projectType[0].value : ''
  2466. },
  2467. /*全屏*/
  2468. onFull(){
  2469. this.isFull = true
  2470. },
  2471. /*退出全屏*/
  2472. backFull(){
  2473. this.isFull = false
  2474. }
  2475. },
  2476. async mounted () {
  2477. this.getProjectScoreDescript()
  2478. this.departmentrtment()
  2479. this.getdataAll()
  2480. this.typeInit(true)
  2481. this.gradInit(true)
  2482. this.scoreInit(true)
  2483. this.addFun(true)
  2484. this.baobeiFun(true)
  2485. this.fllowFun(true)
  2486. this.baojiaFun(true)
  2487. this.fllowInit(true)
  2488. this.contactInit(true)
  2489. this.projectScoreInit(true)
  2490. this.customerInit(true)
  2491. this.customerUnfllowInit(true)
  2492. let baseWidth = 1920
  2493. document.querySelector('html').style.fontSize = `${100 / baseWidth}vw`
  2494. /* 获取项目类型 */
  2495. let res = await this.$store.dispatch('optiontypeselect','projecttype')
  2496. this.projectType = res.data
  2497. this.getDate(true)
  2498. /* 获取项目等级 */
  2499. let res2 = await this.$store.dispatch('optiontypeselect','projectgrade')
  2500. this.projectLead = res2.data
  2501. let res3 = await this.$store.dispatch('optiontypeselect','tradefield')
  2502. this.tradefieldSelect = res3.data
  2503. var that = this;
  2504. // <!--把window.onresize事件挂在到mounted函数上-->
  2505. window.onresize = () => {
  2506. return (() => {
  2507. window.fullWidth = document.documentElement.clientWidth;
  2508. that.windowWidth = window.fullWidth; // 宽
  2509. console.log(that.windowWidth,'屏幕宽度')
  2510. })()
  2511. };
  2512. }
  2513. }
  2514. </script>
  2515. <style>
  2516. .basic__layout__panel {
  2517. height: 100% !important;
  2518. }
  2519. </style>
  2520. <style scoped>
  2521. *{
  2522. box-sizing: border-box;
  2523. }
  2524. .data-all {
  2525. padding: 16px;
  2526. width: 100%;
  2527. border-radius: 5rem;
  2528. border: 1rem;
  2529. box-shadow: 0rem 2rem 5rem 0rem rgba(0, 0, 0, 0.15);
  2530. background: #FFFFFF;
  2531. margin-top: 16px;
  2532. }
  2533. .data-all .data-left {
  2534. border-right: 1rem solid rgb(136,136,146);
  2535. display: flex;
  2536. flex-wrap: wrap;
  2537. }
  2538. .data-all .data-right {
  2539. padding-left: 100rem;
  2540. display: flex;
  2541. flex-wrap: wrap;
  2542. }
  2543. .data-all .data-left,.data-right {
  2544. display: flex;
  2545. }
  2546. .data-all .data-item {
  2547. width: 186rem;
  2548. margin-bottom: 20px;
  2549. }
  2550. .data-all .data-item p:nth-child(1) {
  2551. font-size: 26px;
  2552. font-weight: 5px;
  2553. font-family: 'ArialMT', 'Arial', sans-serif;
  2554. color: rgba(0, 0, 0, 0.85);
  2555. }
  2556. .data-all .data-item p:nth-child(2) {
  2557. font-size: 14px;
  2558. font-weight: 5px;
  2559. font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
  2560. color: rgba(0, 0, 0, 0.65)
  2561. }
  2562. .data-all .data-all-wrapper {
  2563. display: flex;
  2564. }
  2565. .data-panel {
  2566. padding: 16px;
  2567. margin-top: 16px;
  2568. height: 500px;
  2569. border-radius: 5rem;
  2570. border: 1rem;
  2571. box-shadow: 0rem 2rem 5rem 0rem rgba(0, 0, 0, 0.15);
  2572. background: #FFFFFF;
  2573. }
  2574. .panel-header {
  2575. display: flex;
  2576. justify-content: space-between;
  2577. align-items: center;
  2578. margin-bottom: 10px;
  2579. }
  2580. .title {
  2581. min-width: 220px;
  2582. }
  2583. .title::before {
  2584. content:'';
  2585. border-left: 4px #3874f6 solid;
  2586. padding-right: 10px;
  2587. }
  2588. .panel-content {
  2589. display: flex;
  2590. align-items: center;
  2591. justify-content: space-between;
  2592. background:#ffffff;
  2593. height: calc(100% - 55px);
  2594. }
  2595. .panel-content-wrapper {
  2596. height: 100%;
  2597. background:#ffffff;
  2598. }
  2599. .panel-content div:first-child {
  2600. padding: 0 5px;
  2601. }
  2602. .progress {
  2603. display: flex;
  2604. width: 100%;
  2605. padding: 40rem 100rem;
  2606. height: 50rem;
  2607. margin-bottom: 60rem;
  2608. }
  2609. .progress::after {
  2610. content:'';
  2611. display: block;
  2612. clear:both;
  2613. }
  2614. .progress .progress-item {
  2615. flex:var(--width);
  2616. min-width: 150rem;
  2617. height: 50rem;
  2618. position: relative;
  2619. background:var(--bg);
  2620. }
  2621. .progress .progress-item .day {
  2622. position: absolute;
  2623. top: -40rem;
  2624. left: 50%;
  2625. font-size: 14rem;
  2626. transform: translateX(-50%);
  2627. white-space: nowrap;
  2628. }
  2629. .progress .progress-item .start {
  2630. position: absolute;
  2631. left: 0;
  2632. bottom:-50rem;
  2633. transform: translateX(-50%);
  2634. }
  2635. .progress .progress-item .end {
  2636. position: absolute;
  2637. right:0;
  2638. bottom:-50rem;
  2639. transform: translateX(50%);
  2640. }
  2641. .progress .progress-item .start,.end {
  2642. display: flex;
  2643. flex-direction: column;
  2644. }
  2645. .progress .progress-item .start,.end span {
  2646. text-align: center;
  2647. }
  2648. .progress .progress-item .start span:first-child,.end span:first-child {
  2649. font-size: 14rem;
  2650. }
  2651. .progress .progress-item .start span:last-child,.end span:last-child {
  2652. margin-top: 10rem;
  2653. color: #aaaaaa;
  2654. font-size: 12rem;
  2655. }
  2656. .search__label {
  2657. margin-right: 5px !important;
  2658. }
  2659. .mt-10 {
  2660. margin-right: 16px !important;
  2661. }
  2662. .el-empty {
  2663. padding: 0 !important;
  2664. }
  2665. .panel-table {
  2666. height: 100%;
  2667. }
  2668. </style>