邃芒慧影管理端
Du kan inte välja fler än 25 ämnen Ämnen måste starta med en bokstav eller siffra, kan innehålla bindestreck ('-') och vara max 35 tecken långa.
 
 
 
 

90 rader
2.2 KiB

  1. <template>
  2. <div>
  3. <el-checkbox-group v-model="checkboxGroup" size="small" class="checkbox">
  4. <el-checkbox v-for="(item, index) in tableData" :key="index" :label="item.id" border>
  5. <img :src="item.coverImg" width="50" />
  6. <p>{{ item.title }}</p>
  7. </el-checkbox>
  8. </el-checkbox-group>
  9. <div style="margin-top: 20px">
  10. <el-button @click="handleClose"
  11. >{{$t('personMould.cancel')}}</el-button
  12. >
  13. <el-button type="primary" @click="addModel()">{{$t('personMould.confirm')}}</el-button>
  14. </div>
  15. </div>
  16. </template>
  17. <script setup>
  18. import { ref } from 'vue'
  19. import { personMouldListApi, userPersonMouldIdListApi, associatedUserMouldsApi } from '@/apis/userManage.js'
  20. import dayjs from "dayjs";
  21. import { useI18n } from "vue-i18n";
  22. const { locale } = useI18n();
  23. const lanChange = ref(locale);
  24. const emit = defineEmits(["close"]);
  25. const props = defineProps({
  26. cUserId: {
  27. required: true,
  28. }
  29. });
  30. const getDate = (val) => {
  31. return dayjs(val).format("YYYY-MM-DD");
  32. };
  33. const checkboxGroup = ref([])
  34. const total = ref(0);
  35. const tableData = ref([]);
  36. const modelAllListFunc = async () => {
  37. try {
  38. const res = await personMouldListApi(1, 10000);
  39. const modelIds = await userPersonMouldIdListApi(props.cUserId);
  40. tableData.value = res.data.list;
  41. total.value = res.data.total * 1;
  42. setTimeout(()=> {
  43. if(modelIds.data && modelIds.data.length > 0) {
  44. modelIds.data.forEach((item) => {
  45. checkboxGroup.value.push(item)
  46. })
  47. }
  48. }, 500)
  49. } catch (error) {
  50. console.log(error, "err");
  51. }
  52. };
  53. const addModel = async () => {
  54. const data = {
  55. mouldIds: checkboxGroup.value,
  56. userId: props.cUserId
  57. }
  58. const res = await associatedUserMouldsApi(data);
  59. if(res.code === 200) {
  60. ElMessage.success((lanChange.value) == "zh-cn" ? "关联成功!" : 'Successfully associated!');
  61. handleClose()
  62. }
  63. };
  64. function handleClose() {
  65. emit("close");
  66. }
  67. onMounted(() => {
  68. modelAllListFunc(1, 10);
  69. });
  70. </script>
  71. <style lang="scss" scoped>
  72. .checkbox {
  73. max-height: 500px;
  74. overflow: auto;
  75. :deep .el-checkbox.el-checkbox--small {
  76. width: 110px;
  77. height:110px;
  78. margin-bottom: 10px;
  79. }
  80. }
  81. </style>