1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768 |
- <template>
- <div class="aside-table-container">
- <div class="aside-header">
- <h3>{{ currentPosition ? currentPosition.title + ' - 问题列表' : '请选择职位' }}</h3>
- </div>
- <fs-crud ref="asideCrudRef" v-bind="crudBinding"></fs-crud>
- </div>
- </template>
- <script lang="ts" setup>
- import { ref, onMounted, watch } from 'vue';
- import { useFs } from '@fast-crud/fast-crud';
- import { createAsideCrudOptions } from './crud';
- import { ElMessage } from 'element-plus';
- const props = defineProps({
- positionId: {
- type: [String, Number],
- default: ''
- },
- currentPosition: {
- type: Object,
- default: () => null
- }
- });
- const emit = defineEmits(['refresh']);
- const { crudBinding, crudRef: asideCrudRef, crudExpose } = useFs({ createCrudOptions: createAsideCrudOptions });
- // 监听职位ID变化,刷新问题列表
- watch(() => props.positionId, (newVal) => {
- if (newVal) {
- loadQuestions(newVal);
- }
- }, { immediate: true });
- // 加载问题列表
- const loadQuestions = (positionId) => {
- if (!positionId) return;
-
- crudExpose.doSearch({
- form: {
- job_id: positionId
- }
- });
- };
- // 暴露方法给父组件
- defineExpose({
- refresh: () => crudExpose.doRefresh(),
- asideCrudRef
- });
- </script>
- <style lang="scss" scoped>
- .aside-table-container {
- height: 100%;
- display: flex;
- flex-direction: column;
- }
- .aside-header {
- padding: 10px 0;
- border-bottom: 1px solid #ebeef5;
- margin-bottom: 10px;
- }
- </style>
|