index.vue 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102
  1. <template>
  2. <div class="doc">
  3. <view class="box">
  4. <u-badge :value="value.length">
  5. </u-badge>
  6. </view>
  7. <u-button :plain="true" :hairline="true" v-if="type != 'view'" size='mini' text="上传"
  8. @click="handleUpload"></u-button>
  9. <u-button :plain="true" :hairline="true" v-else size='mini' text="查看" @click="handleUpload"></u-button>
  10. <docList ref="docListRef" @getFiles="getFiles"></docList>
  11. </div>
  12. </template>
  13. <script>
  14. import docList from './docList.vue';
  15. export default {
  16. name: 'index',
  17. components: {
  18. docList
  19. },
  20. model: {
  21. prop: 'value',
  22. event: 'updateVal'
  23. },
  24. props: {
  25. type: {
  26. type: String,
  27. default: ''
  28. },
  29. value: {
  30. type: Array,
  31. default: () => {
  32. return [];
  33. }
  34. }
  35. },
  36. data() {
  37. return {
  38. selectVal: ''
  39. };
  40. },
  41. watch: {
  42. value: {
  43. handler(newVal) {
  44. this.selectVal = newVal || [];
  45. },
  46. immediate: true
  47. }
  48. },
  49. created() {
  50. // uni.$off('getFiles')
  51. // uni.$on('getFiles', (id) => {
  52. // this.getFiles(id)
  53. // })
  54. },
  55. destroyed() {
  56. // uni.$off('getFiles')
  57. },
  58. methods: {
  59. handleUpload() {
  60. let type = this.type
  61. this.$refs.docListRef.open(this.selectVal,type)
  62. // uni.navigateTo({
  63. // url: '/pages/doc/docList?fileId=' + JSON.stringify(this.selectVal) + '&type=' + type
  64. // })
  65. },
  66. getFiles(val = []) {
  67. this.$emit('updateVal', val);
  68. }
  69. }
  70. };
  71. </script>
  72. <style scoped lang="scss">
  73. .doc {
  74. position: relative;
  75. .box {
  76. position: absolute;
  77. right: -20rpx;
  78. top: -15rpx;
  79. width: 40rpx;
  80. z-index: 999;
  81. }
  82. uni-button {
  83. width: 100rpx;
  84. // height: 50rpx;
  85. margin-left: 10rpx;
  86. margin-right: 0;
  87. color: #fff !important;
  88. border: none;
  89. background: #157a2c !important;
  90. }
  91. }
  92. </style>