inspection_details.vue 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128
  1. <template>
  2. <view class="container uni-container">
  3. <uni-section title="详情" type="line">
  4. <view class=" flex flex-direction width100">
  5. <text class="text-cut padding-sm">巡检位置:{{formData.createTime}}</text>
  6. <text class="text-cut padding-sm">巡检人:{{formData.createTime}}</text>
  7. <text class="text-cut padding-sm">巡检时间:{{formData.createTime}}</text>
  8. </view>
  9. </uni-section>
  10. <uni-section title="巡检结果" type="line">
  11. <u--textarea v-model="textareaValue" placeholder="请输入巡检结果" :maxlength="1000" count height="200">
  12. </u--textarea>
  13. </uni-section>
  14. <uni-section title="现场图片" type="line">
  15. <u-upload :fileList="fileList3" @afterRead="afterRead" @delete="deletePic" name="3" multiple :maxCount="10"
  16. :previewFullImage="true"></u-upload>
  17. </uni-section>
  18. <uni-row :gutter="20">
  19. <uni-col :span="12">
  20. <u-button shape="circle" size="small" color="#2563EB" text="立即整改"></u-button>
  21. </uni-col>
  22. <uni-col :span="12">
  23. <u-button shape="circle" size="small" color="#2563EB" text="生成隐患"></u-button>
  24. </uni-col>
  25. </uni-row>
  26. </view>
  27. </template>
  28. <script>
  29. import {
  30. addRole,
  31. changeRoleStatus,
  32. delRole,
  33. exportRole,
  34. getRole,
  35. listRole,
  36. updateRole
  37. } from "@/api/system/role";
  38. import {
  39. uploadAvatar
  40. } from "@/api/system/user"
  41. let that = null;
  42. export default {
  43. data() {
  44. return {
  45. // 数据
  46. tableData: [],
  47. // 每页数据量
  48. pageSize: 20,
  49. // 当前页
  50. pageNo: 1,
  51. // 数据总量
  52. total: 0,
  53. // tableData数据加载中
  54. loading: false,
  55. // 自定义表单数据
  56. formData: {},
  57. // 输入框的内容
  58. textareaValue: '统计字数',
  59. fileList3: [{
  60. url: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
  61. }],
  62. }
  63. },
  64. computed: {},
  65. // 在 vue页面,向起始页通过事件传递数据
  66. onLoad: function(option) {
  67. console.log("option: ",option);
  68. that = this;
  69. const eventChannel = this.getOpenerEventChannel();
  70. // eventChannel.emit('acceptDataFromOpenedPage', {
  71. // 监听acceptDataFromOpenerPage事件,获取上一页面通过eventChannel传送到当前页面的数据
  72. eventChannel.on('acceptDataFromOpenerPage', function(val) {
  73. console.log(' val', val)
  74. that.formData = val
  75. })
  76. },
  77. onReady() {},
  78. methods: {
  79. // 删除图片
  80. deletePic(event) {
  81. this[`fileList${event.name}`].splice(event.index, 1)
  82. },
  83. // 新增图片
  84. async afterRead(event) {
  85. // 当设置 mutiple 为 true 时, file 为数组格式,否则为对象格式
  86. let lists = [].concat(event.file)
  87. let fileListLen = this[`fileList${event.name}`].length
  88. lists.map((item) => {
  89. this[`fileList${event.name}`].push({
  90. ...item,
  91. status: 'uploading',
  92. message: '上传中'
  93. })
  94. })
  95. for (let i = 0; i < lists.length; i++) {
  96. const result = await this.uploadFilePromise(lists[i].url)
  97. let item = this[`fileList${event.name}`][fileListLen]
  98. this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
  99. status: 'success',
  100. message: '',
  101. url: result
  102. }))
  103. fileListLen++
  104. }
  105. },
  106. uploadFilePromise(url) {
  107. console.log(url);
  108. let data = {
  109. name: 'avatarFile',
  110. filePath: url
  111. }
  112. this.loading = true
  113. return uploadAvatar(data).then(response => {
  114. uni.showToast({
  115. title: "修改成功",
  116. icon: 'success'
  117. })
  118. })
  119. },
  120. }
  121. }
  122. </script>
  123. <style lang="scss">
  124. .buttomBorder {
  125. height: 0px;
  126. border: 1px dashed #CBD5E1;
  127. }
  128. </style>