Skip to content

Q
qd-demo
Commit dfe049c0 authored by 任金涛's avatar 任金涛
Browse files
Options

Merge branch 'master' of 39.98.128.195:zhouyx/qd-demo into rjt20210426frommaster

parents 38159f6f b40d0752
Pipeline #122 canceled with stages
      Hide whitespace changes
      Inline Side-by-side
      Showing with 1198 additions and 1 deletion
      gd.html 0 → 100644
      View file @ dfe049c0
      <!--
      THIS EXAMPLE WAS DOWNLOADED FROM https://echarts.apache.org/examples/zh/editor.html?c=map-HK
      -->
      <!DOCTYPE html>
      <html style="height: 100%">
      <head>
      <meta charset="utf-8">
      </head>
      <body style="height: 100%; margin: 0">
      <div id="container" style="height: 100%"></div>
      <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
      <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts@5/dist/echarts.min.js"></script>
      <!-- Uncomment this line if you want to dataTool extension
      <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts@5/dist/extension/dataTool.min.js"></script>
      -->
      <!-- Uncomment this line if you want to use gl extension
      <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-gl@2/dist/echarts-gl.min.js"></script>
      -->
      <!-- Uncomment this line if you want to echarts-stat extension
      <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-stat@latest/dist/ecStat.min.js"></script>
      -->
      <!-- Uncomment this line if you want to use map
      <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts@5/map/js/china.js"></script>
      <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts@5/map/js/world.js"></script>
      -->
      <!-- Uncomment these two lines if you want to use bmap extension
      <script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=<Your Key Here>"></script>
      <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts@5/dist/extension/bmap.min.js"></script>
      -->
      <script type="text/javascript">
      var dom = document.getElementById("container");
      var myChart = echarts.init(dom);
      var app = {};
      var option;
      myChart.showLoading();
      // $.get('https://geo.datav.aliyun.com/areas_v2/bound/440000_full.json', function (geoJson) {
      $.get('https://geo.datav.aliyun.com/areas_v2/bound/geojson?code=370000_full', function (geoJson) {
      myChart.hideLoading();
      echarts.registerMap('guangdong', geoJson);
      myChart.setOption(option = {
      title: {
      text: '山东省地图',
      },
      tooltip: {
      trigger: 'item',
      formatter: '{b}<br/>{c} (p / km2)'
      },
      toolbox: {
      show: true,
      orient: 'vertical',
      left: 'right',
      top: 'center',
      feature: {
      dataView: {readOnly: false},
      restore: {},
      saveAsImage: {}
      }
      },
      // visualMap: {
      // min: 800,
      // max: 50000,
      // text: ['High', 'Low'],
      // realtime: false,
      // calculable: true,
      // inRange: {
      // color: ['lightskyblue', 'yellow', 'orangered']
      // }
      // },
      series: [
      {
      // name: '香港18区人口密度',
      type: 'map',
      mapType: 'guangdong', // 自定义扩展图表类型
      label: {
      show: true
      },
      data: [
      {name: '青岛市', value: 20057.34},
      {name: '日照市', value: 15477.48}
      ],
      // 自定义名称映射
      nameMap: {
      }
      }
      ]
      });
      });
      if (option && typeof option === 'object') {
      myChart.setOption(option);
      }
      </script>
      </body>
      </html>
      map.html
      View file @ dfe049c0
      ......@@ -5,8 +5,69 @@
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Document</title>
      <!-- <script src="js/echarts.min.js"></script> -->
      <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
      <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts@5/dist/echarts.min.js"></script>
      <style type="text/css">
      #echartMap{
      height: 500px;
      background-color: #eee;
      }
      </style>
      </head>
      <body>
      <div id="echartMap"></div>
      <script type="text/javascript">
      console.log("echarts",echarts)
      // 基于准备好的dom，初始化echarts实例
      $.get("370000_full.json", function(huaianJson) {
      console.warn(huaianJson);
      echarts.registerMap("huaian", huaianJson);
      var chart = echarts.init(document.getElementById("echartMap"));
      chart.setOption({
      backgroundColor: "#404a59",
      visualMap: {
      type: "continuous",
      min: 0,
      max: 100,
      text: ["High", "Low"],
      realtime: false,
      calculable: true,
      color: ["#3ADEF1", "#0089FC", "#0057FE"],
      show: false
      },
      series: [
      {
      type: "map",
      map: "qd",
      roam: false,
      label: {
      normal: {
      show: true,
      color: "#fff"
      },
      emphasis: {
      show: true
      }
      },
      itemStyle: {
      emphasis: { label: { show: true } }
      },
      // data: [
      // { name: "金湖县", value: 80 },
      // { name: "盱眙县", value: 50 },
      // { name: "涟水县", value: 80 },
      // { name: "洪泽区", value: 70 },
      // { name: "淮阴区", value: 80 },
      // { name: "淮安区", value: 40 },
      // { name: "清江浦区", value: 50 }
      // ]
      }
      ]
      });
      });
      console.warn("echart",echarts)
      </script>
      </body>
      </html>
      \ No newline at end of file
      sz.html 0 → 100644
      View file @ dfe049c0
      <!--
      THIS EXAMPLE WAS DOWNLOADED FROM https://echarts.apache.org/examples/zh/editor.html?c=map-HK
      -->
      <!DOCTYPE html>
      <html style="height: 100%">
      <head>
      <meta charset="utf-8">
      </head>
      <body style="height: 100%; margin: 0">
      <div id="container" style="height: 100%"></div>
      <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
      <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts@5/dist/echarts.min.js"></script>
      <!-- Uncomment this line if you want to dataTool extension
      <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts@5/dist/extension/dataTool.min.js"></script>
      -->
      <!-- Uncomment this line if you want to use gl extension
      <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-gl@2/dist/echarts-gl.min.js"></script>
      -->
      <!-- Uncomment this line if you want to echarts-stat extension
      <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-stat@latest/dist/ecStat.min.js"></script>
      -->
      <!-- Uncomment this line if you want to use map
      <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts@5/map/js/china.js"></script>
      <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts@5/map/js/world.js"></script>
      -->
      <!-- Uncomment these two lines if you want to use bmap extension
      <script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=<Your Key Here>"></script>
      <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts@5/dist/extension/bmap.min.js"></script>
      -->
      <script type="text/javascript">
      var dom = document.getElementById("container");
      var myChart = echarts.init(dom);
      var app = {};
      var option;
      myChart.showLoading();
      $.get('https://geo.datav.aliyun.com/areas_v2/bound/440000_full.json', function (geoJson) {
      myChart.hideLoading();
      echarts.registerMap('guangdong', geoJson);
      myChart.setOption(option = {
      title: {
      text: '广东省地图',
      },
      tooltip: {
      trigger: 'item',
      formatter: '{b}<br/>{c} (p / km2)'
      },
      toolbox: {
      show: true,
      orient: 'vertical',
      left: 'right',
      top: 'center',
      feature: {
      dataView: {readOnly: false},
      restore: {},
      saveAsImage: {}
      }
      },
      visualMap: {
      min: 800,
      max: 50000,
      text: ['High', 'Low'],
      realtime: false,
      calculable: true,
      inRange: {
      color: ['lightskyblue', 'yellow', 'orangered']
      }
      },
      series: [
      {
      name: '香港18区人口密度',
      type: 'map',
      mapType: 'guangdong', // 自定义扩展图表类型
      label: {
      show: true
      },
      data: [
      {name: '汕尾市', value: 20057.34},
      {name: '清远市', value: 15477.48}
      ],
      // 自定义名称映射
      nameMap: {
      }
      }
      ]
      });
      });
      if (option && typeof option === 'object') {
      myChart.setOption(option);
      }
      </script>
      </body>
      </html>
      vk.html 0 → 100644
      View file @ dfe049c0
      <!--
      * @Author:rjt
      * @Date: 2021-04-25 17:01:58
      * @LastEditTime: 2021-04-27 08:57:33
      * @LastEditors: henq
      * @Description: In User Settings Edit
      * @FilePath: \wxcdemo\index.html
      -->
      <html>
      <meta charset="utf-8" />
      <meta name="format-detection" content="telephone=no">
      <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
      <meta name="viewport" content="width=device-width,initial-scale=1.0">
      <title>山东省增材制造行业工业互联网平台</title>
      <link rel="stylesheet" type="text/css" href="http://unpkg.com/view-design/dist/styles/iview.css">
      <script type="text/javascript" src="http://vuejs.org/js/vue.min.js"></script>
      <script type="text/javascript" src="http://unpkg.com/view-design/dist/iview.min.js"></script>
      <script src="js/echarts.min.js"></script>
      <link rel="stylesheet" href="css/css.css" />
      <body>
      <div class="container" id="app">
      <div style="height:100px;" class="mt3">
      <div class="txt-c mainTitle">
      欢迎登录山东省增材制造行业军民融合工业互联网服务平台
      </div>
      </div>
      <div style="display:flex;">
      <div style="flex-direction: column;width:520px;">
      <div class="titleList pl1">
      订单工序完成占比
      </div>
      <div class="pl1">
      <div class="titleTool">
      <ul>
      <li style="color: aqua; border-bottom: aqua solid 1px;">注册用户数 2046人</li>
      <li>联网设备 306台</li>
      <li>下载量 6231次</li>
      <li>访问量 12536次</li>
      </ul>
      </div>
      <div id="echart1" style="height: 320px;"></div>
      </div>
      </div>
      <div style="flex-direction: column;width:570px;">
      <div>
      <div class="titleList pl2">
      生产监控
      </div>
      <div class="imgSCJk">
      <ul>
      <li>
      <img src="images/jk1.png">
      </li>
      <li>
      <img src="images/jk1.png">
      </li>
      </ul>
      </div>
      </div>
      </div>
      <div style="flex-direction: column;width: 30%;">
      <div>
      <div class="titleList pl1">
      山东省增材制造行业分布图
      </div>
      <div class="txt-c">
      <img src="images/map.png" style="height:320px" />
      </div>
      </div>
      </div>
      <div style="flex-direction: column;width: 30%;">
      <div>
      <div class="titleList">
      增材制造企业
      </div>
      <div class="txt-c pl1">
      <div class="tableInfo" @click="getInfo(4)">
      <i-table :columns="columns" :data="list" :border="false" :height="tableHeight2">
      </i-table>
      </div>
      </div>
      </div>
      </div>
      <div style="flex-direction: column;width:500px;">
      <div>
      <div class="titleList">
      3D打印设备监控
      </div>
      <div class="pl1 imgJk" @click="getInfo(3)">
      <ul>
      <li>
      <img src="images/jka1.png">
      </li>
      <li>
      <img src="images/jka2.png">
      </li>
      <li>
      <img src="images/jka3.png">
      </li>
      <li>
      <img src="images/jka4.png">
      </li>
      </ul>
      </div>
      </div>
      </div>
      </div>
      <div style="display:flex;">
      <div style="flex-direction:column;width:520px;">
      <div>
      <div class="titleList pl1">
      订单工序完成占比
      </div>
      <div id="echart2" style="height:320px;" @click="getInfo(2)"></div>
      </div>
      </div>
      <div style="flex-direction: column;width:570px;">
      <div>
      <div class="titleList pl2">
      各智能工厂全年打印数量
      </div>
      <div id="echart3" style="height:320px;">
      </div>
      </div>
      </div>
      <div style="flex-direction: column;width: 30%;">
      <div>
      <div class="titleList">
      军民融合增材制造订单跟踪
      </div>
      <div class="txt-c pl1">
      <div class="tableInfo" @click="getInfo(1)">
      <i-table :columns="columns2" :data="list2" class="jx" :border="false" :height="tableHeight2">
      </i-table>
      </div>
      </div>
      </div>
      </div>
      <div style="flex-direction: column;width: 30%;">
      <div>
      <div class="titleList">
      订单管理
      </div>
      <div class="txt-c pl1">
      <div class="tableInfo" @click="getInfo(1)">
      <i-table :columns="columns1" :data="list1" :border="false" :height="tableHeight2">
      </i-table>
      </div>
      </div>
      </div>
      </div>
      <div style="flex-direction: column;width:500px;">
      <div>
      <div class="titleList">
      3D扫描测量机监控
      </div>
      <div class="pl1 imgJk" @click="getInfo(3)">
      <ul>
      <li>
      <img src="images/jkb1.png">
      </li>
      <li>
      <img src="images/jkb2.png">
      </li>
      <li>
      <img src="images/jkb3.png">
      </li>
      <li>
      <img src="images/jkb4.png">
      </li>
      </ul>
      </div>
      </div>
      </div>
      </div>
      <Modal v-model="modalInfo" title="操作" :width="modalWidth" >
      <iframe
      id="hyh"
      title="hyh"
      :src="frameUrl"
      height="600"
      style="width: 100%; border: 0 #ccc solid"
      >
      </iframe>
      </Modal>
      </div>
      <script>
      new Vue({
      el: '#app',
      data() {
      return {
      modalInfo: false,
      modalTitle: "详细信息",
      frameUrl:"",
      detail:null,
      modalWidth: 1600,
      tableHeight1: 0,
      tableHeight2: 0,
      columns: [{
      title: '地区',
      key: "area",
      },
      {
      title: '智能工厂序号',
      key: "id",
      },
      {
      title: '智能工厂名称',
      key: "name",
      ellipsis: true,
      },
      {
      title: '所在地',
      key: "address",
      ellipsis: true
      },
      {
      title: '近一年打印总时长',
      key: "time",
      ellipsis: true,
      align: 'center',
      },
      {
      title: '当前状态',
      key: "status",
      ellipsis: true,
      align: 'center',
      },
      ],
      list: [{
      area: '济南',
      id: '0001',
      name: '星驰恒动科技发展有限公司',
      address: '历下区',
      time: '3000h',
      status: '3在线，2空闲',
      },
      {
      area: '济南',
      id: '0001',
      name: '星驰恒动科技发展有限公司',
      address: '历下区',
      time: '3000h',
      status: '3在线，2空闲',
      },
      {
      area: '济南',
      id: '0001',
      name: '星驰恒动科技发展有限公司',
      address: '历下区',
      time: '3000h',
      status: '3在线，2空闲',
      },
      {
      area: '济南',
      id: '0001',
      name: '星驰恒动科技发展有限公司',
      address: '历下区',
      time: '3000h',
      status: '3在线，2空闲',
      },
      {
      area: '济南',
      id: '0001',
      name: '星驰恒动科技发展有限公司',
      address: '历下区',
      time: '3000h',
      status: '3在线，2空闲',
      },
      {
      area: '济南',
      id: '0001',
      name: '星驰恒动科技发展有限公司',
      address: '历下区',
      time: '3000h',
      status: '3在线，2空闲',
      },
      ],
      columns1: [{
      title: ' ',
      type: 'index',
      width: 60,
      align: 'center'
      }, {
      title: '订单编号',
      key: "mescode",
      ellipsis: true
      },
      {
      title: '名称',
      key: "name",
      ellipsis: true
      },
      {
      title: '客户名称',
      key: "customername",
      ellipsis: true
      },
      {
      title: '材质',
      key: "material",
      ellipsis: true
      },
      {
      title: '工艺方法',
      key: "method",
      ellipsis: true
      },
      {
      title: '数量',
      key: "count",
      ellipsis: true,
      align: 'right',
      },
      {
      title: '状态',
      key: "status",
      ellipsis: true,
      align: 'center',
      },
      ],
      list1: [{
      mescode: 'WRJZ2021053',
      name: '动量轮斜装支架',
      customername: '航天五院',
      material: 'AISi10Mg',
      method: 'SLM',
      count: '100',
      status: '待派发',
      },
      {
      mescode: 'WRJZ2021053',
      name: '动量轮斜装支架',
      customername: '航天五院',
      material: 'AISi10Mg',
      method: 'SLM',
      count: '100',
      status: '待派发',
      },
      {
      mescode: 'WRJZ2021053',
      name: '动量轮斜装支架',
      customername: '航天五院',
      material: 'AISi10Mg',
      method: 'SLM',
      count: '100',
      status: '待派发',
      },
      {
      mescode: 'WRJZ2021053',
      name: '动量轮斜装支架',
      customername: '航天五院',
      material: 'AISi10Mg',
      method: 'SLM',
      count: '100',
      status: '待派发',
      },
      {
      mescode: 'WRJZ2021053',
      name: '动量轮斜装支架',
      customername: '航天五院',
      material: 'AISi10Mg',
      method: 'SLM',
      count: '100',
      status: '待派发',
      },
      {
      mescode: 'WRJZ2021053',
      name: '动量轮斜装支架',
      customername: '航天五院',
      material: 'AISi10Mg',
      method: 'SLM',
      count: '100',
      status: '待派发',
      },
      ],
      columns2: [{
      title: ' ',
      type: 'index',
      width: 60,
      align: 'center'
      }, {
      title: '军需发布',
      key: "dd1",
      align: "center",
      render: (h, params) => {
      return h(
      "div", {
      class: params.row.dd1 == '0' ? "dotGreen" : params.row
      .dd1 == '1' ? "dotOrange" : params.row.dd1 == '3' ?
      "lineGray" : "dotGray",
      },
      );
      },
      },
      {
      title: '需求分析',
      key: "dd2",
      align: 'center',
      render: (h, params) => {
      return h(
      "div", {
      class: params.row.dd2 == '0' ? "dotGreen" : params.row
      .dd2 == '1' ? "dotOrange" : params.row.dd2 == '3' ?
      "lineGray" : "dotGray",
      },
      );
      },
      },
      {
      title: '招投标',
      key: "dd3",
      align: 'center',
      render: (h, params) => {
      return h(
      "div", {
      class: params.row.dd3 == '0' ? "dotGreen" : params.row
      .dd3 == '1' ? "dotOrange" : params.row.dd3 == '3' ?
      "lineGray" : "dotGray",
      },
      );
      },
      },
      {
      title: '中标公示',
      key: "dd4",
      align: 'center',
      render: (h, params) => {
      return h(
      "div", {
      class: params.row.dd4 == '0' ? "dotGreen" : params.row
      .dd4 == '1' ? "dotOrange" : params.row.dd4 == '3' ?
      "lineGray" : "dotGray",
      },
      );
      },
      },
      {
      title: '订单派发',
      key: "dd5",
      align: 'center',
      render: (h, params) => {
      return h(
      "div", {
      class: params.row.dd5 == '0' ? "dotGreen" : params.row
      .dd5 == '1' ? "dotOrange" : params.row.dd5 == '3' ?
      "lineGray" : "dotGray",
      },
      );
      },
      },
      {
      title: '工艺设计',
      key: "dd6",
      align: 'center',
      render: (h, params) => {
      return h(
      "div", {
      class: params.row.dd6 == '0' ? "dotGreen" : params.row
      .dd6 == '1' ? "dotOrange" : params.row.dd6 == '3' ?
      "lineGray" : "dotGray",
      },
      );
      },
      },
      {
      title: '生产准备',
      key: "dd7",
      align: 'center',
      render: (h, params) => {
      return h(
      "div", {
      class: params.row.dd7 == '0' ? "dotGreen" : params.row
      .dd7 == '1' ? "dotOrange" : params.row.dd7 == '3' ?
      "lineGray" : "dotGray",
      },
      );
      },
      },
      {
      title: '3D成型',
      key: "dd8",
      align: 'center',
      render: (h, params) => {
      return h(
      "div", {
      class: params.row.dd8 == '0' ? "dotGreen" : params.row
      .dd8 == '1' ? "dotOrange" : params.row.dd8 == '3' ?
      "lineGray" : "dotGray",
      },
      );
      },
      },
      {
      title: '热处理',
      key: "dd9",
      align: 'center',
      render: (h, params) => {
      return h(
      "div", {
      class: params.row.dd9 == '0' ? "dotGreen" : params.row
      .dd9 == '1' ? "bgColorOrange" : params.row.dd9 == '3' ?
      "lineGray" : "dotGray",
      },
      );
      },
      },
      {
      title: '线切割',
      key: "dd10",
      align: 'center',
      render: (h, params) => {
      return h(
      "div", {
      class: params.row.dd10 == '0' ? "dotGreen" : params.row
      .dd10 == '1' ? "bgColorOrange" : params.row.dd10 ==
      '3' ? "lineGray" : "dotGray",
      },
      );
      },
      },
      {
      title: '后处理',
      key: "dd11",
      align: 'center',
      render: (h, params) => {
      return h(
      "div", {
      class: params.row.dd10 == '0' ? "dotGreen" : params.row
      .dd10 == '1' ? "bgColorOrange" : params.row.dd10 ==
      '3' ? "lineGray" : "dotGray",
      },
      );
      },
      },
      {
      title: 'x光检测',
      key: "dd12",
      align: 'center',
      render: (h, params) => {
      return h(
      "div", {
      class: params.row.dd10 == '0' ? "dotGreen" : params.row
      .dd10 == '1' ? "bgColorOrange" : params.row.dd10 ==
      '3' ? "lineGray" : "dotGray",
      },
      );
      },
      },
      {
      title: '机械加工',
      key: "dd12",
      align: 'center',
      render: (h, params) => {
      return h(
      "div", {
      class: params.row.dd10 == '0' ? "dotGreen" : params.row
      .dd10 == '1' ? "bgColorOrange" : params.row.dd10 ==
      '3' ? "lineGray" : "dotGray",
      },
      );
      },
      },
      ],
      list2: [{
      dd1: '0',
      dd2: '0',
      dd3: '0',
      dd4: '3',
      dd5: '0',
      dd6: '1',
      dd7: '2',
      dd8: '2',
      dd9: '2',
      dd10: '2',
      },
      {
      dd1: '0',
      dd2: '0',
      dd3: '0',
      dd4: '1',
      dd5: '2',
      dd6: '2',
      dd7: '3',
      dd8: '2',
      dd9: '2',
      dd10: '2',
      },
      {
      dd1: '0',
      dd2: '0',
      dd3: '0',
      dd4: '0',
      dd5: '1',
      dd6: '3',
      dd7: '2',
      dd8: '2',
      dd9: '2',
      dd10: '2',
      },
      {
      dd1: '0',
      dd2: '0',
      dd3: '3',
      dd4: '0',
      dd5: '0',
      dd6: '3',
      dd7: '0',
      dd8: '1',
      dd9: '2',
      dd10: '2',
      },
      {
      dd1: '0',
      dd2: '0',
      dd3: '0',
      dd4: '0',
      dd5: '3',
      dd6: '0',
      dd7: '1',
      dd8: '2',
      dd9: '2',
      dd10: '2',
      },
      {
      dd1: '0',
      dd2: '0',
      dd3: '1',
      dd4: '2',
      dd5: '2',
      dd6: '3',
      dd7: '2',
      dd8: '2',
      dd9: '2',
      dd10: '2',
      },
      ]
      };
      },
      mounted() {
      this.tableHeight1 = window.screen.availHeight / 3;
      this.tableHeight2 = (window.screen.availHeight / 3) - 30;
      this.loadEchart1();
      this.loadEchart2();
      this.loadEchart3();
      },
      methods: {
      loadEchart1() {
      var dom = document.getElementById("echart1");
      var myChart = echarts.init(dom);
      var app = {};
      var option;
      option = {
      xAxis: {
      type: 'category',
      boundaryGap: false,
      data: ['1-21', '1-22', '1-23', '1-24', '1-25', '1-26', '1-27'],
      axisLine: {
      lineStyle: {
      color: '#fff'
      }
      },
      },
      yAxis: {
      type: 'value',
      splitLine: false,
      axisLine: {
      lineStyle: {
      color: '#fff'
      }
      },
      },
      grid: {
      left: '50', //组件距离容器左边的距离
      right: '30',
      bottom: '70',
      },
      series: [{
      data: [800, 920, 1030, 1200, 1280, 1370, 1420],
      type: 'line',
      areaStyle: {
      color: {
      type: 'linear',
      x: 0,
      y: 0,
      x2: 0,
      y2: 1,
      colorStops: [{
      offset: 0,
      color: '#0c94a8' // 100% 处的颜色
      }, {
      offset: 1,
      color: '#374760' // 0% 处的颜色
      }],
      global: false // 缺省为 false
      }
      },
      }]
      };
      if (option && typeof option === 'object') {
      myChart.setOption(option);
      }
      },
      loadEchart2() {
      var dom = document.getElementById("echart2");
      var myChart = echarts.init(dom);
      var app = {};
      var option;
      option = {
      tooltip: {
      trigger: 'item',
      formatter: '{a} <br/>{b} : {c} ({d}%)'
      },
      series: [{
      name: "订单工序完成占比",
      type: "pie",
      radius: "55%",
      center: ["50%", "40%"],
      data: [{
      value: 100,
      name: "热处理"
      },
      {
      value: 120,
      name: "工艺设计"
      },
      {
      value: 150,
      name: "机械加工"
      },
      {
      value: 160,
      name: "切割线"
      },
      {
      value: 120,
      name: "设计开发"
      },
      {
      value: 150,
      name: "订单派发"
      },
      {
      value: 180,
      name: "生产准备"
      },
      {
      value: 130,
      name: "3D成型"
      },
      ].sort(function (a, b) {
      return a.value - b.value;
      }),
      roseType: "radius",
      label: {
      normal: {
      formatter: "{b}\n {d}%",
      },
      },
      itemStyle: {
      emphasis: {
      shadowBlur: 10,
      shadowOffsetX: 0,
      shadowColor: "rgba(0, 0, 0, 0.5)",
      },
      normal: {
      color: function (params) {
      //自定义颜色
      var colorList = [
      "#EA6D13",
      "#63AD1A",
      "#FDB131",
      "#069023",
      "#20B6C5",
      "#FAD70B",
      "#1A77C5",
      "#5D005D",
      ];
      return colorList[params.dataIndex];
      },
      label: {
      color: "#106FFE",
      },
      },
      },
      // animationType: "scale",
      // animationEasing: "elasticOut",
      // animationDelay: function (idx) {
      // return Math.random() * 200;
      // },
      }, ],
      };
      if (option && typeof option === 'object') {
      myChart.setOption(option);
      }
      },
      loadEchart3() {
      var dom = document.getElementById("echart3");
      var myChart = echarts.init(dom);
      var app = {};
      var option;
      option = {
      tooltip: {
      trigger: "axis",
      axisPointer: {
      type: "shadow",
      },
      },
      grid: {
      left: "3%",
      right: "4%",
      bottom: "3%",
      containLabel: true,
      },
      xAxis: {
      type: "category",
      data: ["001 ", "002", "003", "004", "005"],
      axisLine: {
      lineStyle: {
      color: '#fff'
      }
      },
      },
      yAxis: {
      type: "value",
      boundaryGap: [0, 0.01],
      splitLine: false,
      axisLine: {
      lineStyle: {
      color: '#fff'
      }
      },
      },
      series: [{
      name: "280",
      type: "bar",
      color: "#FFBB00",
      data: [18203, 23489, 29034, 104970, 131744],
      },
      {
      name: "400",
      type: "bar",
      color: "#1E9FFF",
      data: [19325, 23438, 31000, 121594, 134141],
      },
      {
      name: "310",
      type: "bar",
      color: "#009688",
      data: [19325, 23438, 31000, 121594, 134141],
      },
      {
      name: "271",
      type: "bar",
      color: "#FF5722",
      data: [19325, 23438, 31000, 121594, 134141],
      },
      ],
      };
      if (option && typeof option === 'object') {
      myChart.setOption(option);
      }
      },
      getInfo(type) {
      if (type == 1) {
      this.frameUrl="http://47.92.102.113:3000/order/monitoring/qd1/"
      }
      else if(type==2)
      {
      this.frameUrl="http://47.92.102.113:5002/%E7%94%9F%E4%BA%A7%E8%AE%A2%E5%8D%95%E7%BB%9F%E8%AE%A1.html"
      }
      else if(type==3)
      {
      this.frameUrl="http://47.92.102.113:3000/qc/datatrace/qd1/"
      }
      else if(type==4)
      {
      this.frameUrl="http://39.100.148.168:9021/#/printers"
      }
      this.modalInfo = true
      },
      getCur(currentRow, oldCurrentRow) {
      // alert("aaa")
      }
      }
      })
      </script>
      </body>
      </html>
      \ No newline at end of file
      Markdown is supported
      0% or
      You are about to add 0 people to the discussion. Proceed with caution.
      Finish editing this message first!
      Please register or to comment