|
@@ -1,11 +1,21 @@
|
|
<template>
|
|
<template>
|
|
- <a-tabs :active-key="params.type" @update:active-key="updateType">
|
|
|
|
- <a-tab-pane
|
|
|
|
- v-for="option in tabOptions"
|
|
|
|
- :key="option.key"
|
|
|
|
- :tab="option.label as any"
|
|
|
|
- />
|
|
|
|
- </a-tabs>
|
|
|
|
|
|
+ <div class="tabs">
|
|
|
|
+ <a-tooltip
|
|
|
|
+ placement="topLeft"
|
|
|
|
+ :title="`项目仅能选择相同类型且点位数相同的场景`"
|
|
|
|
+ >
|
|
|
|
+ <span class="help">
|
|
|
|
+ <QuestionOutlined />
|
|
|
|
+ </span>
|
|
|
|
+ </a-tooltip>
|
|
|
|
+ <a-tabs :active-key="params.type" @update:active-key="updateType">
|
|
|
|
+ <a-tab-pane
|
|
|
|
+ v-for="option in tabOptions"
|
|
|
|
+ :key="option.key"
|
|
|
|
+ :tab="(option.label as any)"
|
|
|
|
+ />
|
|
|
|
+ </a-tabs>
|
|
|
|
+ </div>
|
|
<a-input-search
|
|
<a-input-search
|
|
v-model:value="sceneName"
|
|
v-model:value="sceneName"
|
|
allow-clear
|
|
allow-clear
|
|
@@ -20,7 +30,9 @@
|
|
:pagination="pagination"
|
|
:pagination="pagination"
|
|
:row-selection="{
|
|
:row-selection="{
|
|
getCheckboxProps: (scene: Scene) => ({
|
|
getCheckboxProps: (scene: Scene) => ({
|
|
- disabled: scene.bind && !defaultTypeNums[params.type].some(num => scene.num === num)
|
|
|
|
|
|
+ disabled: scene.bind &&
|
|
|
|
+ !defaultTypeNums[params.type].some(num => scene.num === num) ||
|
|
|
|
+ (selectFirstScene && ( scene.type.toString() !== selectType || scene.shootCount !== selectNum ))
|
|
}),
|
|
}),
|
|
selectedRowKeys: typeNums[params.type],
|
|
selectedRowKeys: typeNums[params.type],
|
|
onChange: changeSelectNums
|
|
onChange: changeSelectNums
|
|
@@ -31,7 +43,7 @@
|
|
|
|
|
|
<script lang="ts" setup>
|
|
<script lang="ts" setup>
|
|
import { selectSceneColumns as sceneColumns } from './columns'
|
|
import { selectSceneColumns as sceneColumns } from './columns'
|
|
-import { reactive, ref } from 'vue'
|
|
|
|
|
|
+import { computed, reactive, ref } from 'vue'
|
|
import { fetchScenes, SceneType, SceneTypeDesc } from '@/api'
|
|
import { fetchScenes, SceneType, SceneTypeDesc } from '@/api'
|
|
import { usePaging } from '@/hook'
|
|
import { usePaging } from '@/hook'
|
|
|
|
|
|
@@ -39,21 +51,37 @@ import type { SelectTypeScenes, Scene } from '@/store'
|
|
|
|
|
|
defineOptions<{ name: 'select-scene-list' }>()
|
|
defineOptions<{ name: 'select-scene-list' }>()
|
|
|
|
|
|
-const props = defineProps<{ typeNums: SelectTypeScenes }>()
|
|
|
|
|
|
+const props = defineProps<{
|
|
|
|
+ sceneList: Scene[]
|
|
|
|
+ typeNums: SelectTypeScenes
|
|
|
|
+ scenesCount: { [key in string]: number }
|
|
|
|
+}>()
|
|
const emit = defineEmits<{
|
|
const emit = defineEmits<{
|
|
(e: 'update:typeNums', value: SelectTypeScenes): void
|
|
(e: 'update:typeNums', value: SelectTypeScenes): void
|
|
|
|
+ (e: 'update:sceneList', value: Scene[]): void
|
|
}>()
|
|
}>()
|
|
|
|
|
|
-const tabOptions = [SceneType.SWKJ, SceneType.SWKK, SceneType.SWSS].map(
|
|
|
|
- type => ({
|
|
|
|
- key: type,
|
|
|
|
- label: SceneTypeDesc[type]
|
|
|
|
- })
|
|
|
|
-)
|
|
|
|
|
|
+const tabOptions = [
|
|
|
|
+ SceneType.SWKJ,
|
|
|
|
+ SceneType.SWKK,
|
|
|
|
+ SceneType.SWSS,
|
|
|
|
+ SceneType.SWSG
|
|
|
|
+].map(type => ({
|
|
|
|
+ key: type,
|
|
|
|
+ label: SceneTypeDesc[type]
|
|
|
|
+}))
|
|
|
|
|
|
const defaultTypeNums = { ...props.typeNums }
|
|
const defaultTypeNums = { ...props.typeNums }
|
|
const sceneName = ref('')
|
|
const sceneName = ref('')
|
|
const params = reactive({ type: SceneType.SWSS, sceneName: '' })
|
|
const params = reactive({ type: SceneType.SWSS, sceneName: '' })
|
|
|
|
+const selectFirstScene = computed(() =>
|
|
|
|
+ Object.entries(props.typeNums).find(([k, v]) => v.length > 0)
|
|
|
|
+)
|
|
|
|
+const selectType = computed(() => selectFirstScene.value?.[0])
|
|
|
|
+const selectNum = computed(() => {
|
|
|
|
+ const nums = selectFirstScene.value?.[1]
|
|
|
|
+ return nums && props.scenesCount[nums[0]]
|
|
|
|
+})
|
|
const { list, pagination } = usePaging(fetchScenes, params)
|
|
const { list, pagination } = usePaging(fetchScenes, params)
|
|
|
|
|
|
const updateType = (type: any) => {
|
|
const updateType = (type: any) => {
|
|
@@ -66,9 +94,30 @@ const changeSelectNums = (nums: any[]) => {
|
|
const reserve = currentNums.filter(num =>
|
|
const reserve = currentNums.filter(num =>
|
|
list.value.every(scene => scene.num !== num)
|
|
list.value.every(scene => scene.num !== num)
|
|
)
|
|
)
|
|
|
|
+ emit('update:sceneList', [
|
|
|
|
+ ...props.sceneList.filter(item => item.type === params.type),
|
|
|
|
+ ...list.value.filter(item => nums.includes(item.num))
|
|
|
|
+ ])
|
|
|
|
+
|
|
emit('update:typeNums', {
|
|
emit('update:typeNums', {
|
|
...props.typeNums,
|
|
...props.typeNums,
|
|
[params.type]: [...reserve, ...nums]
|
|
[params.type]: [...reserve, ...nums]
|
|
})
|
|
})
|
|
}
|
|
}
|
|
</script>
|
|
</script>
|
|
|
|
+
|
|
|
|
+<style lang="scss" scoped>
|
|
|
|
+.tabs {
|
|
|
|
+ position: relative;
|
|
|
|
+ .help {
|
|
|
|
+ position: absolute;
|
|
|
|
+ right: 0;
|
|
|
|
+ top: 10px;
|
|
|
|
+ width: 20px;
|
|
|
|
+ height: 20px;
|
|
|
|
+ z-index: 99;
|
|
|
|
+ text-align: center;
|
|
|
|
+ line-height: 20px;
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+</style>
|