addTabFunNum.vue 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
  1. <template>
  2. <!-- 新增表号-功能号 -->
  3. <div id="addTabFunNum">
  4. <el-form :model='form' label-width="150px" ref="ruleForm" :rules="rules" style="height:500px;overflow:auto;">
  5. <el-form-item label="表号-功能号" prop="Id">
  6. <el-input v-model="form.Id"></el-input>
  7. </el-form-item>
  8. <el-form-item label="设定采集间隔时间" prop="intervalTime">
  9. <el-input v-model="form.intervalTime" placeholder="设定时间不能小于10s"></el-input>
  10. </el-form-item>
  11. <el-form-item label="值单位" prop="unit">
  12. <el-select v-model="form.unit" placeholder="请选择">
  13. <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
  14. </el-select>
  15. </el-form-item>
  16. <el-form-item label="取直公式" prop="formula">
  17. <el-input type="textarea" placeholder="请输入取值公式" v-model="form.formula"></el-input>
  18. </el-form-item>
  19. <el-form-item label="">
  20. <el-button type="primary" @click="add()">新增</el-button>
  21. <el-button @click="$emit('closeDrawer')">取消</el-button>
  22. </el-form-item>
  23. </el-form>
  24. </div>
  25. </template>
  26. <script>
  27. import { mapGetters, mapActions } from 'vuex'
  28. import {
  29. addTabFunNum
  30. } from '@/api/point/request'
  31. export default {
  32. data() {
  33. return {
  34. form: {
  35. Id: 'xx-xxx',//表号-功能号
  36. intervalTime: '',//采集间隔时间
  37. formula: 'xxxxxxxxxx',//取值公式
  38. unit: '',//值单位
  39. },
  40. //下拉框选项
  41. options: [
  42. {
  43. value: '选项1',
  44. label: '选项1'
  45. }, {
  46. value: '选项2',
  47. label: '选项2'
  48. },
  49. ],
  50. //验证规则
  51. rules: {
  52. Id: [
  53. { required: true, message: '请输入表号-功能号', trigger: 'blur' }
  54. ],
  55. intervalTime: [
  56. { required: true, message: '请输入采集间隔时间', trigger: 'blur' }
  57. ],
  58. formula: [
  59. { required: true, message: '请选择值单位', trigger: 'change' }
  60. ],
  61. unit: [
  62. { required: true, message: '请填写取直公式', trigger: 'blur' }
  63. ]
  64. }
  65. }
  66. },
  67. computed: {
  68. ...mapGetters('layout', ['projectId', 'userId'])
  69. },
  70. methods: {
  71. //添加
  72. add() {
  73. this.$refs.ruleForm.validate((valid) => {
  74. if (valid) {
  75. addTabFunNum(this.form, res => {
  76. });
  77. } else {
  78. console.log('error submit!!');
  79. return false;
  80. }
  81. });
  82. }
  83. }
  84. }
  85. </script>
  86. <style lang="less" scoped>
  87. </style>