From a7e6df53d734eef17fb1f06d6bc9a24518c0a3e9 Mon Sep 17 00:00:00 2001
From: rjg <746338628@qq.com>
Date: Fri, 16 May 2025 11:03:37 +0800
Subject: [PATCH] 111
---
src/api/license/license.js | 73 +++++++++
src/views/license/license.vue | 389 ++++++++++++++++++++++++++++++++----------------
2 files changed, 333 insertions(+), 129 deletions(-)
diff --git a/src/api/license/license.js b/src/api/license/license.js
new file mode 100644
index 0000000..8d0210b
--- /dev/null
+++ b/src/api/license/license.js
@@ -0,0 +1,73 @@
+import request from '@/axios';
+
+
+/**
+ * 获取 License 列表
+ * @param {Number} currentPage 当前页码
+ * @param {Number} pageSize 每页条数
+ * @param {Object} params 查询参数
+ * @returns {Promise}
+ */
+export function getList(currentPage, pageSize, params = {}) {
+ return request({
+ url: '/blade-system/license/list',
+ method: 'get',
+ params: {
+ ...params,
+ current: currentPage,
+ size: pageSize,
+ },
+ });
+}
+
+/**
+ * 新增 License
+ * @param {Object} data License 数据
+ * @returns {Promise}
+ */
+export function add(data) {
+ return request({
+ url: '/blade-system/license/createLicense',
+ method: 'post',
+ data,
+ });
+}
+
+/**
+ * 删除 License
+ * @param {Number|String} id License ID
+ * @returns {Promise}
+ */
+export function remove(id) {
+ return request({
+ url: `/blade-system/license/deleteLicense`,
+ method: 'post',
+ data: { id },
+ });
+}
+
+/**
+ * 更新 License
+ * @param {Object} data License 数据
+ * @returns {Promise}
+ */
+export function update(data) {
+ return request({
+ url: '/blade-system/license/updateLicense',
+ method: 'post',
+ data,
+ });
+}
+
+/**
+ * 获取 License 详情
+ * @param {Number|String} id License ID
+ * @returns {Promise}
+ */
+export function getDetail(id) {
+ return request({
+ url: `/blade-system/license/detail`,
+ method: 'get',
+ params: { id },
+ });
+}
\ No newline at end of file
diff --git a/src/views/license/license.vue b/src/views/license/license.vue
index 512b883..0eabc6e 100644
--- a/src/views/license/license.vue
+++ b/src/views/license/license.vue
@@ -1,140 +1,271 @@
-<!-- filepath: /d:/work/drone-web-manage/src/views/license/license.vue -->
<template>
- <div class="license-list">
- <!-- 操作按钮 -->
- <el-button type="primary" @click="openAddDialog">新增License</el-button>
+ <basic-container>
+ <avue-crud
+ :option="option"
+ :table-loading="loading"
+ :data="data"
+ v-model:page="page"
+ ref="crud"
+ @row-del="rowDel"
+ v-model="form"
+ :permission="permissionList"
+ @row-update="rowUpdate"
+ @row-save="rowSave"
+ :before-open="beforeOpen"
+ @search-change="searchChange"
+ @search-reset="searchReset"
+ @selection-change="selectionChange"
+ @current-change="currentChange"
+ @size-change="sizeChange"
+ @refresh-change="refreshChange"
+ @on-load="onLoad">
+ <!-- 自定义url -->
+ <template #url="scope">
+ <el-link
+ :href="scope.row.url"
+ target="_blank"
+ type="primary">
+ 下载证书
+ </el-link>
+ </template>
- <!-- License 列表 -->
- <el-table :data="licenses" border style="width: 100%" v-loading="loading">
- <el-table-column prop="id" label="主键ID" width="80" />
- <el-table-column prop="licenseId" label="机构ID" />
- <el-table-column prop="licenseName" label="机构名称" />
- <el-table-column prop="licenseType" label="验证时间类型">
- <template #default="scope">
- <span v-if="scope.row.licenseType === 1">不验证过期时间</span>
- <span v-else-if="scope.row.licenseType === 2">验证过期时间</span>
- </template>
- </el-table-column>
- <el-table-column prop="expireDay" label="过期时间" />
- <el-table-column prop="printClientCount" label="设备数量" />
- <el-table-column prop="checkMachineCode" label="是否校验机器码">
- <template #default="scope">
- <span>{{ scope.row.checkMachineCode ? '是' : '否' }}</span>
- </template>
- </el-table-column>
- <el-table-column prop="machineCode" label="机器码" />
- <el-table-column prop="url" label="证书地址" />
- <el-table-column prop="remark" label="备注" />
- </el-table>
+ <!-- 自定义过期时间列 -->
+ <template #expireDay="scope">
+ <span :style="{ color: isExpired(scope.row.expireDay) ? 'red' : 'inherit' }">
+ {{ formatExpireDay(scope.row.expireDay) }}
+ </span>
+ </template>
- <!-- 新增 License 弹窗 -->
- <el-dialog title="新增 License" v-model:visible="addDialogVisible">
- <el-form :model="newLicense" ref="licenseForm" label-width="120px">
- <el-form-item label="机构ID" prop="licenseId" required>
- <el-input v-model="newLicense.licenseId" />
- </el-form-item>
- <el-form-item label="机构名称" prop="licenseName" required>
- <el-input v-model="newLicense.licenseName" />
- </el-form-item>
- <el-form-item label="类型" prop="licenseType" required>
- <el-select v-model="newLicense.licenseType" placeholder="请选择">
- <el-option label="不验证过期时间" :value="1" />
- <el-option label="验证过期时间" :value="2" />
- </el-select>
- </el-form-item>
- <el-form-item label="过期时间" prop="expireDay">
- <el-date-picker v-model="newLicense.expireDay" type="date" placeholder="选择日期" />
- </el-form-item>
- <el-form-item label="设备数量" prop="printClientCount">
- <el-input-number v-model="newLicense.printClientCount" :min="-1" />
- </el-form-item>
- <el-form-item label="是否校验机器码" prop="checkMachineCode">
- <el-switch v-model="newLicense.checkMachineCode" />
- </el-form-item>
- <el-form-item label="机器码" prop="machineCode">
- <el-input v-model="newLicense.machineCode" type="textarea" rows="3" />
- </el-form-item>
- <el-form-item label="证书地址" prop="url">
- <el-input v-model="newLicense.url" />
- </el-form-item>
- <el-form-item label="备注" prop="remark">
- <el-input v-model="newLicense.remark" />
- </el-form-item>
- </el-form>
- <div class="dialog-footer">
- <el-button @click="addDialogVisible = false">取消</el-button>
- <el-button type="primary" @click="createLicense">保存</el-button>
- </div>
- </el-dialog>
- </div>
+ <!-- 自定义设备数量列 -->
+ <template #printClientCount="scope">
+ <span>
+ {{ scope.row.printClientCount === -1 ? '不限制' : scope.row.printClientCount }}
+ </span>
+ </template>
+
+ <!-- 自定义是否校验机器码列 -->
+ <template #checkMachineCode="scope">
+ <span>
+ {{ scope.row.checkMachineCode ? '校验机器码' : '不校验' }}
+ </span>
+ </template>
+ </avue-crud>
+ </basic-container>
</template>
<script>
-import { ref, reactive, onMounted } from "vue";
-import axios from "axios";
+import { getList, add } from '@/api/license/license';
+import { mapGetters } from 'vuex';
export default {
- name: "LicenseList",
- setup() {
- const licenses = ref([]);
- const loading = ref(false);
- const addDialogVisible = ref(false);
- const newLicense = reactive({
- licenseId: "",
- licenseName: "",
- licenseType: null,
- expireDay: null,
- printClientCount: -1,
- checkMachineCode: false,
- machineCode: "",
- url: "",
- remark: "",
- });
-
- const fetchLicenses = async () => {
- loading.value = true;
- try {
- const response = await axios.get("/blade-system/license/list");
- licenses.value = response.data; // 根据实际返回结构调整
- } catch (error) {
- console.error("Failed to fetch licenses:", error);
- } finally {
- loading.value = false;
- }
- };
-
- const openAddDialog = () => {
- addDialogVisible.value = true;
- };
-
- const createLicense = async () => {
- try {
- await axios.post("/blade-system/license/createLicense", newLicense);
- addDialogVisible.value = false;
- fetchLicenses(); // 刷新列表
- } catch (error) {
- console.error("Failed to create license:", error);
- }
- };
-
- onMounted(() => {
- fetchLicenses();
- });
-
- return {
- licenses,
- loading,
- addDialogVisible,
- newLicense,
- openAddDialog,
- createLicense,
- };
- },
+ data() {
+ return {
+ loading: true,
+ page: {
+ pageSize: 10,
+ currentPage: 1,
+ total: 0,
+ },
+ selectionList: [],
+ option: {
+ menuWidth: 300,
+ lazy: true,
+ tree: false,
+ tip: false,
+ searchShow: true,
+ searchMenuSpan: 6,
+ border: true,
+ index: true,
+ viewBtn: true,
+ selection: false,
+ excelBtn: false,
+ addBtn: true,
+ dialogClickModal: false,
+ grid: false,
+ column: [
+ {
+ label: '机构ID',
+ prop: 'licenseId',
+ labelWidth: 130,
+ search: true,
+ rules: [
+ {
+ required: true,
+ message: '请输入机构ID',
+ trigger: 'blur',
+ },
+ ],
+ },
+ {
+ label: '机构名称',
+ prop: 'licenseName',
+ labelWidth: 130,
+ search: true,
+ rules: [
+ {
+ required: true,
+ message: '请输入机构名称',
+ trigger: 'blur',
+ },
+ ],
+ },
+ {
+ label: '类型',
+ prop: 'licenseType',
+ type: 'select',
+ labelWidth: 130,
+ dicData: [
+ {
+ label: '不验证过期时间',
+ value: 1,
+ },
+ {
+ label: '验证过期时间',
+ value: 2,
+ },
+ ],
+ rules: [
+ {
+ required: true,
+ message: '请选择类型',
+ trigger: 'change',
+ },
+ ],
+ },
+ {
+ label: '过期时间',
+ prop: 'expireDay',
+ type: 'date',
+ labelWidth: 130,
+ slot: true, // 启用自定义插槽
+ rules: [
+ {
+ required: false,
+ message: '请选择过期时间',
+ trigger: 'change',
+ },
+ ],
+ },
+ {
+ label: '设备数量',
+ prop: 'printClientCount',
+ type: 'number',
+ labelWidth: 130,
+ slot: true, // 启用自定义插槽
+ rules: [
+ {
+ required: false,
+ message: '请输入设备数量',
+ trigger: 'blur',
+ },
+ ],
+ },
+ {
+ label: '是否校验机器码',
+ prop: 'checkMachineCode',
+ type: 'switch',
+ labelWidth: 130,
+ slot: true, // 启用自定义插槽
+ rules: [
+ {
+ required: false,
+ message: '请选择是否校验机器码',
+ trigger: 'change',
+ },
+ ],
+ },
+ {
+ label: '机器码',
+ prop: 'machineCode',
+ type: 'textarea',
+ labelWidth: 130,
+ rules: [
+ {
+ required: false,
+ message: '请输入机器码',
+ trigger: 'blur',
+ },
+ ],
+ },
+ {
+ label: '证书地址',
+ prop: 'url',
+ labelWidth: 130,
+ slot: true, // 启用自定义插槽
+ rules: [
+ {
+ required: false,
+ trigger: 'blur',
+ },
+ ],
+ },
+ {
+ label: '备注',
+ prop: 'remark',
+ labelWidth: 130,
+ rules: [
+ {
+ required: false,
+ message: '请输入备注',
+ trigger: 'blur',
+ },
+ ],
+ },
+ ],
+ },
+ data: [],
+ };
+ },
+ computed: {
+ ...mapGetters(['userInfo', 'permission']),
+ permissionList() {
+ return {
+ addBtn: this.validData(this.permission.license_add, false),
+ viewBtn: this.validData(this.permission.license_view, true),
+ delBtn: this.validData(this.permission.license_delete, false),
+ editBtn: this.validData(this.permission.license_edit, false),
+ };
+ },
+ },
+ methods: {
+ isExpired(expireDay) {
+ const now = new Date();
+ return new Date(expireDay) < now;
+ },
+ formatExpireDay(expireDay) {
+ if (this.isExpired(expireDay)) {
+ return `${expireDay} (已过期)`;
+ }
+ return expireDay;
+ },
+ rowSave(row, done, loading) {
+ add(row).then(
+ () => {
+ this.onLoad(this.page);
+ this.$message({
+ type: 'success',
+ message: '操作成功!',
+ });
+ done();
+ },
+ error => {
+ console.error(error);
+ loading();
+ }
+ );
+ },
+ onLoad(page, params = {}) {
+ this.loading = true;
+ getList(page.currentPage, page.pageSize, params).then(res => {
+ const data = res.data.data;
+ this.page.total = data.total;
+ this.data = data.records;
+ this.loading = false;
+ });
+ },
+ },
};
</script>
-<style scoped>
-.license-list {
- padding: 20px;
-}
-</style>
\ No newline at end of file
+<style lang="scss" scoped>
+</style>
--
Gitblit v1.9.3