basics.vue 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455
  1. <template>
  2. <view class="control">
  3. <view class="control-title">
  4. 基础控制
  5. </view>
  6. <view class="current">
  7. <view class="item" v-for="item in preview" :key="item.w_functionid">
  8. <view class="label">{{ item.paramName }}</view>
  9. <view class="value">{{ item.lastvalue || '' }}{{ item.unit || '' }}</view>
  10. </view>
  11. </view>
  12. <view class="show-list">
  13. <control-item v-for="item in itemList" :key="item.w_functionid" :item="item" @click.native="onClick(item)" />
  14. </view>
  15. <My_input ref="MyInput" />
  16. </view>
  17. </template>
  18. <script>
  19. export default {
  20. name: "basics",
  21. data() {
  22. return {
  23. itemList: [],
  24. preview: []
  25. }
  26. },
  27. methods: {
  28. onClick(item) {
  29. this.$refs.MyInput.openInput(item)
  30. }
  31. }
  32. }
  33. </script>
  34. <style lang="scss" scoped>
  35. .current {
  36. display: flex;
  37. justify-content: space-around;
  38. color: #fff;
  39. margin-bottom: 10px;
  40. font-size: 12px;
  41. .label {
  42. margin-bottom: 5px;
  43. }
  44. }
  45. .show-list {
  46. display: flex;
  47. flex-wrap: wrap;
  48. justify-content: space-between;
  49. margin-top: -5px;
  50. box-sizing: border-box;
  51. }
  52. </style>