environment.vue 2.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. <template>
  2. <!-- environment -->
  3. <div class="Environment">
  4. <h2 style="margin-bottom: 20px;padding-bottom:7px;border-bottom:2px solid #ddd">温湿度曲线</h2>
  5. <formList
  6. v-model="list"
  7. :title="['时间','温度','湿度']"
  8. inputWidth="150px"
  9. titleWidth="100px"
  10. ></formList>
  11. <el-button style="margin-left:610px" type="primary" @click="onSubmit">更新信息</el-button>
  12. </div>
  13. </template>
  14. <script>
  15. import { reqEnvironment, reqSetEnvironment } from "@/api/breed.js";
  16. export default {
  17. name: "Environment",
  18. data() {
  19. return {
  20. list: [
  21. {
  22. time: "",
  23. temp: "",
  24. humidity: ""
  25. }
  26. ]
  27. };
  28. },
  29. created() {
  30. this.getEnvironment();
  31. },
  32. methods: {
  33. onSubmit() {
  34. let time = [];
  35. let temp = [];
  36. let humidity = [];
  37. this.list.forEach(item => {
  38. time.push(item.time);
  39. temp.push(item.temp);
  40. humidity.push(item.humidity);
  41. });
  42. this.$confirm("确定更新信息?").then(() => {
  43. reqSetEnvironment({
  44. time: time.toString(),
  45. temp: temp.toString(),
  46. humidity: humidity.toString()
  47. })
  48. .then(res => {
  49. if (res.errCode) {
  50. this.$message.error(res.errMsg);
  51. } else {
  52. this.$message.success("更新成功!");
  53. this.getEnvironment();
  54. }
  55. })
  56. .catch(err => {
  57. console.log(err);
  58. this.$message.error("更新失败!");
  59. });
  60. });
  61. },
  62. getEnvironment() {
  63. reqEnvironment()
  64. .then(res => {
  65. let arr2 = res.conf["temp"];
  66. let arr3 = res.conf["humidity"];
  67. this.list = [];
  68. res.conf["time"].forEach((item, i) => {
  69. this.list.push({
  70. time: item,
  71. temp: arr2[i],
  72. humidity: arr3[i]
  73. });
  74. });
  75. })
  76. .catch(err => {
  77. console.error(err);
  78. });
  79. }
  80. }
  81. };
  82. </script>
  83. <style lang="scss" scoped>
  84. .Environment {
  85. .left {
  86. width: 400px;
  87. margin-left: 50px;
  88. }
  89. }
  90. </style>