{"remainingRequest":"D:\\jenkins\\workspace\\xq-web-bpm\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\jenkins\\workspace\\xq-web-bpm\\src\\views\\form\\CustomChartManager.vue?vue&type=script&lang=js&","dependencies":[{"path":"D:\\jenkins\\workspace\\xq-web-bpm\\src\\views\\form\\CustomChartManager.vue","mtime":1675071992913},{"path":"D:\\jenkins\\workspace\\xq-web-bpm\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\xq-web-bpm\\node_modules\\thread-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\xq-web-bpm\\node_modules\\babel-loader\\lib\\index.js","mtime":315532800000},{"path":"D:\\jenkins\\workspace\\xq-web-bpm\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\xq-web-bpm\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n\r\nimport form from \"@/api/form.js\";\r\nimport utils from \"@/hotent-ui-util\";\r\nimport uc from \"@/api/uc\";\r\nimport req from \"@/request\";\r\nimport { mapState } from \"vuex\";\r\nconst eipChart = () => import(\"@/components/form/chart/EipChart.vue\");\r\nconst eipChartSetting = () => import(\"@/components/form/chart/EipChartSetting.vue\");\r\n\r\nexport default {\r\n  name: \"customChartManager\",\r\n  components: {\r\n    eipChart,\r\n    eipChartSetting\r\n  },\r\n  data() {\r\n    return {\r\n      data: [],\r\n      pageResult: {\r\n        page: 1,\r\n        pageSize: 50,\r\n        total: 0\r\n      },\r\n      activeTab: \"basicSetting\",\r\n      dialogVisible: false,\r\n      chartDialogVisible: false,\r\n      //基本设置的属性\r\n      initProp:{\r\n        width: 800,\r\n        height: 400,\r\n        system: 1,\r\n        isTable: 1,\r\n        dsalias: \"LOCAL\", // 本地数据源\r\n        displayfield: [],\r\n        xaxisField: [],\r\n        sortfield: [],\r\n        conditionfield: [],\r\n        alias:''\r\n      },\r\n      prop: {},\r\n      //标题设置，图例设置与数据展示\r\n      initConfig:{\r\n        maxLength:0,//最大数据量\r\n        yMin: \"1\",\r\n        xShowAll: \"1\",\r\n        theme: \"default\",//主题\r\n        //title,legend参考echarts的属性\r\n        title: {\r\n          show: true,\r\n          textStyle: {\r\n            fontStyle: \"normal\",\r\n            fontFamily: \"sans-serif\",\r\n            fontSize: 18\r\n          },\r\n          subtext: \"\",\r\n          left: \"auto\",\r\n          top: \"auto\"\r\n        },\r\n        legend: {\r\n          show: true,\r\n          type: \"plain\",\r\n          left: \"auto\",\r\n          top: \"auto\",\r\n          orient: \"horizontal\"\r\n        },\r\n        series: {}\r\n      },\r\n      config: {},\r\n      line:{\r\n        doubleYAxis:true,\r\n        stack:false,\r\n        showType:true,\r\n        smooth:true,\r\n        dataZoom:false\r\n      },\r\n      pie:{\r\n        showType:true,\r\n        roseType:false,\r\n        selectedMode:false,\r\n        radius:[\"0\",\"75\"],\r\n        center:[\"50\",\"50\"],\r\n        label:{\r\n          position:\"outside\"\r\n        }\r\n      },\r\n      radar:{\r\n        showType:true,\r\n        radius:\"75\",\r\n        center:[\"50\",\"50\"],\r\n        areaStyle:true\r\n      },\r\n      funnel:{\r\n        showType:true,\r\n        funnelAlign:\"center\",\r\n        sort:\"none\",\r\n        label:{\r\n          position:\"inside\"\r\n        }\r\n      },\r\n      scatter:{\r\n        showType:true,\r\n        xAxisType:'category'\r\n      },\r\n      fontFamilies: [\"sans-serif\", \"monospace\", \"Arial\", \"Courier New\", \"Microsoft YaHei\", \"serif\"],\r\n      fontStyles: [\"normal\", \"italic\", \"oblique\"],\r\n      styles: [\r\n        { text: \"折线图/柱状图\", value: 1 },\r\n        { text: \"饼图\", value: 3 },\r\n        { text: \"雷达图\",value: 4},\r\n        { text: \"漏斗图\",value: 5},\r\n        { text: \"散点图\",value: 6},\r\n        { text: \"热力图\",value: 7}\r\n      ],\r\n      dataSources: [],\r\n      tablesOrViews: [],\r\n      isCheckSql: \"notCheck\",\r\n      isSubmit: false,\r\n      id: \"\",\r\n      param:{},\r\n      state:\"\",\r\n      deleteUrl:window.context.form+\"/form/customChart/v1/removes\",\r\n      chartType:{\"1\":\"line\",\"3\":\"pie\",\"4\":\"radar\",\"5\":\"funnel\",\"6\":\"scatter\",\"7\":\"heatMap\"},\r\n      importDialogVisible: false,\r\n      uploadUrl: window.context.form + \"/form/customChart/v1/import\",\r\n      fullscreenLoading: false,\r\n    }\r\n  },\r\n  computed: mapState({\r\n    uploadHeaders: function(mapState) {\r\n      return { Authorization: \"Bearer \" + mapState.login.currentUser.token };\r\n    },\r\n  }),\r\n  created() {\r\n    this.config = {...this.initConfig};\r\n  },\r\n  mounted() {\r\n    this.getDataSource();\r\n  },\r\n  watch:{\r\n    //修改过SQL语句把状态改为未验证\r\n    'prop.diySql':{\r\n      handler(newValue,oldValue){\r\n        if(newValue!==oldValue){\r\n          this.isCheckSql = \"notCheck\";\r\n        }\r\n      }\r\n    }\r\n  },\r\n  methods: {\r\n    rowClick(row){\r\n      this.$refs.table.$refs.htTable.toggleRowSelection(row);\r\n    },\r\n    loadData(param, cb) {\r\n      param.sorter=[{ direction: \"DESC\", property: \"updateTime\" }]\r\n      form.getCustomChartList(param).then(response => {\r\n          this.data = response.rows;\r\n          this.pageResult = {\r\n            page: response.page,\r\n            pageSize: response.pageSize,\r\n            total: response.total\r\n          };\r\n        })\r\n        .finally(() => {\r\n          cb();\r\n        });\r\n    },\r\n    showDialog(id) {\r\n      this.dialogVisible = true;\r\n      if (id != null) {\r\n        form.getCustomChartById(id).then(data=>{\r\n          this.prop = data;\r\n          this.prop.displayfield = JSON.parse(data.displayfield);\r\n          this.prop.xaxisField = JSON.parse(data.xaxisField);\r\n          this.prop.sortfield = JSON.parse(data.sortfield);\r\n          this.prop.conditionfield = JSON.parse(data.conditionfield);\r\n          this.config = JSON.parse(data.conf);\r\n          this[this.chartType[this.prop.style+\"\"]] = this.config.series;\r\n          this.isCheckSql = \"suc\";\r\n        });\r\n      }else{\r\n        this.prop = {...this.initProp};\r\n        this.config = {...this.initConfig};\r\n      }\r\n    },\r\n    beforeClose() {\r\n      this.dialogVisible = false;\r\n    },\r\n    beforeChartClose() {\r\n      this.chartDialogVisible = false;\r\n    },\r\n    //获取数据源\r\n    getDataSource() {\r\n      form.getDataSource().then(response => {\r\n        this.dataSources = response.data;\r\n      });\r\n    },\r\n    //根据关键字查询数据源中的表\r\n    getByDsObjectName() {\r\n      if (this.prop.dsalias === null) {\r\n        this.$message({ message: \"请选择数据源\", type: \"warning\" });\r\n        return;\r\n      }\r\n      let data = {\r\n        dsalias: this.prop.dsalias,\r\n        isTable: this.prop.isTable,\r\n        objName: this.state\r\n      };\r\n      form.getTableList(data).then(response => {\r\n        if (!response.data || response.data.length === 0) {\r\n          this.$message({\r\n            message: \"该数据源中未查询到表或视图\",\r\n            type: \"warning\"\r\n          });\r\n          return;\r\n        }\r\n        this.tablesOrViews = response.data;\r\n      });\r\n\r\n    },\r\n    columnSetting() {\r\n      if (!this.checkSelectWay())\r\n        return;\r\n      if (this.prop.dsType === \"dataSource\" && this.prop.objName == null) {\r\n        this.$message({ type: \"warning\", message: \"请选择目标表或视图\" });\r\n      }\r\n      this.param = {\r\n        dsalias:this.prop.dsalias,\r\n        isTable:this.prop.isTable,\r\n        objName:this.prop.objName,\r\n        diySql:this.prop.diySql\r\n      };\r\n      this.$refs.columnSetting.handleOpen();\r\n    },\r\n    checkSelectWay() {\r\n      let errMsgArr = [];\r\n      if (!this.prop.style || this.prop.style === \"\") {\r\n        errMsgArr.push(\"请选择图表类型\");\r\n      }\r\n      if (this.prop.isTable === 1 && this.prop.objName == null) {\r\n        errMsgArr.push(\"请选择目标表\");\r\n      }\r\n      if (this.prop.isTable === 2) {\r\n        if (this.prop.diySql == null) {\r\n          errMsgArr.push(\"请填写SQL语句并验证\");\r\n        } else if (this.isCheckSql === \"notCheck\") {\r\n          errMsgArr.push(\"请验证SQL语句\");\r\n        } else if (this.isCheckSql === \"fail\") {\r\n          errMsgArr.push(\"SQL语句验证不通过\");\r\n        }\r\n      }\r\n      if (errMsgArr.length > 0) {\r\n        this.$message({ message: errMsgArr.join(\",\"), type: \"warning\" });\r\n        return false;\r\n      } else {\r\n        return true;\r\n      }\r\n    },\r\n    close(dialogVisible) {\r\n      this[dialogVisible] = false;\r\n    },\r\n    changeName(){\r\n      document.getElementsByName(\"chartName\")[0].style.border=\"\";\r\n    },\r\n    save() {\r\n      utils.validateForm(this, \"propForm\")\r\n          .then(r => {\r\n            if (!this.checkSelectWay())\r\n              return;\r\n            this.prop.conf = JSON.stringify(this.config);\r\n            let param = {...this.prop};\r\n            if (!param.xaxisField || param.xaxisField.length < 1 || !param.displayfield || param.displayfield.length < 1) {\r\n              this.$message({ message: \"请设置列\", type: \"warning\" });\r\n              return;\r\n            }\r\n            param.displayfield = JSON.stringify(param.displayfield);\r\n            param.xaxisField = JSON.stringify(param.xaxisField);\r\n            param.conditionfield = JSON.stringify(param.conditionfield);\r\n            param.sortfield = JSON.stringify(param.sortfield);\r\n            this.config.series = this[this.chartType[param.style+\"\"]];\r\n            param.conf=JSON.stringify(this.config);\r\n            delete param.resultfield;\r\n            form.saveCustomChart(param).then(response => {\r\n              if (response.state) {\r\n                this.$message({ message: \"保存成功\", type: \"success\" });\r\n                this.dialogVisible = false;\r\n                this.$refs.table.load();\r\n              }else{\r\n                document.getElementsByName(\"chartName\")[0].focus();\r\n                document.getElementsByName(\"chartName\")[0].style.border=\"1px solid red\";\r\n              }\r\n            })\r\n                .catch(() => {\r\n                  this.$message.error(\"保存失败\");\r\n                });\r\n          })\r\n          .catch(reason => {\r\n            this.$message.error(\"表单校验不通过，请检查表单\");\r\n          })\r\n    },\r\n    preview(id) {\r\n      this.id = id;\r\n      this.chartDialogVisible = true;\r\n    },\r\n    //验证sql\r\n    checkSql() {\r\n      let data = {sql:this.prop.diySql, dsName:this.prop.dsalias};\r\n      if(!this.prop.diySql){\r\n        this.$message('请填写自定义sql!');\r\n        return;\r\n      }\r\n      form.checkSql(data).then(response=>{\r\n        if (response.state){\r\n          this.isCheckSql='suc';\r\n          this.$message({type: \"success\", message: response.message});\r\n        } else {\r\n          this.isCheckSql='fail';\r\n        }\r\n      });\r\n    },\r\n    //设置列弹框保存回调，保存设置列数据\r\n    saveColumnSetting(data){\r\n      this.prop.displayfield = data.yAxisField;\r\n      this.prop.xaxisField = data.xAxisField;\r\n      this.prop.conditionfield = data.conditionField;\r\n      this.prop.sortfield = data.sortField;\r\n    },\r\n    handleExport() {\r\n      let selection = this.$refs.table.$refs.htTable.selection;\r\n      if (selection && selection.length === 0) {\r\n        this.$message.warning(\"请选择至少一项记录\");\r\n        return;\r\n      }\r\n      let ids = selection.map(item => item.id);\r\n      let url = `${window.context.form}/form/customChart/v1/exportXml?ids=${ids}`;\r\n      req.download(url);\r\n    },\r\n    handleUploadResult(data) {\r\n      if (data.state) {\r\n        if (data.message.includes(\"已存在故跳过\")) {\r\n          this.$message({ type: \"warning\", message: data.message, showClose: true, duration: 5000, dangerouslyUseHTMLString: true });\r\n        } else {\r\n          this.$message({ type: \"success\", message: \"导入成功\" });\r\n        }\r\n      } else {\r\n        this.$message({ type: \"error\", message: data.message });\r\n      }\r\n      this.$refs.table.querys = [];\r\n      this.$refs.table.load();\r\n      this.importDialogVisible = false;\r\n      this.fullscreenLoading = false;\r\n    },\r\n    beforeUpload(file) {\r\n      if (!file.name.endsWith(\".zip\")) {\r\n        this.$message.warning(\"只能导入zip文件!\");\r\n        return false;\r\n      }\r\n      this.fullscreenLoading = true;\r\n    },\r\n    onExceed(file) {\r\n      this.$message.warning(\"只能选择一个zip文件!\");\r\n    },\r\n    uploadSubmit() {\r\n      if (\r\n          !this.$refs.upload.uploadFiles ||\r\n          this.$refs.upload.uploadFiles.length === 0\r\n      ) {\r\n        this.$message.warning(\"请选择要导入的数据图表!\");\r\n        return false;\r\n      }\r\n      this.$refs.upload.submit();\r\n    },\r\n  }\r\n};\r\n",null]}