ItemModal.vue 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111
  1. <template>
  2. <el-dialog
  3. :title="title"
  4. :visible.sync="modal"
  5. width="500px"
  6. :close-on-click-modal="false"
  7. @close="
  8. res => {
  9. $emit('cancel');
  10. }
  11. "
  12. >
  13. <el-form ref="form" :model="form" :rules="rules" label-width="100px">
  14. <el-form-item label="图片" prop="urls" required>
  15. <!-- <mult-upload
  16. v-model="form.urls"
  17. :uploadUrl="$upload('/yxl-back-end/framework/oss/minio/upload')"
  18. :limit="10"
  19. params="prefix="
  20. /> -->
  21. <upload
  22. v-model="form.urls"
  23. :uploadUrl="$upload('/yxl-back-end/framework/oss/minio/upload')"
  24. :limit="10"
  25. params="prefix="
  26. />
  27. </el-form-item>
  28. <el-form-item label="关联场景" prop="kindergartenId">
  29. <SceneSelect v-model="form.kindergartenId" />
  30. </el-form-item>
  31. <el-form-item label="关联活动">
  32. <ActivitySelect
  33. v-model="form.activityId"
  34. :kindergartenId="form.kindergartenId"
  35. :firstLoad="false"
  36. :disabled="form.kindergartenId === null"
  37. />
  38. </el-form-item>
  39. </el-form>
  40. <span slot="footer" class="dialog-footer">
  41. <el-button @click="modal = false">取消</el-button>
  42. <el-button type="primary" @click="handleConfirm">确定</el-button>
  43. </span>
  44. </el-dialog>
  45. </template>
  46. <script>
  47. import { saveItem } from '@/api/photoWarehouse';
  48. export default {
  49. name: 'PhotoUploadModal',
  50. data() {
  51. return {
  52. title: '上传图片',
  53. modal: true,
  54. form: {
  55. urls: [],
  56. kindergartenId: '',
  57. activityId: ''
  58. },
  59. rules: {
  60. urls: [{ required: true, message: '请上传图片', trigger: 'change' }],
  61. kindergartenId: [{ required: true, message: '请选择关联场景', trigger: 'blur' }]
  62. }
  63. };
  64. },
  65. watch: {
  66. 'form.kindergartenId': {
  67. handler(val) {
  68. this.form.activityId = '';
  69. },
  70. immediate: true
  71. }
  72. },
  73. mounted() {},
  74. methods: {
  75. handleConfirm() {
  76. this.$refs.form.validate(async valid => {
  77. if (valid) {
  78. // let params = this.form.urls.map(x => ({
  79. // activityId: this.form.activityId,
  80. // kindergartenId: this.form.kindergartenId,
  81. // originPhoto: x.url,
  82. // size: x.size,
  83. // originFilename: x.name
  84. // }));
  85. let params = this.form;
  86. params.fileRequestList = this.form.urls.map(x => ({
  87. originalFilename: x.name,
  88. size: x.size,
  89. fullPath: x.url
  90. }));
  91. const { success, msg } = await saveItem(params);
  92. if (success) {
  93. this.$success('保存成功!');
  94. this.modal = false;
  95. this.$g_emit('photo_reload');
  96. }
  97. }
  98. });
  99. }
  100. }
  101. };
  102. </script>
  103. <style lang="scss" scoped></style>