mirror of
https://github.com/go-gitea/gitea
synced 2025-07-05 18:17:19 +00:00
Keep file tree view icons consistent with icon theme (#33921)
Fix #33914 before:  after:  --------- Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
This commit is contained in:
@ -3,6 +3,7 @@ import ViewFileTreeItem from './ViewFileTreeItem.vue';
|
||||
import {onMounted, ref} from 'vue';
|
||||
import {pathEscapeSegments} from '../utils/url.ts';
|
||||
import {GET} from '../modules/fetch.ts';
|
||||
import {createElementFromHTML} from '../utils/dom.ts';
|
||||
|
||||
const elRoot = ref<HTMLElement | null>(null);
|
||||
|
||||
@ -18,6 +19,15 @@ const selectedItem = ref('');
|
||||
async function loadChildren(treePath: string, subPath: string = '') {
|
||||
const response = await GET(`${props.repoLink}/tree-view/${props.currentRefNameSubURL}/${pathEscapeSegments(treePath)}?sub_path=${encodeURIComponent(subPath)}`);
|
||||
const json = await response.json();
|
||||
const poolSvgs = [];
|
||||
for (const [svgId, svgContent] of Object.entries(json.renderedIconPool ?? {})) {
|
||||
if (!document.querySelector(`.global-svg-icon-pool #${svgId}`)) poolSvgs.push(svgContent);
|
||||
}
|
||||
if (poolSvgs.length) {
|
||||
const svgContainer = createElementFromHTML('<div class="global-svg-icon-pool tw-hidden"></div>');
|
||||
svgContainer.innerHTML = poolSvgs.join('');
|
||||
document.body.append(svgContainer);
|
||||
}
|
||||
return json.fileTreeNodes ?? null;
|
||||
}
|
||||
|
||||
|
@ -5,6 +5,8 @@ import {ref} from 'vue';
|
||||
type Item = {
|
||||
entryName: string;
|
||||
entryMode: string;
|
||||
entryIcon: string;
|
||||
entryIconOpen: string;
|
||||
fullPath: string;
|
||||
submoduleUrl?: string;
|
||||
children?: Item[];
|
||||
@ -80,7 +82,8 @@ const doGotoSubModule = () => {
|
||||
>
|
||||
<!-- file -->
|
||||
<div class="item-content">
|
||||
<SvgIcon name="octicon-file"/>
|
||||
<!-- eslint-disable-next-line vue/no-v-html -->
|
||||
<span v-html="item.entryIcon"/>
|
||||
<span class="gt-ellipsis tw-flex-1">{{ item.entryName }}</span>
|
||||
</div>
|
||||
</div>
|
||||
@ -92,11 +95,13 @@ const doGotoSubModule = () => {
|
||||
>
|
||||
<!-- directory -->
|
||||
<div class="item-toggle">
|
||||
<!-- FIXME: use a general and global class for this animation -->
|
||||
<SvgIcon v-if="isLoading" name="octicon-sync" class="job-status-rotate"/>
|
||||
<SvgIcon v-else :name="collapsed ? 'octicon-chevron-right' : 'octicon-chevron-down'" @click.stop="doLoadChildren"/>
|
||||
</div>
|
||||
<div class="item-content">
|
||||
<SvgIcon class="text primary" :name="collapsed ? 'octicon-file-directory-fill' : 'octicon-file-directory-open-fill'"/>
|
||||
<!-- eslint-disable-next-line vue/no-v-html -->
|
||||
<span class="text primary" v-html="(!collapsed && item.entryIconOpen) ? item.entryIconOpen : item.entryIcon"/>
|
||||
<span class="gt-ellipsis">{{ item.entryName }}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
Reference in New Issue
Block a user