assets.vue 42 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138
  1. <template>
  2. <div style="height: calc(100% - 44.5px);padding: 0px 10px 10px;box-sizing: border-box;">
  3. <div class="hanson-bar">
  4. <div style="float:right;overflow:hidden;">
  5. <!-- <span style="width:20px;float:left;display:block;height:20px;cursor: pointer;" @click="changeAssetsFalg">
  6. <i v-if="!onlyRead" class="el-icon-fa el-icon-fa-eye"></i>
  7. </span> -->
  8. <span>当前筛选条件下共{{page.total || '--'}}资产</span>
  9. </div>
  10. <el-select v-model="onlyRead" @change="getHeaderData(mess)"
  11. style="width:100px;margin-right:20px;vertical-align:bottom;">
  12. <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
  13. </el-select>
  14. <el-select v-model="showType" @change="initTable" style="width:130px;margin-right:10px;vertical-align:bottom;">
  15. <el-option v-for="item in showTypes" :key="item.value" :label="item.label" :value="item.value"></el-option>
  16. </el-select>
  17. <el-button size="small" style="width: 80px;" @click="addDevice" icon="iconfont icon-tianjia">添加资产</el-button>
  18. <el-button size="small" style="width: 80px;" @click="reset" icon="iconfont icon-shuaxin">刷新</el-button>
  19. <el-button v-show="!onlyRead" size="small" style="width: 80px;" @click="undo" icon="iconfont icon-undo">撤销
  20. </el-button>
  21. </div>
  22. <qrcode :qrcodeUrl="qrcodeUrl" :dialog="myDialog" :addBody="true" ref="qrcode"/>
  23. <firm ref="firm" :mess="mess" @changeFirm="firmChange" :dialog="myDialog"/>
  24. <supply-dialog @change="supplyChange" ref="supply" :id="id" :dialog="myDialog"/>
  25. <supplier-dialog ref="supplier" @changeSupplier="supplierChange" :dialog="myDialog"/>
  26. <guarantee-dialog @change="guaranteeChange" :id="id" ref="guarantee" :dialog="myDialog"/>
  27. <upload-files-dialog
  28. :read="onlyRead ? true : false"
  29. ref="upload"
  30. @changeFile="fileChange"
  31. :keysArr="filesArr"
  32. :dialog="myDialog"
  33. />
  34. <upload-img-dialog
  35. :read="onlyRead ? true : false"
  36. @changeFile="imgChange"
  37. :keysArr="imgsArr"
  38. :dialog="myDialog"
  39. />
  40. <maintainer-dialog
  41. @changeMaintainer="changeMaintainer"
  42. ref="maintainer"
  43. :dialog="myDialog"
  44. />
  45. <insurer-dialog
  46. @changeInsurer="changeInsurer"
  47. ref="insurer"
  48. :dialog="myDialog"
  49. />
  50. <pic-dialog :read="onlyRead ? true : false" :dialog="myDialog" :keysArr="picsArr" @change="changePics"/>
  51. <div class="center middle_sty" style="height: 91%" v-show="!mess.deviceId && (!tableData || !tableData.length)">
  52. <p>
  53. <i class="icon-wushuju iconfont"></i>
  54. 请选择设备族
  55. </p>
  56. </div>
  57. <div class="center middle_sty" style="height: 91%" v-show="mess.deviceId && (!tableData || !tableData.length)">
  58. <p>
  59. <i class="icon-wushuju iconfont"></i>
  60. 暂无数据
  61. </p>
  62. </div>
  63. <div v-show="mess.deviceId && tableData && tableData.length" v-loading="loading" id="handsontable"
  64. ref="handsontable"></div>
  65. <div v-show="tableData && tableData.length" class='right'>
  66. <my-pagination @change="getTableData" :page="page"/>
  67. </div>
  68. <!-- <dialog-assets :assetType="[this.mess.deviceId]" @close="closeDialog" ref="assets" v-if="myDialog.addDevice" :dialog="myDialog" ></dialog-assets> -->
  69. <!-- <details-dialog :iframeSrc="iframeSrc" v-if="myDialog.details" :dialog="myDialog"></details-dialog> -->
  70. <look-pic :dialog="myDialog" :keysArr="picsArr"/>
  71. <!-- 不支持的输入方式 -->
  72. <el-dialog title="临时维护信息点" :visible.sync="myDialog.update" @close="handleCloseUpdate" width="670px">
  73. <el-row>
  74. 该信息点未定义对应组件,现在维护数据不确定后续是否可用。如确实需要维护,请点击
  75. <el-link @click="updateInputShow = true" type="primary" :underline="false">继续维护</el-link>
  76. </el-row>
  77. <el-row style="margin-top:20px;" v-show="updateInputShow">
  78. <el-input type="textarea" :autosize="{ minRows: 4, maxRows: 8}" placeholder="请输入内容"
  79. v-model="updateInput"></el-input>
  80. </el-row>
  81. <span slot="footer" class="dialog-footer">
  82. <el-button @click="myDialog.update = false">取 消</el-button>
  83. <el-button type="primary" @click="handleClickUpdate">确 认</el-button>
  84. </span>
  85. </el-dialog>
  86. <!-- 新增资产 -->
  87. <el-dialog class="add-assets" :title="showAddByDie?'未关联资产的设备批量创建资产':'确定新增资产类型'" @close="showAddByDie = false"
  88. :visible.sync="myDialog.addDevice"
  89. width="670px">
  90. <el-row>
  91. <my-cascader v-show="!showAddByDie" ref="cascader" :all="true" @change="changeCader"></my-cascader>
  92. <die-cascader v-show="showAddByDie" ref="dieCascader" :Family="addData.Family"
  93. @change="changeDevice"></die-cascader>
  94. <floor-cascader v-show="showAddByDie" @change="changeFloor"></floor-cascader>
  95. <div class="die-text" v-show="showAddByDie">当前筛选条件下有<span class="die-num">{{dieNum}}</span>个设备可批量创建资产。</div>
  96. <el-link v-show="showAddByDie && dieNum" type="primary" :underline="false" @click="toDetaiPage"
  97. style="margin-left:10px;">查看详情
  98. </el-link>
  99. </el-row>
  100. <span slot="footer" class="dialog-footer">
  101. <el-button v-show="!showAddByDie" type="primary" @click="toAddbyDie">批量创建</el-button>
  102. <el-button v-show="!showAddByDie" type="primary" @click="toAddDevice">手动添加</el-button>
  103. <el-button v-show="showAddByDie" type="primary" @click="showAddByDie = false">返回</el-button>
  104. <el-button v-show="showAddByDie" type="primary" :disabled="dieNum == 0" @click="createByDie">批量创建</el-button>
  105. </span>
  106. </el-dialog>
  107. </div>
  108. </template>
  109. <script>
  110. import {
  111. BeatchQueryParam,
  112. countPartsDie,
  113. createPropertys,
  114. deleteProperty,
  115. getDataDictionary,
  116. propertyLinkEq,
  117. updateProperty
  118. } from "@/api/scan/request";
  119. import tools from "@/utils/scan/tools"
  120. import handsonUtils from "@/utils/scan/hasontableUtils"
  121. import showTools from "@/utils/handsontable/notShow"
  122. import buildFloor from '@/utils/handsontable/buildFloorData'
  123. import qrcode from "@/components/business_space/lib/qrcode"
  124. import firm from "@/components/business_space/dialogs/list/firm"
  125. import supplyDialog from "@/components/business_space/dialogs/list/supplyDialog"
  126. import supplierDialog from "@/components/business_space/dialogs/list/supplierDialog"
  127. import maintainerDialog from "@/components/business_space/dialogs/list/maintainerDialog"
  128. import insurerDialog from "@/components/business_space/dialogs/list/insurerDialog"
  129. import guaranteeDialog from "@/components/business_space/dialogs/list/guaranteeDialog"
  130. import uploadFilesDialog from "@/components/business_space/dialogs/list/filesDialog"
  131. import uploadImgDialog from "@/components/business_space/dialogs/list/uploadImgDialog"
  132. // import detailsDialog from "@/components/business_space/lib/detailsDia"
  133. import picDialog from "@/components/business_space/dialogs/list/picDialog"
  134. import myPagination from "@/components/common/myPagination"
  135. import myCascader from "@/components/ledger/lib/assets"
  136. import floorCascader from "@/components/ledger/lib/floorCascader"
  137. import dieCascader from "@/components/ledger/lib/partsDieList"
  138. import {mapGetters} from "vuex"
  139. //图片查看
  140. import lookPic from "@/components/ledger/lib/lookImages"
  141. import Handsontable from "handsontable-pro"
  142. import 'handsontable-pro/dist/handsontable.full.css'
  143. //下拉插件
  144. // import "@/assets/js/chosen.jquery.min";
  145. // import "@/assets/js/handsontable-chosen-editor";
  146. export default {
  147. components: {
  148. qrcode, //二维码页面
  149. firm, //
  150. supplyDialog,
  151. supplierDialog,
  152. guaranteeDialog,
  153. uploadFilesDialog,
  154. maintainerDialog,
  155. insurerDialog,
  156. uploadImgDialog,
  157. picDialog,
  158. myPagination,
  159. // dialogAssets,
  160. myCascader,
  161. floorCascader,
  162. dieCascader,
  163. // detailsDialog,
  164. lookPic
  165. },
  166. created() {
  167. buildFloor.getData(this.buildFloorData)
  168. },
  169. computed: {
  170. ...mapGetters("layout", ["projectId", "secret", "userId"]),
  171. showTypes() {
  172. return this.onlyRead ?
  173. [{value: "Visible", label: '只看采集信息'}, {value: "all", label: '全部'}] :
  174. [{value: "partInfo", label: '隐藏信息点'}, {value: "Visible", label: '只看采集信息'}, {value: "all", label: '全部'}]
  175. }
  176. },
  177. data() {
  178. return {
  179. options: [{
  180. value: true,
  181. label: '只读模式'
  182. }, {
  183. value: false,
  184. label: '编辑模式'
  185. }],
  186. buildFloorData: [], //楼层数据
  187. tableData: [],
  188. mess: {},
  189. tableHeader: null,
  190. page: {
  191. size: 50,
  192. sizes: [10, 30, 50, 100, 150, 200],
  193. total: 0,
  194. currentPage: 1
  195. },
  196. myDialog: {
  197. qrcode: false, //二维码弹窗
  198. firm: false, //厂商弹窗
  199. supply: false, //选择供应合同
  200. supplier: false, //供应商选择
  201. guarantee: false, //选择保单
  202. maintainer: false, //选择维修商
  203. insurer: false, //选择保险公司
  204. uploadFiles: false,//上传文件
  205. uploadImgs: false,//上传单个图片
  206. pic: false, //多个图片
  207. addDevice: false,//添加资产
  208. systemType: false,//关联系统
  209. details: false,//详情页
  210. changeRea: false,//关联资产
  211. lookPic: false,//图片查看
  212. update: false,//临时维护信息点
  213. },
  214. row: null, //被修改的row
  215. filesArr: [], //保存临时的文件key
  216. messKey: null,
  217. imgsArr: [], //临时保存的图片key数组
  218. picsArr: [], //临时资产图片keys数组
  219. copyMain: null,
  220. graphyId: null,
  221. assetGroupList: [],
  222. iframeSrc: "",
  223. id: 0,
  224. onlyRead: true,
  225. showType: 'Visible',
  226. linkNameFalg: false,
  227. qrcodeUrl: "", //二维码图片地址
  228. loading: false,
  229. deviceType: {}, //族3位编码及名称
  230. floorData: [],
  231. curDevice: '',//当前点击的资产id
  232. showAddByDie: false,//是否显示通过设备添加资产页面
  233. addData: {}, //添加资产选择的资产类型
  234. numParams: { // 查询设备部件数量条件
  235. category: '',
  236. buildId: '',
  237. floorId: '',
  238. Family: ''
  239. },
  240. dieNum: 0, // 查询设备部件数量
  241. inputMap: {
  242. flowBuild: {
  243. InputMode: 'D1',
  244. Editable:true,
  245. InfoPointCode:"flowBuild",
  246. InfoPointName:"建筑楼层",
  247. Path:"flowBuild"
  248. }
  249. }, //信息点和输入方式映射表
  250. updateInputShow: false, //是否显示临时维护输入框
  251. updateInfoPoint: '',//临时维护信息点
  252. updateInput: '', //临时维护信息点值
  253. };
  254. },
  255. methods: {
  256. //获取表头
  257. getHeaderData(code) {
  258. this.page.currentPage = 1
  259. this.mess = code
  260. if (this.mess.deviceId) {
  261. let params = {
  262. data: {
  263. Orders: "sort asc, InfoPointName desc",
  264. PageNumber: 1,
  265. PageSize: 1000
  266. },
  267. type: this.mess.deviceId
  268. };
  269. getDataDictionary(params, res => {
  270. this.tableHeader = res.Content;
  271. this.tableHeader.forEach(item => {
  272. if (item.Path && item.InputMode) {
  273. this.inputMap[item.Path] = item.InputMode
  274. }
  275. })
  276. this.getTableData()
  277. });
  278. }
  279. },
  280. //获取主体数据
  281. getTableData() {
  282. this.loading = true
  283. //type存在发送请求
  284. if (!!this.mess.deviceId) {
  285. let param = {
  286. PageSize: this.page.size,
  287. Orders: "createTime desc, EquipLocalName desc, EquipLocalID desc, EquipID desc",
  288. PageNumber: this.page.currentPage,
  289. Filters: `Family='${this.mess.deviceId}'`
  290. }
  291. if (this.mess.buildId == "noKnow") {
  292. param.Filters += `;buildingId isNull`
  293. } else if (this.mess.buildId && this.mess.buildId != "all") {
  294. param.Filters += `;buildingId='${this.mess.buildId}'`
  295. }
  296. if (this.mess.floorId == "noKnow") {
  297. param.Filters += `;floorId isNull`
  298. } else if (this.mess.floorId && this.mess.floorId != "all") {
  299. param.Filters += `;floorId='${this.mess.floorId}'`
  300. }
  301. propertyLinkEq(param, res => {
  302. this.loading = false
  303. this.tableData = res.Content.map((item) => {
  304. if (item.hasOwnProperty("BuildingId") && item.hasOwnProperty("FloorId")) {
  305. item.flowBuild = item.BuildingId + "-" + item.FloorId
  306. } else if (item.hasOwnProperty("BuildingId") && !item.hasOwnProperty("FloorId")) {
  307. item.flowBuild = item.BuildingId
  308. }
  309. return item
  310. })
  311. this.copyMain = tools.deepCopy(this.tableData)
  312. this.page.total = res.Total
  313. if (this.tableData && this.tableData.length) {
  314. // if (this.onlyRead) {
  315. // this.getBatch(this.tableData)
  316. // }
  317. this.initTable()
  318. }
  319. })
  320. }
  321. },
  322. //获取动态参数
  323. getBatch(data) {
  324. let param = {
  325. secret: this.secret,
  326. ProjId: this.projectId,
  327. data: {
  328. criterias: []
  329. }
  330. };
  331. this.tableHeader.map(head => {
  332. if (
  333. head.InputMode == "L" ||
  334. head.InputMode == "L1" ||
  335. head.InputMode == "L2" ||
  336. head.InputMode == "M"
  337. ) {
  338. data.map(item => {
  339. let cur = tools.dataForKey(item, head.Path);
  340. if (cur) {
  341. param.data.criterias.push({
  342. id: item.EquipID,
  343. code: head.InfoPointCode
  344. });
  345. }
  346. });
  347. }
  348. });
  349. if (param.data.criterias.length) {
  350. BeatchQueryParam(param, res => {
  351. this.tableData = data.map(item => {
  352. res.Content.map(child => {
  353. if (item.EquipID == child.id) {
  354. if (child.data || child.data == 0) {
  355. this.tableHeader.map(head => {
  356. if (head.InfoPointCode == child.code) {
  357. tools.setDataForKey(item, head.Path, child.data);
  358. }
  359. });
  360. } else {
  361. this.tableHeader.map(head => {
  362. if (head.InfoPointCode == child.code) {
  363. tools.setDataForKey(
  364. item,
  365. head.Path,
  366. // child.error ? "表号功能号格式错误" : "表号功能号不存在"
  367. child.error ? child.value ? "表号功能号格式错误" : "表号功能号不存在" : "暂未采集到实时数据"
  368. );
  369. }
  370. });
  371. }
  372. }
  373. });
  374. return item;
  375. });
  376. this.hot.loadData(this.tableData);
  377. });
  378. }
  379. },
  380. //撤回
  381. undo() {
  382. this.hot.undo();
  383. },
  384. //刷新-switch改变
  385. reset() {
  386. this.getTableData();
  387. },
  388. //添加资产
  389. addDevice() {
  390. this.myDialog.addDevice = true
  391. if (this.mess.deviceId) {
  392. this.$nextTick(() => {
  393. this.$refs.cascader.setValue(this.mess.deviceId)
  394. this.addData.Family = this.mess.deviceId
  395. this.numParams.Family = this.mess.deviceId
  396. })
  397. }
  398. },
  399. //手动创建
  400. toAddDevice() {
  401. if (this.addData.Family) {
  402. this.$router.push({
  403. path: "/ledger/propertyadd",
  404. query: this.addData
  405. });
  406. } else {
  407. this.$message("请选择设备族")
  408. }
  409. },
  410. //显示通过部件或设备创建资产页
  411. toAddbyDie() {
  412. if (this.addData.Family) {
  413. this.showAddByDie = true
  414. this.$nextTick(() => {
  415. this.$refs.dieCascader.getAllData()
  416. })
  417. } else {
  418. this.$message("请选择设备族")
  419. }
  420. },
  421. //格式化条件
  422. formatFilter() {
  423. let param = {
  424. Filters: `category='${this.numParams.category}';PropertyId isNull`
  425. }
  426. if (this.numParams.buildId == "noKnow") {
  427. param.Filters += `;buildingId isNull`
  428. } else if (this.numParams.buildId && this.numParams.buildId != "all") {
  429. param.Filters += `;buildingId='${this.numParams.buildId}'`
  430. }
  431. if (this.numParams.floorId == "noKnow") {
  432. param.Filters += `;floorId isNull`
  433. } else if (this.numParams.floorId && this.numParams.floorId != "all") {
  434. param.Filters += `;floorId='${this.numParams.floorId}'`
  435. }
  436. return param
  437. },
  438. //批量添加
  439. createByDie() {
  440. let param = this.formatFilter()
  441. createPropertys(param, res => {
  442. this.myDialog.addDevice = false
  443. this.$emit('getJson', {code: this.numParams.Family})
  444. this.$message.success("创建成功!")
  445. })
  446. },
  447. //获取未关联资产的设备或部件数量
  448. getNumDie() {
  449. let param = this.formatFilter()
  450. countPartsDie(param, res => {
  451. this.dieNum = res.Count
  452. })
  453. },
  454. //查看详情
  455. toDetaiPage() {
  456. this.$router.push({
  457. path: "/ledger/addPropertys",
  458. query: this.numParams
  459. })
  460. },
  461. //选择设备类型-添加资产
  462. changeCader(val) {
  463. if (val.code && val.facility) {
  464. this.addData.Family = val.code
  465. this.addData.name = val.facility
  466. this.addData.showType = this.showType
  467. this.numParams.Family = val.code
  468. }
  469. },
  470. //选择设备或部件
  471. changeDevice(val) {
  472. if (val.code) {
  473. this.numParams.category = val.code
  474. } else {
  475. this.numParams.category = ''
  476. }
  477. this.getNumDie()
  478. },
  479. //选择建筑楼层
  480. changeFloor(value) {
  481. if (value[0]) {
  482. this.numParams.buildId = value[0]
  483. }
  484. if (value[1]) {
  485. this.numParams.floorId = value[1]
  486. } else {
  487. this.numParams.floorId = ''
  488. }
  489. this.getNumDie()
  490. },
  491. //下载
  492. download() {
  493. if (!this.onlyRead) {
  494. if (!!this.hot) {
  495. let fileName = this.mess.name + "-页数:" + this.page.currentPage + "-个数:" + this.tableData.length + "-总个数:" + this.page.total
  496. this.hot.getPlugin('exportFile').downloadFile("csv", {
  497. filename: fileName,
  498. columnHeaders: true,
  499. exportHiddenRows: true,
  500. exportHiddenColumns: true,
  501. rowHeaders: true
  502. })
  503. } else {
  504. this.$message("请确定存在表格")
  505. }
  506. } else {
  507. this.$message("下载需在编辑状态下")
  508. }
  509. },
  510. //格式化表头
  511. formatHeaderData(list) {
  512. let arr = tools.copyArr(list)
  513. let data = showTools.headerTextFilter(arr, 'property', this.onlyRead, this.showType, true)
  514. data.unshift("操作", "当前关联的设备")
  515. if (this.showType == "all") {
  516. data.splice(4, 0, "所属建筑楼层")
  517. }
  518. return data
  519. },
  520. //格式化表内容
  521. formatHeaderType(list) {
  522. let arr = tools.copyArr(list)
  523. let data = showTools.headerTypeFilter(arr, 'property', this.onlyRead, this.showType, true)
  524. data.unshift(
  525. {
  526. data: "caozuo",
  527. renderer: tools.lookDetails
  528. }, {
  529. data: "LinkEquipLocalName",
  530. renderer: tools.LinkEquipLocalName,
  531. readOnly: true
  532. }
  533. )
  534. if (this.showType == "all") {
  535. data.splice(4, 0, {
  536. data: "flowBuild",
  537. renderer: tools.customDropdownRenderer,
  538. editor: "chosen",
  539. chosenOptions: {
  540. data: this.buildFloorData
  541. },
  542. readOnly: this.onlyRead
  543. })
  544. }
  545. return data
  546. },
  547. //初始化插件
  548. initTable() {
  549. var container = document.getElementById("handsontable");
  550. let winHeight = document.documentElement.clientHeight;
  551. if (this.hot) {
  552. this.hot.destroy();
  553. this.hot = null;
  554. }
  555. this.hot = new Handsontable(container, {
  556. data: this.tableData,
  557. fixedColumnsLeft: 4,
  558. colHeaders: this.formatHeaderData(this.tableHeader), //表头文案
  559. columns: this.formatHeaderType(this.tableHeader), //数据显示格式
  560. filters: true,
  561. maxRows: this.tableData.length,
  562. height: winHeight - 335,
  563. columnSorting: true, //添加排序
  564. sortIndicator: true, //添加排序
  565. renderAllRows: true,
  566. // observeChanges: false, //启用observeChanges插件
  567. // colWidths: 200,
  568. autoColumnSize: true,
  569. language: "zh-CN",
  570. manualColumnResize: true,
  571. manualColumnMove: true,
  572. dropdownMenu: [
  573. "filter_by_condition",
  574. "filter_by_value",
  575. "filter_action_bar"
  576. ],
  577. contextMenu: this.onlyRead ? false : {
  578. items: {
  579. remove_row: {
  580. name: "删除选中资产"
  581. }
  582. }
  583. },
  584. // 事件
  585. afterChange: this.handleUpdataTable, //修改后
  586. afterFilter: this.trimmedRows, //排序前
  587. afterRemoveRow: this.handleDeleteTableRow, //右键删除
  588. afterOnCellMouseDown: this.eventClick //鼠标点击
  589. });
  590. let pro = document.getElementById("hot-display-license-info");
  591. if (!!pro) {
  592. pro.parentNode.removeChild(pro);
  593. }
  594. this.isLoading = false;
  595. },
  596. //表格中的点击
  597. eventClick(el, rowArr) {
  598. //点击的是表头
  599. if (rowArr.row < 0) {
  600. return;
  601. }
  602. //被筛选过后的数组
  603. let trimmedArr = this.trimmedRows();
  604. //是否启用了排序
  605. let isSort = this.hot.getPlugin("columnSorting").isSorted();
  606. if (trimmedArr.length && isSort) {
  607. let sortArr = this.myHotArr.getPlugin("columnSorting").rowsMapper
  608. .__arrayMap;
  609. let infos = this.tableData[trimmedArr[sortArr[rowArr.row]]];
  610. this.getInfors(infos, {row: sortArr[rowArr.row], col: rowArr.col}, el);
  611. } else if (isSort) {
  612. //排序后的数组
  613. let sortArr = this.hot.getPlugin("columnSorting").rowsMapper.__arrayMap;
  614. let infos = this.tableData[sortArr[rowArr.row]];
  615. this.getInfors(infos, {row: sortArr[rowArr.row], col: rowArr.col}, el);
  616. } else if (trimmedArr.length) {
  617. let infos = this.tableData[trimmedArr[rowArr.row]];
  618. this.getInfors(infos, {row: trimmedArr[rowArr.row], col: rowArr.col}, el);
  619. } else {
  620. let infos = this.tableData[rowArr.row];
  621. this.getInfors(infos, rowArr, el);
  622. }
  623. },
  624. // 更新
  625. handleUpdataTable(changeData, source) {
  626. if (!this.onlyRead && source != 'ObserveChanges.change') {
  627. if (changeData) {
  628. let trimmedArr = this.trimmedRows();
  629. let param = handsonUtils.getParam(changeData, source, this.hot, trimmedArr);
  630. let data = [];
  631. for (let i = 0; i < param.length; i++) {
  632. data.push(param[i]);
  633. }
  634. //如果data中包含/且data长度为1,将其转换成.
  635. if (changeData.length == 1 && changeData[0][1].indexOf("/") > 0) {
  636. changeData[0][1] = changeData[0][1].split("/").join(".")
  637. }
  638. //存在data进行修改请求
  639. if (data && data.length) {
  640. this.updateProperty(data, changeData);
  641. }
  642. }
  643. }
  644. },
  645. //删除资产
  646. handleDeleteTableRow() {
  647. let params = tools.differenceArr(this.tableData, this.copyMain)
  648. let _this = this
  649. if (params.length < 1) {
  650. return
  651. }
  652. let param = []
  653. params.map(item => {
  654. param.push({EquipID: item.EquipID})
  655. })
  656. this.$confirm("此操作将删除资产,是否继续?", "提示", {
  657. confirmButtonText: '确定',
  658. cancelButtonText: '取消',
  659. type: 'warning'
  660. }).then(() => {
  661. this.removeDevice(param)
  662. }).catch(() => {
  663. this.reset()
  664. this.$message("取消删除")
  665. })
  666. },
  667. // 删除资产
  668. async removeDevice(param) {
  669. await deleteProperty(param, res => {
  670. this.$message.success("删除成功")
  671. this.$emit('getJson', '')
  672. this.getTableData()
  673. })
  674. },
  675. // 更新
  676. updateProperty(data, change) {
  677. let param = {
  678. Content: [],
  679. Projection: []
  680. }, keyList = []
  681. //生成要修改字段列表
  682. change.map(item => {
  683. let key = item[1].split(".")[0]
  684. if (key == "flowBuild" && keyList.indexOf(key) == -1) {
  685. keyList.push("BuildingId", "FloorId")
  686. param.Projection.push("BuildingId", "FloorId")
  687. }
  688. if (item[1] && keyList.indexOf(key) == -1) {
  689. keyList.push(key)
  690. }
  691. if (item[1] && item[3] == "" && param.Projection.indexOf(key) == -1) {
  692. param.Projection.push(key)
  693. }
  694. })
  695. //生成对应修改数据
  696. data.map((item, index) => {
  697. keyList.map(value => {
  698. if (value == "BuildingId") {
  699. let itemData = tools.dataForKey(item, "flowBuild")
  700. if (itemData == "") {
  701. tools.setDataForKey(item, "BuildingId", null)
  702. tools.setDataForKey(item, "FloorId", null)
  703. } else {
  704. let BuildingId = itemData.split("-")[0]
  705. let FloorId = itemData.split("-")[1]
  706. if (BuildingId && FloorId) {
  707. tools.setDataForKey(item, "BuildingId", BuildingId)
  708. tools.setDataForKey(item, "FloorId", FloorId)
  709. } else if (BuildingId && !FloorId) {
  710. tools.setDataForKey(item, "BuildingId", BuildingId)
  711. tools.setDataForKey(item, "FloorId", null)
  712. }
  713. }
  714. } else {
  715. let itemData = tools.dataForKey(item, value)
  716. tools.setDataForKey(item, value, itemData == "" ? null : itemData)
  717. }
  718. });
  719. param.Content.push(item)
  720. })
  721. updateProperty(param, res => {
  722. })
  723. },
  724. //修改资产类型
  725. // changeCader() {
  726. // if (this.mess.deviceId) {
  727. // let param = {
  728. // data: {
  729. // Filters: `EquipCode='${this.mess.deviceId}'`,
  730. // PageNumber: 1,
  731. // PageSize: 50
  732. // }
  733. // }
  734. // getEquipBelongs(param, res => {
  735. // if (res.Content.length) {
  736. // this.deviceType.assetType = res.Content[0].Family
  737. // this.deviceType.assetName = res.Content[0].FamilyName
  738. // }
  739. // })
  740. // }
  741. // },
  742. //获取到了正确的信息
  743. getInfors(infos, row, el) {
  744. let val = this.hot.colToProp(row.col);
  745. let inputData = this.inputMap[val];
  746. this.row = row.row;
  747. this.messKey = val;
  748. switch (val) {
  749. //操作
  750. case 'caozuo':
  751. // window.open(`http://adm.sagacloud.cn:8058/spread?id=${infos.EquipID}&pid=${this.projectId}&secret=${this.secret}`,"_blank")
  752. // this.$message("开发中...")
  753. this.$router.push({
  754. path: "propertyDetails",
  755. query: {
  756. type: this.mess.deviceId,
  757. equipId: infos.EquipID,
  758. equipName: infos.EquipLocalName?infos.EquipLocalName:infos.EquipName?infos.EquipName:'',
  759. equipCode: infos.EquipLocalID?infos.EquipLocalID:'',
  760. data: this.tableData.map(item => {
  761. return {
  762. value: item.EquipID,
  763. label: item.EquipLocalName?item.EquipLocalName:item.EquipName?item.EquipName:''
  764. }
  765. })
  766. }
  767. })
  768. return false
  769. //资产二维码图片
  770. case 'EquipQRCode':
  771. this.qrcodeUrl = this.tableData[row.row].EquipQRCode;
  772. if (!!this.qrcodeUrl) {
  773. this.myDialog.qrcode = true;
  774. } else {
  775. this.$message("此资产没有资产二维码");
  776. }
  777. return false
  778. //关联系统
  779. case 'LinkSystem':
  780. if (!this.onlyRead) {
  781. this.curDevice = infos.EquipID;
  782. this.systemList = this.tableData[row.row].LinkSystem || [];
  783. this.myDialog.systemType = true;
  784. }
  785. return false
  786. //关联资产
  787. case 'LinkEquipLocalName':
  788. if (this.linkNameFalg) {
  789. this.myDialog.changeRea = true;
  790. }
  791. return false
  792. //品牌型号弹窗
  793. case 'DPManufacturerID':
  794. if (!this.onlyRead) {
  795. this.myDialog.firm = true;
  796. }
  797. return false
  798. //供应商信息弹窗
  799. case 'DPSupplierID':
  800. if (!this.onlyRead) {
  801. this.myDialog.supplier = true;
  802. }
  803. return false
  804. //维修商信息弹窗
  805. case 'DPMaintainerID':
  806. if (!this.onlyRead) {
  807. this.myDialog.maintainer = true;
  808. }
  809. return false
  810. //保险公司信息
  811. case 'DPInsurerID':
  812. if (!this.onlyRead) {
  813. this.myDialog.insurer = true;
  814. }
  815. return false
  816. //供应合同编号
  817. case 'LedgerParam.SupplyPurchase.SupplierContractID':
  818. if (!this.onlyRead) {
  819. let ContractIDflag = null;
  820. let DPSdata = this.tableData[row.row].DPSupplierID;
  821. if (DPSdata) {
  822. ContractIDflag = DPSdata.split("-")[0];
  823. }
  824. if (!!ContractIDflag) {
  825. this.id = ContractIDflag;
  826. this.myDialog.supply = true;
  827. } else {
  828. this.$message("请先选择供应商");
  829. }
  830. }
  831. return false
  832. //保险单号
  833. case 'LedgerParam.InsuranceDoc.InsuranceNum':
  834. if (!this.onlyRead) {
  835. let DPInsurerIDflag = null;
  836. let DPIdata = this.tableData[row.row].DPInsurerID;
  837. if (DPIdata) {
  838. DPInsurerIDflag = DPIdata.split("-")[0];
  839. }
  840. if (!!DPInsurerIDflag) {
  841. this.id = DPInsurerIDflag;
  842. this.myDialog.guarantee = true;
  843. } else {
  844. this.$message("请先选择保险商");
  845. }
  846. }
  847. return false
  848. //保险文件--资产文档--安装质检报告
  849. case 'LedgerParam.InsuranceDoc.InsuranceFile': //保险文件
  850. case 'LedgerParam.PhotoDoc.Archive': //设备文档
  851. case 'LedgerParam.Siteinstall.CheckReport': //安装质检报告
  852. case 'LedgerParam.OperationMainte.MaintainManual': //维修保养手册
  853. case 'LedgerParam.SupplyPurchase.ApproachingAcceptance': //进场验收单
  854. case 'LedgerParam.SupplyPurchase.AcceptanceReport': //验收报告
  855. case 'LedgerParam.PhotoDoc.OperationManual': //操作说明书
  856. case 'LedgerParam.EquipManufactor.OriginalCertificate': //原厂证明
  857. case 'LedgerParam.EquipManufactor.TestReport': //检测报告
  858. case 'LedgerParam.PhotoDoc.ProductCertification': //产品合格证
  859. case 'LedgerParam.Siteinstall.InstallInstruction': //安装说明书
  860. case 'LedgerParam.SupplyPurchase.SupplierContract': //供应合同
  861. case 'LedgerParam.PhotoDoc.Drawing': //设备图纸
  862. case 'LedgerParam.Siteinstall.InstallDrawing': //安装图纸
  863. let IPSdata = tools.dataForKey(this.tableData[row.row], val);
  864. this.filesArr = IPSdata ? IPSdata : [];
  865. this.myDialog.uploadFiles = true;
  866. return false
  867. //安装照片--设备铭牌照片
  868. case 'LedgerParam.Siteinstall.InstallPic':
  869. case 'LedgerParam.PhotoDoc.Nameplate':
  870. let SSPPdata = tools.dataForKey(this.tableData[row.row], val);
  871. this.imgsArr = SSPPdata ? SSPPdata : [];
  872. this.myDialog.uploadImgs = true;
  873. return false
  874. //设备照片
  875. case 'LedgerParam.PhotoDoc.Pic':
  876. let Pdata = tools.dataForKey(this.tableData[row.row], val);
  877. this.picsArr = Pdata ? Pdata : [];
  878. this.myDialog.pic = true;
  879. return false
  880. //包含的部件字段
  881. case 'Count':
  882. if (this.onlyRead) {
  883. this.$router.push({path: '/ledger/parts', query: {deviceId: infos.EquipID}});
  884. } else {
  885. this.$router.push({
  886. path: '/ledger/partsmanage',
  887. query: {deviceId: infos.EquipID, typeId: this.mess.deviceId}
  888. });
  889. }
  890. return false
  891. default:
  892. break;
  893. }
  894. if (!this.onlyRead && !inputData.Editable) {
  895. this.$message("该信息点的值为自动生成,不可人工维护!");
  896. return false;
  897. }
  898. if (!this.onlyRead && showTools.InputModeArr.indexOf(inputMode) == '-1') {
  899. this.updateInfoPoint = val;
  900. this.updateInput = tools.dataForKey(this.tableData[row.row], val);
  901. this.myDialog.update = true;
  902. return false;
  903. }
  904. },
  905. //关闭临时维护弹窗回调
  906. handleCloseUpdate() {
  907. this.updateInputShow = false
  908. this.updateInfoPoint = ''
  909. this.updateInput = ''
  910. },
  911. //更新临时维护信息点
  912. handleClickUpdate() {
  913. tools.setDataForKey(this.tableData[this.row], this.updateInfoPoint, this.updateInput)
  914. this.handleUpdataTable([[this.row, this.updateInfoPoint, null, this.updateInput]], "edit")
  915. this.updateInputShow = false
  916. this.myDialog.update = false
  917. this.updateInput = ''
  918. },
  919. //获取被筛选掉的行号
  920. trimmedRows() {
  921. var plugin = this.hot.getPlugin("trimRows").trimmedRows;
  922. let dataLength = this.tableData.length;
  923. let dataArr = new Array();
  924. for (let i = 0; i < dataLength; i++) {
  925. dataArr.push(i);
  926. }
  927. if (plugin.length <= 0) {
  928. dataArr = undefined;
  929. } else {
  930. dataArr = this.array_diff(dataArr, plugin);
  931. }
  932. return dataArr || [];
  933. },
  934. //去除数组中相同的元素
  935. array_diff(a, b) {
  936. for (var i = 0; i < b.length; i++) {
  937. for (var j = 0; j < a.length; j++) {
  938. if (a[j] == b[i]) {
  939. a.splice(j, 1);
  940. j = j - 1;
  941. }
  942. }
  943. }
  944. return a;
  945. },
  946. //如果选择供应商之后
  947. supplierChange(data) {
  948. tools.setDataForKey(this.tableData[this.row], "DPSupplierID", data.venderId)
  949. tools.setDataForKey(this.tableData[this.row], "LedgerParam.SupplyPurchase.Supplier", data.name)
  950. this.handleUpdataTable(
  951. [
  952. [this.row, "DPSupplierID", null, data.venderId],
  953. [this.row, "LedgerParam.SupplyPurchase.Supplier", null, data.name]
  954. ],
  955. "edit"
  956. )
  957. // this.handleUpdataTable([[this.row, "LedgerParam.SupplyPurchase.Supplier", null, data.name]], "edit")
  958. },
  959. //供应合同编号
  960. supplyChange(data) {
  961. tools.setDataForKey(this.tableData[this.row], "LedgerParam.SupplyPurchase.SupplierContractID", {id: data})
  962. },
  963. //保险单号-保险文件
  964. guaranteeChange(data) {
  965. for (let key in data) {
  966. this.utilToKey(key, "insuranceNo", data, "InsuranceNum")
  967. if (key == "contractFile") {
  968. if (!!data[key]) {
  969. data[key] = [data[key]]
  970. }
  971. }
  972. this.utilToKey(key, "contractFile", data, "InsuranceFile")
  973. }
  974. },
  975. //选择型号修改
  976. firmChange(data) {
  977. tools.setDataForKey(this.tableData[this.row], "DPManufacturerID", data.venderId)//生产商ID
  978. tools.setDataForKey(this.tableData[this.row], "DPBrandID", data.brandId)//品牌ID
  979. tools.setDataForKey(this.tableData[this.row], "DPSpecificationID", data.specificationId)//型号ID
  980. tools.setDataForKey(this.tableData[this.row], "LedgerParam.EquipManufactor.Manufacturer", data.venderName)
  981. tools.setDataForKey(this.tableData[this.row], "LedgerParam.EquipManufactor.Brand", data.brandName)
  982. tools.setDataForKey(this.tableData[this.row], "LedgerParam.EquipManufactor.Specification", data.name)
  983. this.handleUpdataTable(
  984. [
  985. [this.row, "DPManufacturerID", null, data.venderId],
  986. [this.row, "DPBrandID", null, data.brandId],
  987. [this.row, "DPSpecificationID", null, data.specificationId],
  988. [this.row, "LedgerParam.EquipManufactor.Manufacturer", null, data.venderName],
  989. [this.row, "LedgerParam.EquipManufactor.Brand", null, data.brandName],
  990. [this.row, "LedgerParam.EquipManufactor.Specification", null, data.name]
  991. ],
  992. "edit"
  993. )
  994. // this.handleUpdataTable([[this.row, "LedgerParam.EquipManufactor.Brand", null, data.brand]], "edit")
  995. // this.handleUpdataTable([[this.row, "LedgerParam.EquipManufactor.Specification", null, data.name]], "edit")
  996. },
  997. //保险商变更
  998. changeInsurer(data) {
  999. tools.setDataForKey(this.tableData[this.row], "DPInsurerID", data.venderId)
  1000. tools.setDataForKey(this.tableData[this.row], "LedgerParam.InsuranceDoc.Insurer", data.name)
  1001. this.handleUpdataTable(
  1002. [
  1003. [this.row, "DPInsurerID", null, data.venderId],
  1004. [this.row, "LedgerParam.InsuranceDoc.Insurer", null, data.name]
  1005. ],
  1006. "edit"
  1007. )
  1008. // this.handleUpdataTable([[this.row, "LedgerParam.InsuranceDoc.Insurer", null, data.name]], "edit")
  1009. },
  1010. //维修商变更
  1011. changeMaintainer(data) {
  1012. tools.setDataForKey(this.tableData[this.row], "DPMaintainerID", data.venderId)
  1013. tools.setDataForKey(this.tableData[this.row], "LedgerParam.OperationMainte.Maintainer", data.name)
  1014. this.handleUpdataTable(
  1015. [
  1016. [this.row, "DPMaintainerID", null, data.venderId],
  1017. [this.row, "LedgerParam.OperationMainte.Maintainer", null, data.name]
  1018. ],
  1019. "edit"
  1020. )
  1021. // this.handleUpdataTable([[this.row, "LedgerParam.OperationMainte.Maintainer", null, data.name]], "edit")
  1022. },
  1023. //修改关联的资产
  1024. changeProperty(val) {
  1025. this.setDataToMain(val.PropertyId, 'PropertyId', this.row);
  1026. this.setDataToMain(val.LinkEquipLocalName, 'LinkEquipLocalName', this.row);
  1027. },
  1028. //上传文件弹窗触发事件
  1029. fileChange(keys) {
  1030. this.setDataToMain(keys, this.messKey, this.row);
  1031. },
  1032. //上传图片弹窗触发事件
  1033. imgChange(keys) {
  1034. this.setDataToMain(keys, this.messKey, this.row);
  1035. },
  1036. //关联系统更改
  1037. changeSystemType(data) {
  1038. tools.setDataForKey(this.tableData[this.row], "LinkSystem", data)
  1039. },
  1040. //资产图片弹窗改变事件
  1041. changePics(keys) {
  1042. this.setDataToMain(keys, this.messKey, this.row);
  1043. },
  1044. utilToKey(key, name, data, messName) {
  1045. if (key == name) {
  1046. this.setDataToMain(data[key], messName, this.row)
  1047. }
  1048. },
  1049. //判断是否有值,有值赋值
  1050. setDataToMain(data, key, row) {
  1051. if (!!data && data != '--') {
  1052. if (!!this.tableData[row]) {
  1053. tools.setDataForKey(this.tableData[row], key, data);
  1054. this.handleUpdataTable([[row, key, null, data]], "edit");
  1055. } else {
  1056. this.tableData[row] = {};
  1057. tools.setDataForKey(this.tableData[row], key, data);
  1058. }
  1059. } else {
  1060. tools.setDataForKey(this.tableData[row], key, "");
  1061. }
  1062. },
  1063. //未知
  1064. setGraphyId(graphyId, assetGroupList) {
  1065. this.graphyId = graphyId
  1066. this.assetGroupList = assetGroupList
  1067. },
  1068. },
  1069. watch: {
  1070. projectId() {
  1071. this.buildFloorData = []
  1072. buildFloor.getData(this.buildFloorData)
  1073. this.main = []
  1074. this.mess.deviceId = null
  1075. this.page.total = 0
  1076. },
  1077. showTypes: {
  1078. handler(newName, oldName) {
  1079. if (newName && newName[0] && newName[0].value) {
  1080. this.showType = newName[0].value
  1081. } else {
  1082. this.showType = ""
  1083. }
  1084. },
  1085. immediate: true,
  1086. deep: true
  1087. }
  1088. }
  1089. };
  1090. </script>
  1091. <style lang="less">
  1092. .hanson-bar {
  1093. height: 40px;
  1094. padding: 5px 0;
  1095. font-size: 14px;
  1096. overflow: hidden;
  1097. margin-top: 0;
  1098. line-height: 40px;
  1099. .iconfont {
  1100. font-size: 12px;
  1101. }
  1102. }
  1103. .add-assets {
  1104. .el-dialog__body {
  1105. height: 130px;
  1106. .die-text {
  1107. margin-left: 10px;
  1108. font-weight: bold;
  1109. clear: both;
  1110. padding-top: 25px;
  1111. padding-bottom: 10px;
  1112. .die-num {
  1113. width: 100px;
  1114. text-align: center;
  1115. display: inline-block;
  1116. border-bottom: 1px solid #333;
  1117. }
  1118. }
  1119. }
  1120. }
  1121. .cancelButtonClass {
  1122. width: 180px;
  1123. }
  1124. </style>