jcyjdt_studio/src/views/user/scientist/studio/index.vue

<template>
  <div id="index">
    <el-col class="main animate__animated animate__backInRight">
      <el-col :span="24" class="one">
        <component :is="partsSearch" :is_search="true" :fields="fields" @search="partSearch">
          <template #studio_id>
            <el-option v-for="i in studioList" :key="i._id" :label="i.name" :value="i._id"></el-option>
          </template>
        </component>
      </el-col>
      <el-col :span="24" class="two">
        <component
          :is="CTable"
          :fields="fields"
          :opera="opera"
          :select="false"
          :selected="selected"
          @handleSelect="handleSelect"
          @query="search"
          :data="tableData"
          :total="total"
          @view="toView"
        >
        </component>
      </el-col>
    </el-col>
  </div>
</template>
<script setup lang="ts">
import store from '@/stores/counter';
import { ElMessage } from 'element-plus';
// #region 组件
import partsSearch from '@/components/c-search.vue';
import CTable from '@/components/c-table.vue';
// #endregion
import type { Ref } from 'vue';
import { ref, onMounted, getCurrentInstance } from 'vue';
import { useRouter } from 'vue-router';
// #region 接口
import { ScientistsettleStore } from '@common/src/stores/studio/studios/scientistsettle'; // 入驻科学家工作室
import { UserStudioApplyStore } from '@common/src/stores/studio/role/userStudioApply'; // 个人账号申请科学家工作室权限表
import { StudioStore } from '@common/src/stores/studio/studios/studio'; // 工作室
import { DictDataStore } from '@common/src/stores/users/sysdictdata'; // 字典表
import type { IQueryResult } from '@/util/types.util';
const scientistsettle = ScientistsettleStore();
const userStudioApply = UserStudioApplyStore();
const studio = StudioStore();
const sysdictdata = DictDataStore();
const { proxy } = getCurrentInstance() as any;
const router = useRouter();
// #endregion
// 列表数据
let tableData: Ref<any[]> = ref([]);
// 列表
let fields: Ref<any[]> = ref([
  { label: '序号', options: { type: 'index' } },
  {
    label: '工作室名称',
    model: 'studio_id',
    type: 'select',
    format: (i: string) => {
      let data = studioList.value.find((r) => r._id == i);
      if (data) return data.name || data.apply_name;
    },
    isSearch: true,
  },
  { label: '依托单位', model: 'company_name', isSearch: true },
  { label: '入驻科学家', model: 'scientist_name' },
  {
    label: '团队成员',
    model: 'team',
    format: (i: Array<any>) => {
      let name = '';
      if (i && i.length > 0) {
        let p1 = i.map((i: { name: string }) => i.name);
        name = p1.join(',');
        return name;
      } else {
        return '暂无';
      }
    },
  },
]);
// 操作
let opera: Ref<any[]> = ref([{ label: '详情', method: 'view' }]);
// 多选
let selected: Ref<any[]> = ref([]);
// 总数
let total: Ref<number> = ref(0);
let skip = 0;
let limit: number = proxy.$limit;
// 用户信息
let user: Ref<{ _id: string; name: string; unit_name: string; nick_name: string }> = ref({ _id: '', name: '', unit_name: '', nick_name: '' });
// 查询数据
let searchForm: Ref<{}> = ref({});
// 个人用户信息
let userInfo: Ref<{ _id: String; user_id: String; status: String }> = ref({ _id: '', user_id: '', status: '' });
// 领域
let fieldList: Ref<any[]> = ref([]);
// 工作室信息
let studioList: Ref<any[]> = ref([]);
// 工作室查询列表
let searchStudioList: Ref<any[]> = ref([]);
onMounted(async () => {
  user.value = store.state.user as { _id: string; name: string; unit_name: string; nick_name: string };
  await searchUser();
  await searchOther();
  await search({ skip, limit });
  await searchStudio();
});
const searchUser = async () => {
  const res: IQueryResult = await userStudioApply.query({ user_id: user.value._id });
  let list = res.data as any[];
  if (res.total > 0) userInfo.value = list[0];
};
const searchStudio = async () => {
  const res: IQueryResult = await scientistsettle.query({ scientist_id: userInfo.value._id });
  let studio = res.data as any[];
  if (res.total > 0) {
    let list = [];
    for (const val of studio) {
      let data = studioList.value.find((r: { id: string }) => r.id == val.studio_id);
      if (data) {
        let obj = { id: val.id, name: data.name || '', apply_name: data.apply_name };
        list.push(obj);
      }
    }
    searchStudioList.value = list;
  }
};
// 查询
const search = async (e: { skip: number; limit: number }) => {
  if (userInfo && userInfo.value.user_id && userInfo.value.status == '1') {
    const { skip, limit } = e;
    let info = { limit: limit, skip: skip, ...searchForm.value, user_id: userInfo.value.user_id };
    const res: IQueryResult = await scientistsettle.query(info);
    tableData.value = res.data as any[];
    total.value = res.total;
  } else {
    ElMessage({ type: 'warning', message: `用户未完成信息填报/信息填报未完成审核，无法查询相关信息` });
  }
};
// 查询
const partSearch = (form: { [x: string]: any }) => {
  searchForm.value = form;
  search({ skip, limit });
};
// 查看详情
const toView = async (data: { studio_id: string }) => {
  if (data.studio_id) {
    router.push({ path: '/user/scientist/studio/info', query: { id: data.studio_id } });
  } else {
    ElMessage({ message: '暂无工作室信息', type: 'warning' });
  }
};
// 选择
const handleSelect = () => {};
// 查询其他信息
const searchOther = async () => {
  // 工作室信息
  const p1: IQueryResult = await studio.query();
  studioList.value = p1.data as [];
  // 领域
  const p2: IQueryResult = await sysdictdata.query({ dict_type: 'studio_field' });
  fieldList.value = p2.data as [];
};
</script>
<style scoped></style>