index.vue 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150
  1. <template>
  2. <div class="scene">
  3. <span class="title1" style="line-height: 32px">{{$t('sceneHome.dyrh')}}</span>
  4. <el-button class="w-full my-4" @click="handleAdddyrh">{{$t('program.sceneDown.edit')}}</el-button>
  5. <div class="scene-list">
  6. <div class="scene-title flex justify-between content-center">
  7. <span class="title1" style="line-height: 32px">{{$t('sceneHome.sceneList')}}</span>
  8. <!-- <el-switch v-model="active" @change="handleActive" /> -->
  9. </div>
  10. <el-button
  11. class="w-full my-4"
  12. @click="handleAdd"
  13. style="margin-left: 0; margin-right: 0"
  14. >{{$t('common.add')}}</el-button
  15. >
  16. <div class="list" v-if="active" style="min-height: 630px">
  17. <div
  18. class="listItem flex justify-between py-2"
  19. v-for="(item, index) in list"
  20. :key="index"
  21. >
  22. <span class="anmc" :title="item.name">{{
  23. item.name || $t('sceneHome.dyrh')
  24. }}</span>
  25. <div class="cursor-pointer" quaternary type="primary">
  26. <span
  27. class="mr-4"
  28. @click="handlegotoelT(item)"
  29. :style="{ color: item.inFusion ? '#ccc' : '' }"
  30. >{{$t('sceneHome.yc')}}</span
  31. >
  32. <span @click="handlegotoEdit(item)">{{$t('program.sceneDown.edit')}}</span>
  33. </div>
  34. <!-- <div @click="handlegotoEdit(item)" class="cursor-pointer" quaternary type="primary">编辑</div> -->
  35. </div>
  36. </div>
  37. <!-- <el-button
  38. class="w-full"
  39. type="primary"
  40. @click="submitForm"
  41. >
  42. 保存
  43. </el-button> -->
  44. </div>
  45. </div>
  46. </template>
  47. <script setup lang="ts">
  48. import {
  49. getCaseSceneList,
  50. getUrlSrc,
  51. getSceneListTree,
  52. setCaseaddOrUpdate,
  53. } from "@/store/case";
  54. import { router } from "@/router";
  55. import comSelect from "@/components/company-select/index.vue";
  56. import List from "./list.vue";
  57. import SceneContent from "./sceneContent.vue";
  58. import { ElMessage } from "element-plus";
  59. import ModelContent from "./modelContent.vue";
  60. import { useScenePaggingParams } from "./pagging";
  61. import { computed, ref, onMounted } from "vue";
  62. import { tableModelScene } from "./quisk";
  63. import { ui18n } from '@/i18n'
  64. import { windowOpen } from "@/util";
  65. const active = ref(true);
  66. const locale = ui18n.locale
  67. const list = ref([]);
  68. const isEdit = ref(false);
  69. const showModal = ref(false);
  70. const params = useScenePaggingParams();
  71. const caseId = computed(() => router.currentRoute.value?.params?.caseId);
  72. onMounted(() => {
  73. geiList();
  74. console.log("router.currentRoute.value", caseId);
  75. });
  76. async function geiList() {
  77. list.value = await getCaseSceneList(caseId.value);
  78. console.log("res", list.value);
  79. }
  80. function handlegotoEdit(record) {
  81. let url = getUrlSrc(record, caseId.value)
  82. // record.type == 2 || record.type == 5
  83. // ? `/mega/index.html?m=${record.num}`
  84. // : `/epg.html?m=${record.num}`;
  85. windowOpen(url.replace("spg", "epg"));
  86. }
  87. function handleAdddyrh(record) {
  88. let url = getUrlSrc({ type: 100 }, caseId.value)
  89. windowOpen(url);
  90. }
  91. async function handlegotoelT(record) {
  92. isEdit.value = true;
  93. // if (record.inFusion) {
  94. // ElMessage.error("无法移除,场景已加入多元融合,请进入多元融合移除场景后再试");
  95. // return
  96. // }
  97. if (record.inFusion || (await confirm(ui18n.t('sceneHome.ycTips')))) {
  98. list.value = list.value.filter((item) => item.id !== record.id);
  99. submitForm();
  100. }
  101. // console.log("handleActive", params);
  102. }
  103. async function submitForm() {
  104. isEdit.value = false;
  105. let sublist = getSceneListTree(list.value);
  106. const apiData = {
  107. // caseTitle: caseId.value,
  108. caseId: caseId.value,
  109. sceneNumParam: sublist,
  110. };
  111. setCaseaddOrUpdate(apiData).then((res) => {
  112. geiList();
  113. ElMessage({
  114. message: ui18n.t('program.resStatus.200'),
  115. type: "success",
  116. });
  117. }).catch((errr) => {
  118. console.log("setCaseaddOrUpdateerrr", errr);
  119. return geiList();
  120. })
  121. };
  122. // window.location.reload()
  123. // console.log("handleActive", params);
  124. async function handleAdd() {
  125. // if(isEdit.value){
  126. // await confirm("请先保存当前移除的场景信息!")
  127. // return
  128. // }
  129. let numList = list.value.map((item) => item.num);
  130. console.log("handleAdd", numList);
  131. let val = await tableModelScene({ numList: numList });
  132. geiList();
  133. if (val) {
  134. console.log("刷新列表");
  135. }
  136. }
  137. </script>
  138. <style scoped>
  139. .anmc {
  140. overflow: hidden;
  141. text-overflow: ellipsis;
  142. white-space: nowrap;
  143. width: 190px;
  144. }
  145. .cursor-pointer {
  146. color: var(--primaryColor);
  147. }
  148. </style>