| | |
| | | </div> |
| | | |
| | | <!-- 按钮 --> |
| | | <div v-else-if="item.dataType == 'action'"> |
| | | <div v-else-if="item.dataType == 'action'" @click.stop> |
| | | <template v-for="(o, key) in item.operation" :key="key"> |
| | | <el-button |
| | | v-show="o.type != 'upload'" |
| | | v-if="o.showHide ? o.showHide(scope.row) : true" |
| | | :disabled="o.disabled ? o.disabled(scope.row) : false" |
| | | :disabled="isOperationDisabled(o, scope.row)" |
| | | :plain="o.plain" |
| | | type="primary" |
| | | :style="{ |
| | | color: |
| | | o.name === '删除' || o.name === 'delete' |
| | | ? '#f56c6c' |
| | | : o.color, |
| | | color: getOperationColor(o, scope.row), |
| | | fontWeight: 'bold', |
| | | }" |
| | | link |
| | | @click="o.clickFun(scope.row)" |
| | | @click.stop="o.clickFun(scope.row)" |
| | | :key="key" |
| | | > |
| | | {{ o.name }} |
| | |
| | | ref="uploadRef" |
| | | :multiple="o.multiple ? o.multiple : false" |
| | | :limit="1" |
| | | :disabled="o.disabled ? o.disabled(scope.row) : false" |
| | | :disabled="isOperationDisabled(o, scope.row)" |
| | | :accept=" |
| | | o.accept |
| | | ? o.accept |
| | |
| | | <el-button |
| | | link |
| | | type="primary" |
| | | :disabled="o.disabled ? o.disabled(scope.row) : false" |
| | | :disabled="isOperationDisabled(o, scope.row)" |
| | | :style="{ |
| | | color: getOperationColor(o, scope.row), |
| | | fontWeight: 'bold', |
| | | }" |
| | | >{{ o.name }}</el-button |
| | | > |
| | | </el-upload> |
| | |
| | | const uploadHeader = proxy.uploadHeader; |
| | | const javaApi = proxy.javaApi; |
| | | |
| | | const emit = defineEmits(["pagination", "expand-change", "selection-change"]); |
| | | const emit = defineEmits(["pagination", "expand-change", "selection-change", "row-click"]); |
| | | |
| | | // Filters |
| | | const typeFn = (val, row) => { |
| | |
| | | } else return ""; |
| | | }; |
| | | |
| | | const isOperationDisabled = (operation, row) => { |
| | | if (!operation?.disabled) return false; |
| | | return typeof operation.disabled === "function" |
| | | ? !!operation.disabled(row) |
| | | : !!operation.disabled; |
| | | }; |
| | | |
| | | const parseHexToRgb = (hex) => { |
| | | const normalized = String(hex || "").trim().replace("#", ""); |
| | | if (normalized.length === 3) { |
| | | const r = parseInt(normalized[0] + normalized[0], 16); |
| | | const g = parseInt(normalized[1] + normalized[1], 16); |
| | | const b = parseInt(normalized[2] + normalized[2], 16); |
| | | if ([r, g, b].some((n) => Number.isNaN(n))) return null; |
| | | return { r, g, b }; |
| | | } |
| | | if (normalized.length === 6 || normalized.length === 8) { |
| | | const r = parseInt(normalized.slice(0, 2), 16); |
| | | const g = parseInt(normalized.slice(2, 4), 16); |
| | | const b = parseInt(normalized.slice(4, 6), 16); |
| | | if ([r, g, b].some((n) => Number.isNaN(n))) return null; |
| | | return { r, g, b }; |
| | | } |
| | | return null; |
| | | }; |
| | | |
| | | const fadeColor = (color, alpha = 0.35) => { |
| | | const c = String(color || "").trim(); |
| | | if (!c) return undefined; |
| | | if (c.startsWith("#")) { |
| | | const rgb = parseHexToRgb(c); |
| | | if (!rgb) return c; |
| | | return `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${alpha})`; |
| | | } |
| | | const rgbMatch = c.match(/^rgba?\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)(?:\s*,\s*[\d.]+\s*)?\)$/i); |
| | | if (rgbMatch) { |
| | | const r = Number(rgbMatch[1]); |
| | | const g = Number(rgbMatch[2]); |
| | | const b = Number(rgbMatch[3]); |
| | | if ([r, g, b].some((n) => Number.isNaN(n))) return c; |
| | | return `rgba(${r}, ${g}, ${b}, ${alpha})`; |
| | | } |
| | | if (c.includes("--el-color-primary")) { |
| | | return "var(--el-color-primary-light-5)"; |
| | | } |
| | | if (c.includes("--el-color-danger")) { |
| | | return "var(--el-color-danger-light-5)"; |
| | | } |
| | | return "var(--el-text-color-disabled)"; |
| | | }; |
| | | |
| | | const getOperationColor = (operation, row) => { |
| | | const baseColor = |
| | | operation?.name === "删除" || operation?.name === "delete" |
| | | ? "#D93025" |
| | | : operation?.color || "var(--el-color-primary)"; |
| | | |
| | | if (isOperationDisabled(operation, row)) { |
| | | return fadeColor(baseColor, 0.35); |
| | | } |
| | | return baseColor; |
| | | }; |
| | | |
| | | // 文件变化处理 |
| | | const handleChange = (file, fileList, index) => { |
| | | if (fileList.length > 1) { |
| | |
| | | emit("pagination", { page: page, limit: limit }); |
| | | }; |
| | | |
| | | const rowClick = (row) => { |
| | | emit("row-click", row); |
| | | }; |
| | | |
| | | const expandChange = (row, expandedRows) => { |
| | | emit("expand-change", row, expandedRows); |
| | | }; |