123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221 |
- <template>
- <div id="handsonStep2">
- <div class="btns-view">
- <el-button type="primary" @click="dialogShow(1)">根据关键内容批量标准化设备标识</el-button>
- <el-button type="primary" @click="dialogShow(2)">根据关键内容批量对应数据字典</el-button>
- <el-checkbox style="float:right;" @change="changeChecked" v-model="checked">只显示未标准化得的原始点位</el-checkbox>
- </div>
- <div id="handsontableSteps1" v-if="pages.total">
- <handsontable-component @mouseDown="clickEdit" ref="handsontable"></handsontable-component>
- </div>
- <div v-else>
- 暂无数据
- </div>
- <!-- <div class="center">
- <pagination :page="pages" @change="changePage"></pagination>
- </div> -->
- <own-dialog :width="'1000px'" :title=" isDataform ? '根据关键内容批量对应数据字典' : '根据关键内容批量标准化设备标识' " :dialogVisible="isDialogShow" @cancel="close">
- <dialog-main v-if="!isDataform"></dialog-main>
- <steps-main v-if="isDataform"></steps-main>
- </own-dialog>
- <own-dialog :width="'1000px'" :dialogVisible="isEditDialogShow" @cancel="closeEdit">
- <step3-edit v-if="isEditDialogShow" :editData='editData' @refresh='refreshData'></step3-edit>
- </own-dialog>
- </div>
- </template>
- <script>
- import handsontableComponent from "@/components/common/handsontable"
- import headerArr from "@/utils/point_edit/steps3.js"
- import {
- changeHeader,
- showTypes
- } from "@/utils/handsontable/delType"
- import {
- mapGetters,
- mapActions
- } from "vuex";
- import ownDialog from "@/components/el_pack/dialog"
- import dialogMain from "@/components/config_point/step3_point/dialog_main"
- import stepsMain from "@/components/config_point/step3_point/steps3_main"
- import {
- queryPointRela,
- getNoDealPoint
- } from "@/fetch/point_http"
- import step3Edit from '@/components/config_point/step3_edit/index'
- import pagination from "@/components/common/myPagination"
- export default {
- data() {
- return {
- checked: false,
- settings: {},
- isDialogShow: false,
- hot: null,
- isDataform: false,
- /************point3_step_edit*********************** */
- isEditDialogShow: false,
- editData:{}, //编辑数据
- pages: {
- size: 10,
- sizes: [10, 30, 50, 100],
- total: 0,
- currentPage: 0
- },
- }
- },
- computed: {
- ...mapGetters("project", [
- "projectId",
- "datasourceId",
- "protocolType"
- ])
- },
- created() {
- if (!this.protocolType) {
- this.$router.push({
- path: "/configPoint"
- })
- }
- },
- mounted() {
- this.getData()
- },
- methods: {
- //页面关闭
- close() {
- this.isDialogShow = false
- },
- //只显示为标准化的点位标识
- changeChecked(){
- if(this.checked){
- getNoDealPoint({
- type: this.protocolType,
- data: {
- DataSourceId: this.datasourceId
- }
- },res => {
- let content = res.Content
- let settings = {
- data: content,
- colHeaders: changeHeader(headerArr),
- columns: showTypes(headerArr).map(item => {
- item.readOnly = true
- item.data = item.data
- return item
- }),
- rowHeights: 30,
- maxRows: res.Content.length
- }
- this.hot = this.$refs.handsontable.init(settings)
- this.pages.total = res.Total
- console.log(this.hot)
- })
- }else{
- this.getData()
- }
- },
- //页面显示num1为标准化设备标识,2为对应数据字典
- dialogShow(num) {
- if (num == 1) {
- this.isDataform = false
- } else if (num == 2) {
- this.isDataform = true
- }
- this.isDialogShow = true
- },
- //页面发生更改
- changePage() {
- this.getData()
- },
-
- /**
- * 表格点击事件
- * @param {当前条数据} rowData
- * @param {当前条} row
- *
- * down something
- */
- clickEdit(rowData,row){
- let activeCell = this.hot.getActiveEditor()
- console.log(activeCell.prop)
- if (activeCell.prop == "Point.Infos.edit") {
- this.isEditDialogShow = true;
- this.editData = rowData;
- }
- },
- closeEdit() {
- this.isEditDialogShow = false;
- },
- //初始化表格实例
- getData() {
- let width, param, settings
- param = {
- type: this.protocolType,
- data: {
- DataSourceId: this.datasourceId,
- // "PageNumber": this.pages.currentPage || 1,
- // "PageSize": this.pages.size,
- }
- }
- queryPointRela(param, res => {
- let content = res.Content.map(item => {
- if(item.RelationList.length){
- item.Point.DataRuleType = item.RelationList[0].DataRuleType
- item.Point.PhysicalRelated = item.RelationList[0].EquipmentType + '-' + item.RelationList[0].InfomationPoint
- }
- return item
- })
- settings = {
- data: content,
- colHeaders: changeHeader(headerArr),
- columns: showTypes(headerArr).map(item => {
- item.readOnly = true
- item.data = 'Point.' + item.data
- return item
- }),
- rowHeights: 30,
- maxRows: res.Content.length
- }
- this.pages.total = res.Total
- if(this.pages.total){
- this.$nextTick(_ => {
- this.hot = this.$refs.handsontable.init(settings)
- })
- }
- console.log(this.hot)
- })
- },
- //刷新数据
- refreshData() {
- this.getData()
- this.isEditDialogShow = false;
- }
- },
- components: {
- handsontableComponent,
- ownDialog,
- dialogMain,
- step3Edit,
- stepsMain,
- pagination
- }
- }
- </script>
- <style lang="scss" scoped>
- #handsonStep2 {
- flex: 1;
- display: flex;
- flex-flow:column;
- .btns-view {
- height: 40px;
- line-height: 40px;
- margin-bottom: 10px;
- }
- #handsontableSteps1 {
- flex: 1;
- overflow: hidden;
- position: relative;
- }
- }
- </style>
|