Merge branch 'master' of gitcode.com:hk_openRepo/OpenRepo_Portal
This commit is contained in:
@@ -1,42 +1,60 @@
|
||||
<template>
|
||||
<div class="license-info-container">
|
||||
<div class="license-info-content" :class="{ 'license-info-content-full': !showDetail, 'license-info-half': showDetail }">
|
||||
<div class="license-info-content">
|
||||
<d-layout>
|
||||
<d-header class="dheader">
|
||||
<d-search icon-position="left" style="width: 200px" placeholder="搜索许可证名称"></d-search>
|
||||
<d-search icon-position="left" style="width: 200px" placeholder="搜索组件名称"></d-search>
|
||||
<d-select style="width: 200px" placeholder="许可证种类"></d-select>
|
||||
</d-header>
|
||||
<d-content class="dcontent">
|
||||
<d-table :data="list" :header-bg="true">
|
||||
<d-table :data="list" style="width: 100%;">
|
||||
<d-column type="index" width="40"></d-column>
|
||||
<d-column v-for="(column, index) in tableConfig" :field="column.field"
|
||||
:header="column.header" :sortable="column.sortable" :sort-method="column.sortMethod"></d-column>
|
||||
<d-column header="详情" width="100px">
|
||||
<template #default="scope">
|
||||
<img src="@/assets/imgs/jyh/ic_digital_power_next_step_@2x.png" class="operation" @click="showDetail = !showDetail">
|
||||
<a class="devui-link" @click="openPanel">查看</a>
|
||||
</template>
|
||||
</d-column>
|
||||
</d-table>
|
||||
</d-content>
|
||||
<d-footer class="dfooter">Footer</d-footer>
|
||||
</d-layout>
|
||||
</div>
|
||||
<div class="license-info-side" v-if="showDetail">
|
||||
<SidePanel @close="close"/>
|
||||
<div class="license-info-container-page">
|
||||
<d-pagination
|
||||
size="sm"
|
||||
:total="pager.total"
|
||||
v-model:pageSize="pager.pageSize"
|
||||
v-model:pageIndex="pager.pageIndex"
|
||||
:can-view-total="true"
|
||||
:can-change-page-size="true"
|
||||
:can-jump-page="true"
|
||||
:max-items="5"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<d-drawer v-model="showDetail" style="width: 800px; padding: 20px" >
|
||||
<SidePanel @close="close"/>
|
||||
</d-drawer>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import Table from '@/components/AIRepair/Table.vue';
|
||||
import SidePanel from '@/components/LicenseInfo/SidePanel.vue';
|
||||
const pager = ref({
|
||||
pageIndex: 1,
|
||||
pageSize: 30,
|
||||
total: 10
|
||||
})
|
||||
const pageOptions = ref({
|
||||
|
||||
})
|
||||
const showDetail = ref(false);
|
||||
|
||||
const close = () => {
|
||||
showDetail.value = false;
|
||||
}
|
||||
|
||||
const openPanel = () => {
|
||||
showDetail.value = true;
|
||||
}
|
||||
|
||||
const tableConfig = ref([
|
||||
{
|
||||
field: 'licenseName',
|
||||
@@ -95,21 +113,18 @@ const list = ref([
|
||||
<style scoped lang="scss">
|
||||
|
||||
.license-info-container {
|
||||
height: calc(100vh - 250px);
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
gap: 12px;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
background-color: $devui-global-bg-normal;
|
||||
.license-info-content {
|
||||
flex-grow: 1;
|
||||
height: 100%;
|
||||
transition: width 0.3s;
|
||||
&.license-info-content-full {
|
||||
width: 100%;
|
||||
}
|
||||
&.license-info-half {
|
||||
width: 60%;
|
||||
}
|
||||
background-color: $devui-global-bg-normal;
|
||||
border-radius: 10px;
|
||||
}
|
||||
&-page {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: end;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -121,10 +136,10 @@ const list = ref([
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
.license-info-side {
|
||||
height: 100%;
|
||||
width: 40%;
|
||||
border-left: 1px solid #e8e8e8;
|
||||
.dfooter {
|
||||
display: flex;
|
||||
justify-content: end;
|
||||
margin-top: 20px
|
||||
}
|
||||
|
||||
.operation {
|
||||
|
||||
Reference in New Issue
Block a user