You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

84 lines
1.9 KiB

  1. <template>
  2. <view class="cu-form-group">
  3. <view class="grid col-4 grid-square flex-sub">
  4. <view
  5. v-for="(path, index) in value"
  6. @tap="viewImg"
  7. :key="index"
  8. class="bg-img"
  9. >
  10. <image
  11. v-if="showfile()"
  12. :src="path.path ? path.path : path"
  13. mode="aspectFill"
  14. ></image>
  15. <view v-if="!readonly" @tap.stop="delImg(index)" class="cu-tag bg-red">
  16. <l-icon
  17. type="close"
  18. style="width: 18px; height: 24px; font-size: 24px"
  19. />
  20. </view>
  21. </view>
  22. <view
  23. v-if="!readonly && value.length < Number(number)"
  24. @tap="chooseImg"
  25. class="solids"
  26. >
  27. <l-icon type="cameraadd" />
  28. </view>
  29. </view>
  30. </view>
  31. </template>
  32. <script>
  33. export default {
  34. name: "l-upload",
  35. props: {
  36. number: { default: 1 },
  37. readonly: {},
  38. value: { default: () => [] },
  39. },
  40. methods: {
  41. delImg(index) {
  42. const newList = JSON.parse(JSON.stringify(this.value));
  43. newList.splice(index, 1);
  44. this.$emit("input", newList);
  45. this.$emit("change");
  46. this.$emit("del");
  47. },
  48. showfile() {
  49. console.log(this.value);
  50. return true;
  51. },
  52. chooseImg() {
  53. uni.chooseImage({
  54. count: Number(this.number),
  55. sizeType: ["original", "compressed"],
  56. sourceType: ["album", "camera"],
  57. success: ({ tempFilePaths }) => {
  58. const newList = JSON.parse(JSON.stringify(this.value || [])).concat(
  59. tempFilePaths
  60. );
  61. //this.$parent.HTTP_UPLOAD(tempFilePaths[0]);
  62. this.$emit("input", newList);
  63. this.$emit("change");
  64. this.$emit("add");
  65. },
  66. });
  67. },
  68. viewImg(index) {
  69. uni.previewImage({
  70. urls: this.value,
  71. current: this.value[index],
  72. });
  73. },
  74. },
  75. };
  76. </script>