|
|
|
|
|
const { ipcRenderer } = require('electron');
|
|
|
|
|
|
const RendererEvent = require('../../lib/eazax/renderer-event');
|
|
|
|
|
|
const { getUrlParam } = require('../../lib/eazax/browser-util');
|
|
|
|
|
|
const { translate } = require('../../lib/eazax/i18n');
|
|
|
|
|
|
const { ICON_MAP } = require('../../icon-map');
|
|
|
|
|
|
|
|
|
|
|
|
// 导入 Vue 工具函数
|
|
|
|
|
|
const { ref, watch, onMounted, onBeforeUnmount, createApp } = Vue;
|
|
|
|
|
|
|
|
|
|
|
|
/** 当前语言 */
|
|
|
|
|
|
const LANG = getUrlParam('lang');
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 定义 ref-item 组件
|
|
|
|
|
|
const RefItem = {
|
|
|
|
|
|
template: '#ref-item-template',
|
|
|
|
|
|
props: ['item'],
|
|
|
|
|
|
emits: ['item-click'],
|
|
|
|
|
|
setup(props) {
|
|
|
|
|
|
const isExpanded = ref(true);
|
|
|
|
|
|
|
|
|
|
|
|
const toggleExpand = () => {
|
|
|
|
|
|
isExpanded.value = !isExpanded.value;
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
return {
|
|
|
|
|
|
isExpanded,
|
|
|
|
|
|
toggleExpand
|
|
|
|
|
|
};
|
|
|
|
|
|
}
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
// 构建 Vue 应用
|
|
|
|
|
|
const App = {
|
|
|
|
|
|
|
|
|
|
|
|
// 需要自定义组件
|
|
|
|
|
|
components: {
|
|
|
|
|
|
RefItem
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
|
* 设置
|
|
|
|
|
|
* @param {*} props
|
|
|
|
|
|
* @param {*} context
|
|
|
|
|
|
*/
|
|
|
|
|
|
setup(props, context) {
|
|
|
|
|
|
// 数据
|
|
|
|
|
|
const results = ref([]);
|
|
|
|
|
|
const selectedItem = ref(null);
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
|
* 项点击事件处理函数
|
|
|
|
|
|
* @param {IRef} item 点击的项
|
|
|
|
|
|
*/
|
|
|
|
|
|
function onItemClick(item) {
|
|
|
|
|
|
let isDoubleClick = false;
|
|
|
|
|
|
if (item === selectedItem.value) {
|
|
|
|
|
|
isDoubleClick = true;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// 点击不同的才切换状态
|
|
|
|
|
|
if (!isDoubleClick) {
|
|
|
|
|
|
if (selectedItem.value) {
|
|
|
|
|
|
selectedItem.value.selected = false;
|
|
|
|
|
|
}
|
|
|
|
|
|
item.selected = true;
|
|
|
|
|
|
selectedItem.value = item;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// 不同类型处理不同
|
|
|
|
|
|
if (item.type === 'scene' || item.type === 'prefab' || item.type === 'node') {
|
|
|
|
|
|
let url = item.url;
|
|
|
|
|
|
if (item.prefabUrl && item.type === 'node') {
|
|
|
|
|
|
url = item.prefabUrl;
|
|
|
|
|
|
}
|
|
|
|
|
|
if (isDoubleClick) {
|
|
|
|
|
|
// prefab 如果是双击,则发送消息到 Cocos Creator 打开
|
|
|
|
|
|
// ipcRenderer.send('open-prefab', item.uuid);
|
|
|
|
|
|
// ipcRenderer.send('asset-db', 'open-asset', item.url);
|
|
|
|
|
|
// ipcRenderer.send('open-asset', item.url);
|
|
|
|
|
|
RendererEvent.send('open-asset', url, item.node);
|
|
|
|
|
|
} else {
|
|
|
|
|
|
// 否则发送消息到 Cocos Creator 选中
|
|
|
|
|
|
// ipcRenderer.send('select-node', item.uuid);
|
|
|
|
|
|
RendererEvent.send('select-asset', url);
|
|
|
|
|
|
}
|
|
|
|
|
|
} else {
|
|
|
|
|
|
RendererEvent.send('select-asset', item.url);
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
|
* 翻译
|
|
|
|
|
|
* @param {string} key
|
|
|
|
|
|
*/
|
|
|
|
|
|
function t(key) {
|
|
|
|
|
|
return translate(LANG, key);
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
|
* 生命周期:挂载后
|
|
|
|
|
|
*/
|
|
|
|
|
|
onMounted(() => {
|
|
|
|
|
|
// 监听 IPC 消息
|
|
|
|
|
|
ipcRenderer.on('results-data', (event, data) => {
|
|
|
|
|
|
|
|
|
|
|
|
// 初始化数据
|
|
|
|
|
|
function initData(ref) {
|
|
|
|
|
|
|
|
|
|
|
|
// 图标
|
|
|
|
|
|
ref.icon = ICON_MAP[ref.type];
|
|
|
|
|
|
if (!ref.icon) {
|
|
|
|
|
|
ref.icon = '';
|
|
|
|
|
|
}
|
|
|
|
|
|
// 详情
|
|
|
|
|
|
ref.details = '';
|
|
|
|
|
|
if (ref.type === 'node') {
|
|
|
|
|
|
if (ref.component) {
|
|
|
|
|
|
ref.details += ` → ${ICON_MAP['component']} [${t('component')}] ${ref.component}`;
|
|
|
|
|
|
}
|
|
|
|
|
|
if (ref.property) {
|
|
|
|
|
|
ref.details += ` → ${ICON_MAP['property']} [${t('property')}] ${ref.property}`;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
// 递归
|
|
|
|
|
|
if (ref.refs) {
|
|
|
|
|
|
ref.refs.forEach(child => {
|
|
|
|
|
|
initData(child);
|
|
|
|
|
|
// 赋值为父节点的url
|
|
|
|
|
|
child.prefabUrl = ref.url;
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
initData(data);
|
|
|
|
|
|
|
|
|
|
|
|
// 更新 results 的值
|
|
|
|
|
|
results.value = data.refs;
|
|
|
|
|
|
//
|
|
|
|
|
|
selectedItem.value = null;
|
|
|
|
|
|
});
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
|
* 生命周期:卸载前
|
|
|
|
|
|
*/
|
|
|
|
|
|
onBeforeUnmount(() => {
|
|
|
|
|
|
// 移除 IPC 监听器
|
|
|
|
|
|
ipcRenderer.removeAllListeners('results-data');
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
return {
|
|
|
|
|
|
t,
|
|
|
|
|
|
//
|
|
|
|
|
|
results,
|
|
|
|
|
|
onItemClick,
|
|
|
|
|
|
selectedItem,
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
// 创建实例
|
|
|
|
|
|
const app = createApp(App);
|
|
|
|
|
|
// 挂载组件
|
|
|
|
|
|
app.component('ref-item', RefItem);
|
|
|
|
|
|
// 挂载
|
|
|
|
|
|
app.mount('#app');
|