ETC/SAFEKISO
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first

Browse Source
This commit is contained in:
DESKTOP-RS140KH\IdeaPad
2026-04-07 14:50:23 +09:00
commit b4e485502b
4778 changed files with 2017091 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

153
safekiso_admin/components/StatisticsTable1.vue Normal file
View File

@@ -0,0 +1,153 @@
<template>
<div class="flex flex-col">
<div class="-my-2 -mx-4 overflow-x-auto sm:-mx-6 lg:-mx-8">
<div
class="inline-block min-w-full py-2 align-middle md:px-6 lg:px-8"
>
<table class="min-w-full divide-y divide-gray-300">
<thead>
<tr>
<th
v-for="(heading, index) in headings"
:key="index"
:width="
heading['widthRatio'] != ''
? heading['widthRatio'] + '%'
: '100%'
"
:class="
index == 0
? 'py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 sm:pl-6 md:pl-0'
: 'py-3.5 px-3 text-left text-sm font-semibold text-gray-900'
"
scope="col"
>
{{ heading['title'] }}
</th>
<th
v-for="(action, index) in actions"
:key="index + headings.length"
:width="actions.length * 1"
class="relative py-3.5 pl-3 pr-4 sm:pr-6 md:pr-0"
scope="col"
>
<span class="sr-only">{{ action }}</span>
</th>
</tr>
</thead>
<tbody class="divide-y divide-gray-200">
<tr v-for="(item, itemIndex) in data" :key="itemIndex">
<td
v-for="(heading, index) in headings"
:key="index"
:class="
index == 0
? 'whitespace-nowrap py-4 pl-4 pr-3 text-sm font-medium text-gray-900 sm:pl-6 md:pl-0'
: 'whitespace-nowrap py-4 px-3 text-sm text-gray-500'
"
>
{{
columnFilter
? columnFilter(
heading['key'],
item[heading['key']]
)
: item[heading['key']]
}}
</td>
<td
class="relative whitespace-nowrap py-4 pl-3 pr-4 text-right text-sm font-medium sm:pr-6 md:pr-0"
>
<a
v-for="(action, index) in actions"
:key="index"
href="javascript:void(0)"
:class="index != 0 ? 'ml-3' : ''"
class="text-indigo-600 hover:text-indigo-900"
@click="doAction(action, item[actionKey])"
>{{ action
}}<span class="sr-only"
>, {{ item['serial'] }}</span
></a
>
</td>
</tr>
<tr v-if="data.length == 0">
<td
:colspan="headings.length"
class="whitespace-nowrap py-4 px-3 text-sm text-gray-500"
>
{{ noDataMessage }}
</td>
</tr>
</tbody>
<tfoot>
<tr>
<th
v-for="(heading, index) in headings"
:key="index"
:width="
heading['widthRatio'] != ''
? heading['widthRatio'] + '%'
: '100%'
"
:class="
index == 0
? 'py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 sm:pl-6 md:pl-0'
: 'py-3.5 px-3 text-left text-sm font-semibold text-gray-900'
"
scope="col"
>
{{
index == 0
? '합계'
: calcSum(heading['key'])
}}
</th>
<th
v-for="(action, index) in actions"
:key="index + headings.length"
:width="actions.length * 1"
class="relative py-3.5 pl-3 pr-4 sm:pr-6 md:pr-0"
scope="col"
>
<span class="sr-only">{{ action }}</span>
</th>
</tr>
</tfoot>
</table>
</div>
</div>
</div>
</template>
<script setup lang="ts">
const props = defineProps({
headings: { type: Array<object>, required: true },
actions: { type: Array<string>, default: [] },
data: { type: Array<object>, required: true },
actionKey: { type: String, default: 'serial' },
columnFilter: {
type: Function,
default: (key: string, val: string) => val,
},
doAction: {
type: Function,
default: (key: string) => {
return key;
},
},
noDataMessage: { type: String, default: '조회된 데이터가 없습니다.' },
});
function calcSum(tag) {
let tmpSum = 0;
for (let i = 0; i < props.data.length; i++) {
tmpSum += props.data[i][tag];
}
return tmpSum;
}
</script>