3_temps.vue 24 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575
  1. <template>
  2. <div>
  3. <el-steps :active="activeName" align-center>
  4. <el-step title="步骤1" description="确定与数据字典中信息点对应"></el-step>
  5. <el-step title="步骤2" description="确定值得处理方式"></el-step>
  6. <el-step title="步骤3" description="确认并维护涉及到得原始点位对应得设备标识"></el-step>
  7. </el-steps>
  8. <div class="collapse-item" v-show="activeName == 0">
  9. <el-form class="form" :rules="rules" ref="form" :model="form1" label-width="120px">
  10. <el-form-item label="对应数据字典" prop="dict" :rules="[{ required: true, message: '请输入对应数据字典', trigger: 'change' },{ validator: validateDict, trigger: ['blur', 'change'] }]">
  11. <el-cascader style="width: 100%;" :options="options" v-model="form1.dict" @change="handleChange" :props="props" filterable @active-item-change="handleItemChange"></el-cascader>
  12. </el-form-item>
  13. </el-form>
  14. <div class="flex-around">
  15. <div class="point-despoint">
  16. <p class="center">原始点位说明</p>
  17. <p></p>
  18. </div>
  19. <div class="point-despoint">
  20. <p class="center">数据字典值说明</p>
  21. <p class="content-view">{{unitObj.unit || '--'}}</p>
  22. </div>
  23. </div>
  24. <div class="center">
  25. <el-button @click="next">下一步</el-button>
  26. </div>
  27. </div>
  28. <div class="collapse-item" v-show="activeName == 1">
  29. <div class="flex-around">
  30. <div class="point-despoint">
  31. <p>原始点位说明</p>
  32. <p></p>
  33. </div>
  34. <div class="point-despoint">
  35. <p>数据字典值说明</p>
  36. <p class="content-view">{{unitObj.unit || '--'}}</p>
  37. </div>
  38. </div>
  39. <el-form class="form" :rules="rules" ref="form2" :model="form2" label-width="140px">
  40. <el-form-item label='值处理方式' prop='DataRuleType'>
  41. <el-select v-model='form2.DataRuleType' placeholder='请选择'>
  42. <el-option v-for='item in handleTypeArr' :key='item.value' :label='item.label' :value='item.value'></el-option>
  43. </el-select>
  44. </el-form-item>
  45. <!-- components -->
  46. <div ref='noHandle' v-if='form2.DataRuleType == "无需处理,直接使用"'></div>
  47. <auto-handle :devFlag="false" ref='autoHandle' v-else-if='form2.DataRuleType == "需自动单位转换"' :unitObj='unitObj'></auto-handle>
  48. <enum-handle :devFlag="false" ref='enumHandle' v-else-if='form2.DataRuleType == "需按设置枚举转换"'></enum-handle>
  49. <formula-handle :devFlag="false" ref='formulaHandle' v-else-if='form2.DataRuleType == "需按公式转换"'></formula-handle>
  50. <split-handle :devFlag="false" ref='splitHandle' v-else></split-handle>
  51. </el-form>
  52. <div class="center">
  53. <el-button @click="undo">上一步</el-button>
  54. <el-button @click="next">下一步</el-button>
  55. </div>
  56. </div>
  57. <div class="collapse-item" v-show="activeName == 2">
  58. <div style="height:150px;">
  59. <handsontable-component ref="handsontable"></handsontable-component>
  60. </div>
  61. <div class="center">
  62. <el-button @click="undo">上一步</el-button>
  63. <el-button @click="save">保存</el-button>
  64. </div>
  65. </div>
  66. </div>
  67. </template>
  68. <script>
  69. //components
  70. import noHandle from '@/components/config_point/step3_edit/no_handle'
  71. import autoHandle from '@/components/config_point/step3_edit/auto_handle'
  72. import enumHandle from '@/components/config_point/step3_edit/enum_handle'
  73. import formulaHandle from '@/components/config_point/step3_edit/formula_handle'
  74. import splitHandle from '@/components/config_point/step3_edit/split_handle'
  75. import handsontableComponent from "@/components/common/handsontable"
  76. import {
  77. mapGetters,
  78. mapActions
  79. } from "vuex";
  80. import {
  81. getEquipmentAll,
  82. getQueryProperty
  83. } from '@/fetch/data_plat'
  84. import {
  85. batchCreate,
  86. queryDescription
  87. } from '@/fetch/point_http'
  88. export default {
  89. name: "tempsThree",
  90. computed: {
  91. ...mapGetters("project", [
  92. "projectId",
  93. "datasourceId",
  94. "protocolType"
  95. ])
  96. },
  97. props: {
  98. renderData: {
  99. type: Array,
  100. default: function() {
  101. return []
  102. }
  103. }
  104. },
  105. data() {
  106. return {
  107. activeName: 0,
  108. form1: {
  109. dict: []
  110. },
  111. options: [],
  112. dataDict: {}, //数据字典
  113. props: {
  114. value: 'code',
  115. label: 'name',
  116. children: 'content'
  117. },
  118. infoDict: {}, //信息点字典
  119. InfomationPoint: null, //信息点
  120. unitObj: {}, //传给自动单位转换的obj
  121. handleTypeArr: [{
  122. label: '无需处理,直接使用',
  123. value: '无需处理,直接使用'
  124. },
  125. {
  126. label: '需自动单位转换',
  127. value: '需自动单位转换'
  128. },
  129. {
  130. label: '需按设置枚举转换',
  131. value: '需按设置枚举转换'
  132. },
  133. {
  134. label: '需按公式转换',
  135. value: '需按公式转换'
  136. },
  137. {
  138. label: '需按拆分枚举转换',
  139. value: '需按拆分枚举转换'
  140. }
  141. ],
  142. dealType: {},//处理方式
  143. form2: {
  144. ValueDescription: '',
  145. DataRuleType: '无需处理,直接使用'
  146. },
  147. rules: {
  148. DataRuleType: [{
  149. required: true,
  150. message: '请选择值处理方式',
  151. trigger: 'change'
  152. }]
  153. },
  154. }
  155. },
  156. created() {},
  157. mounted() {
  158. this.init()
  159. console.log(this.renderData)
  160. },
  161. components: {
  162. noHandle,
  163. autoHandle,
  164. enumHandle,
  165. formulaHandle,
  166. splitHandle,
  167. handsontableComponent
  168. },
  169. methods: {
  170. getMain(param) {
  171. let params = {
  172. data: {
  173. DataSourceId: this.datasourceId,
  174. KeyEquipmentParameter: param.EquipmentParameter,
  175. KeyEquipmentType: param.EquipmentType
  176. },
  177. type: this.protocolType
  178. }
  179. console.log(params, 'params')
  180. queryDescription(params, res => {
  181. console.log(res)
  182. })
  183. },
  184. //保存
  185. save(){
  186. let data = this.hot.getSourceData()
  187. let params = data.map(item => {
  188. console.log(item ,' item')
  189. return Object.assign(this.dealType,{DataSourceId: this.datasourceId,PointId: item.Id,EquipmentMark:item.EquipmentMark})
  190. }),sameFalg = false,magFalg = false;
  191. params.map((item,index) => {
  192. if(!item.EquipmentMark){
  193. magFalg = true
  194. }
  195. params.map((child,childIndex) => {
  196. if(childIndex != index && child.EquipmentMark == item.EquipmentMark){
  197. sameFalg = true
  198. }
  199. })
  200. })
  201. if(magFalg){
  202. this.confirm("点位中存在空的设备标识",params)
  203. }else if(sameFalg){
  204. this.confirm("点位中存在设备标识相同的点位",params)
  205. }else{
  206. this.createParam(params)
  207. }
  208. console.log(params)
  209. },
  210. confirm(assage,params){
  211. this.$confirm(assage).then(_ => {
  212. this.createParam(params)
  213. }).catch(_ => {})
  214. },
  215. createParam(params){
  216. batchCreate(params,res => {
  217. this.$message.success("处理成功")
  218. this.$emit("changed")
  219. })
  220. },
  221. undo() {
  222. this.activeName -= 1
  223. },
  224. errMsg() {
  225. this.$message({
  226. message: '有必填项未填',
  227. type: 'warning'
  228. })
  229. },
  230. next() {
  231. if (this.activeName == 0) {
  232. this.$refs.form.validate((isOk, obj) => {
  233. console.log(isOk, obj)
  234. if (isOk) {
  235. console.log(this.form1)
  236. this.form2 = Object.assign(this.form2,this.form1)
  237. console.log(this.form2)
  238. this.activeName += 1
  239. }
  240. })
  241. }else if (this.activeName == 1) {
  242. this.$refs['form2'].validate(valid => {
  243. if (valid) {
  244. var flag = this.form2.DataRuleType
  245. switch (flag) {
  246. case '无需处理,直接使用':
  247. // this.$refs.noHandle.getForm(noHandle => {
  248. // if (noHandle) {
  249. this.saveForm(this.form2, {})
  250. // } else {
  251. // this.errMsg()
  252. // }
  253. // })
  254. break
  255. case '需自动单位转换':
  256. this.$refs.autoHandle.getForm(autoHandle => {
  257. if (autoHandle) {
  258. this.saveForm(this.form2, autoHandle)
  259. } else {
  260. this.errMsg()
  261. }
  262. })
  263. break
  264. case '需按设置枚举转换':
  265. this.$refs.enumHandle.getForm(enumHandle => {
  266. if (enumHandle) {
  267. this.saveForm(this.form2, enumHandle)
  268. } else {
  269. this.errMsg()
  270. }
  271. })
  272. break
  273. case '需按公式转换':
  274. this.$refs.formulaHandle.getForm(formulaHandle => {
  275. if (formulaHandle) {
  276. this.saveForm(this.form2, formulaHandle)
  277. } else {
  278. this.errMsg()
  279. }
  280. })
  281. break
  282. case '需拆分处理':
  283. this.$refs.splitHandle.getForm(splitHandle => {
  284. if (splitHandle) {
  285. this.saveForm(this.form2, splitHandle)
  286. } else {
  287. this.errMsg()
  288. }
  289. })
  290. break
  291. }
  292. this.activeName += 1
  293. let setting = {
  294. data: this.renderData,
  295. maxRows: this.renderData.length,
  296. colHeaders: ['设备标识', '原始点位描述', '位置标签', '备注'],
  297. columns: [{
  298. data: 'EquipmentMark'
  299. },
  300. {
  301. data: 'Description',
  302. readOnly: true
  303. },
  304. {
  305. data: 'LocationFlag',
  306. readOnly: true
  307. },
  308. {
  309. data: 'Remarks',
  310. readOnly: true
  311. }
  312. ]
  313. }
  314. this.$nextTick(_ => {
  315. this.hot = this.$refs.handsontable.init(setting)
  316. })
  317. } else {
  318. this.errMsg()
  319. return false
  320. }
  321. })
  322. }
  323. },
  324. saveForm(basic, other) {
  325. console.log(basic.dict, other,'basic, other')
  326. let type = basic.DataRuleType
  327. let basicParams = {
  328. SpecialtyCode: basic.dict[0],
  329. SystemCode: basic.dict[1], //code
  330. EquipmentTypeCode: basic.dict[2],
  331. InfomationPointCode: basic.dict[3],
  332. Specialty: this.dataDict[basic.dict[0]].name, //专业
  333. System: this.dataDict[basic.dict[1]].name, //系统
  334. EquipmentType: this.dataDict[basic.dict[2]].name, //设备
  335. InfomationPoint: this.InfomationPoint, //信息点
  336. DataRuleType: basic.DataRuleType, //值处理方式
  337. // DataSourceId: '4',
  338. // PointId: this.editData.Point.Id //点位ID
  339. }
  340. // console.log(basicParams,'basicParams')
  341. let otherParams = {}
  342. switch (type) {
  343. case '无需处理,直接使用':
  344. otherParams = {
  345. EquipmentMark: other.EquipmentMark
  346. }
  347. break
  348. case '需自动单位转换':
  349. let DataRuleContent1 = JSON.stringify([{
  350. seq: 1,
  351. ruletype: 'type1',
  352. content: [{
  353. from: other.unit[0] + '-' + other.unit[1],
  354. to: this.unitObj.unit
  355. }]
  356. }])
  357. otherParams = {
  358. DataRuleContent: DataRuleContent1,
  359. EquipmentMark: other.EquipmentMark
  360. }
  361. break
  362. case '需按设置枚举转换':
  363. let DataRuleContent2 = other.pointArr.length ?
  364. JSON.stringify([{
  365. seq: 1,
  366. ruletype: 'type2',
  367. content: other.pointArr
  368. }]) :
  369. undefined
  370. otherParams = {
  371. EquipmentMark: other.EquipmentMark,
  372. DataRuleContent: DataRuleContent2
  373. }
  374. break
  375. case '需按公式转换':
  376. let subRule = other.from ?
  377. {
  378. seq: 1,
  379. ruletype: 'type4',
  380. content: [{
  381. from: other.from,
  382. to: other.to
  383. }]
  384. } :
  385. undefined
  386. let extractRule = {
  387. seq: 2,
  388. ruletype: 'type5',
  389. content: other.extract ?
  390. [{
  391. extract: 'number'
  392. }] :
  393. []
  394. }
  395. let countRule = other.mark ?
  396. {
  397. seq: 3,
  398. ruletype: 'type6',
  399. content: [{
  400. calculationtype: other.mark,
  401. value: other.markValue
  402. }]
  403. } :
  404. undefined
  405. let DataRuleContent3 = []
  406. if (subRule) {
  407. DataRuleContent3.push(subRule)
  408. }
  409. DataRuleContent3.push(extractRule)
  410. if (countRule) {
  411. DataRuleContent3.push(countRule)
  412. }
  413. DataRuleContent3 = DataRuleContent3.length ? JSON.stringify(DataRuleContent3) : undefined
  414. otherParams = {
  415. EquipmentMark: other.EquipmentMark,
  416. DataRuleContent: DataRuleContent3
  417. }
  418. break
  419. case '需拆分处理':
  420. let SplitPoints = other.devArr.length ? other.devArr : undefined
  421. let DataRuleContent4 = undefined
  422. var enum5 = null
  423. if (other.tranfVal) {
  424. enum5 = {
  425. seq: 2,
  426. ruletype: 'type2',
  427. content: other.pointArr
  428. }
  429. } else {
  430. enum5 = {
  431. seq: 2,
  432. ruletype: 'type2',
  433. content: []
  434. }
  435. }
  436. SplitPoints.forEach(ele => {
  437. let cutStr = {
  438. seq: 1,
  439. ruletype: 'type4',
  440. content: [{
  441. from: ele.SplitStart,
  442. to: ele.SplitEnd
  443. }]
  444. }
  445. ele.DataRuleContent = JSON.stringify([cutStr, enum5])
  446. })
  447. otherParams = {
  448. SplitPoints: SplitPoints
  449. }
  450. break
  451. }
  452. this.dealType = Object.assign(basicParams, otherParams)
  453. // this.create(params)
  454. },
  455. validateDict(rule, value, cb) {
  456. if (value.length < 4) {
  457. cb(new Error('请选到第四级(可能本设备没有信息点)'))
  458. } else {
  459. cb()
  460. }
  461. },
  462. handleChange(arr) {
  463. console.log(arr, 'arr')
  464. console.log(this.infoDict, 'infoDict')
  465. this.unitObj = this.infoDict[arr[3]]
  466. this.InfomationPoint = this.unitObj.infoPointName
  467. },
  468. handleItemChange(val) {
  469. console.log(val, 'vals')
  470. if (val.length == 3) {
  471. let params = {
  472. type: val[2]
  473. }
  474. console.log(params, 'params')
  475. getQueryProperty(params, res => {
  476. if (res.Result == 'success') {
  477. let data = res.Content
  478. let arr = data
  479. .filter(item => {
  480. return item.inputMode == 'L'
  481. })
  482. .map(item => {
  483. return {
  484. code: item.infoPointCode,
  485. name: item.infoPointName
  486. }
  487. })
  488. this.infoDict = {}
  489. data.forEach(item => {
  490. this.infoDict[item.infoPointCode] = item
  491. })
  492. console.log(this.infoDict)
  493. this.optionObj = {}
  494. this.getOptionItem(this.options, val[2])
  495. if (arr.length) {
  496. this.optionObj.content = arr
  497. } else {
  498. this.optionObj.content = undefined
  499. }
  500. }
  501. })
  502. }
  503. },
  504. getOptionItem(arr, code) {
  505. for (var i = 0; i < arr.length; i++) {
  506. if (arr[i].code == code) {
  507. this.optionObj = arr[i]
  508. }
  509. if (arr[i].content && arr[i].content.length > 0) {
  510. this.getOptionItem(arr[i].content, code)
  511. } else {
  512. this.$set(arr, 'content', [])
  513. }
  514. }
  515. },
  516. //缓存数据字典
  517. getDataDict(arr) {
  518. for (var i = 0; i < arr.length; i++) {
  519. // this.dataDict[arr[i].code] = arr[i]
  520. if (arr[i].content && arr[i].content.length > 0) {
  521. this.getDataDict(arr[i].content)
  522. } else {
  523. this.$set(arr[i], 'content', [])
  524. }
  525. }
  526. },
  527. getEqAll() {
  528. let params = {
  529. format: true
  530. }
  531. getEquipmentAll(params, res => {
  532. if (res.Result == 'success') {
  533. this.options = res.Content
  534. this.getDataDict(this.options)
  535. }
  536. })
  537. },
  538. //缓存数据字典
  539. getDataDict(arr) {
  540. for (var i = 0; i < arr.length; i++) {
  541. this.dataDict[arr[i].code] = arr[i]
  542. if (arr[i].content && arr[i].content.length > 0) {
  543. this.getDataDict(arr[i].content)
  544. } else {
  545. this.$set(arr[i], 'content', [])
  546. }
  547. }
  548. },
  549. init() {
  550. //获取所有的设备
  551. this.getEqAll()
  552. },
  553. }
  554. }
  555. </script>
  556. <style lang="scss" scoped>
  557. .flex-around {
  558. display: flex;
  559. justify-content: space-around;
  560. margin-bottom: 5px;
  561. .point-despoint {
  562. width: 180px;
  563. border: 1px solid #DCDFE6;
  564. height: 100px;
  565. .content-view {
  566. padding: 5px;
  567. box-sizing: border-box;
  568. }
  569. }
  570. }
  571. .collapse-item {
  572. height: 190px;
  573. overflow-y: auto;
  574. }
  575. </style>