legendremarks.vue 1.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. /**
  2. *@author:Guoxiaohuan
  3. *@date:2020.05.27
  4. *@info:楼层功能-编辑图例备注
  5. */
  6. <template>
  7. <div class='editModel'>
  8. <a-modal v-model='visible' :title='title' @ok='handleOk' ok-text='保存' cancel-text='取消' :maskClosable='false' :width='648'>
  9. <!-- <wd-editor :width='width' :height='height' :text='content'></wd-editor> -->
  10. <markEditorBar v-model='detail' :isClear='isClear' @change='change'></markEditorBar>
  11. </a-modal>
  12. </div>
  13. </template>
  14. <script>
  15. import markEditorBar from '@/components/marksEnduit'
  16. export default {
  17. name: 'EditdMarks',
  18. data() {
  19. return {
  20. editText: '',
  21. title: '编辑图例备注',
  22. visible: false,
  23. width: '600px',
  24. height: '156px',
  25. content: '1.主要设备房包括:制冷机房、生活水泵房、消防泵房2.图例后的数字,代表此位置的数量',
  26. isClear: false,
  27. detail: '<p>刚开始的。。。</p><p>第二条数据的。。。</p>'
  28. }
  29. },
  30. components: { markEditorBar },
  31. methods: {
  32. change(val) {
  33. this.editText = this.detail + val
  34. this.$emit('editChange', this.editText)
  35. console.log('传给后台的', val)
  36. console.log(typeof val)
  37. },
  38. showModal() {
  39. this.visible = true
  40. },
  41. handleOk() {
  42. this.visible = false
  43. }
  44. },
  45. mounted() {}
  46. }
  47. </script>
  48. <style lang="less" >
  49. .editModel {
  50. .ant-modal-body {
  51. padding: 0 24px 35px !important;
  52. }
  53. }
  54. </style>