more unfinished changes, process tab for dashboard
This commit is contained in:
@@ -0,0 +1,712 @@
|
||||
pragma ComponentBehavior: Bound
|
||||
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import Quickshell
|
||||
import ZShell.Config
|
||||
import ZShell.Internal
|
||||
import ZShell.Services
|
||||
import qs.Components
|
||||
import qs.Services
|
||||
|
||||
Item {
|
||||
id: root
|
||||
|
||||
required property int headerHeight
|
||||
required property ProcessesList pList
|
||||
|
||||
readonly property alias columnList: columnList
|
||||
readonly property alias columnsModel: columnsData
|
||||
readonly property bool anyHeld: columnList.contentItem.children.some(c => c.held)
|
||||
|
||||
z: 1
|
||||
implicitHeight: headerHeight
|
||||
|
||||
function widthForColumn(id: string, configured: real): real {
|
||||
for (const item of columnList.contentItem.children) {
|
||||
if (item.modelData !== undefined && item.modelData.id === id)
|
||||
return item.liveWidth > 0 ? item.liveWidth : (configured > 0 ? configured : (ProcessesColumns.defFor(id)?.width ?? 100));
|
||||
}
|
||||
return configured > 0 ? configured : (ProcessesColumns.defFor(id)?.width ?? 100);
|
||||
}
|
||||
|
||||
function fillMissingWidths() {
|
||||
const n = columnsData.values.length;
|
||||
if (n === 0 || columnList.width <= 0)
|
||||
return;
|
||||
|
||||
const spacingTotal = columnList.spacing * Math.max(0, n - 1);
|
||||
|
||||
let savedTotal = 0;
|
||||
const unsavedIndices = [];
|
||||
for (let i = 0; i < n; i++) {
|
||||
const w = columnsData.values[i].width;
|
||||
if (w > 0)
|
||||
savedTotal += w;
|
||||
else
|
||||
unsavedIndices.push(i);
|
||||
}
|
||||
|
||||
if (unsavedIndices.length === 0)
|
||||
return;
|
||||
|
||||
const available = columnList.width - spacingTotal - savedTotal;
|
||||
if (available <= 0)
|
||||
return;
|
||||
|
||||
const each = Math.max(50, available / unsavedIndices.length);
|
||||
for (const idx of unsavedIndices)
|
||||
ProcessesColumns.resizeColumn(idx, each);
|
||||
}
|
||||
|
||||
Connections {
|
||||
target: columnList
|
||||
function onWidthChanged() {
|
||||
root.fillMissingWidths();
|
||||
}
|
||||
}
|
||||
|
||||
Connections {
|
||||
target: columnsData
|
||||
function onValuesChanged() {
|
||||
root.fillMissingWidths();
|
||||
}
|
||||
}
|
||||
|
||||
Component.onCompleted: Qt.callLater(fillMissingWidths)
|
||||
Component.onDestruction: Cursor.clearOverride()
|
||||
|
||||
RowLayout {
|
||||
id: rowLayout
|
||||
|
||||
anchors.fill: parent
|
||||
|
||||
spacing: Tokens.spacing.extraSmall / 2
|
||||
|
||||
CustomListView {
|
||||
id: columnList
|
||||
|
||||
Layout.fillWidth: true
|
||||
orientation: ListView.Horizontal
|
||||
interactive: false
|
||||
spacing: parent.spacing
|
||||
implicitHeight: root.headerHeight
|
||||
|
||||
add: Transition {
|
||||
Anim {
|
||||
from: 0
|
||||
properties: "opacity"
|
||||
to: 1
|
||||
type: Anim.DefaultEffects
|
||||
}
|
||||
}
|
||||
displaced: Transition {
|
||||
Anim {
|
||||
properties: "opacity"
|
||||
to: 1
|
||||
type: Anim.DefaultEffects
|
||||
}
|
||||
Anim {
|
||||
properties: "x"
|
||||
}
|
||||
}
|
||||
move: Transition {
|
||||
Anim {
|
||||
properties: "opacity"
|
||||
to: 1
|
||||
type: Anim.DefaultEffects
|
||||
}
|
||||
Anim {
|
||||
properties: "x"
|
||||
}
|
||||
}
|
||||
remove: Transition {
|
||||
Anim {
|
||||
to: 0
|
||||
properties: "opacity"
|
||||
type: Anim.DefaultEffects
|
||||
}
|
||||
}
|
||||
|
||||
model: DelegateModel {
|
||||
id: columnsVisual
|
||||
|
||||
delegate: ColumnHeaderCell {
|
||||
parentModel: columnsVisual
|
||||
}
|
||||
|
||||
model: ScriptModel {
|
||||
id: columnsData
|
||||
values: Config.dashboard.processColumns.values
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
IconButton {
|
||||
id: addColumnBtn
|
||||
|
||||
type: IconButton.Text
|
||||
icon: "add"
|
||||
font: Tokens.font.icon.medium
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
visible: ProcessesColumns.hiddenColumns.length > 0
|
||||
onClicked: addMenu.expanded = true
|
||||
}
|
||||
|
||||
Variants {
|
||||
id: hiddenColumnList
|
||||
|
||||
model: ProcessesColumns.hiddenColumns
|
||||
|
||||
HiddenColumnItem {}
|
||||
}
|
||||
|
||||
Menu {
|
||||
id: addMenu
|
||||
|
||||
attachTo: addColumnBtn
|
||||
items: hiddenColumnList.instances
|
||||
onItemSelected: item => ProcessesColumns.addColumn(item.modelData.id)
|
||||
}
|
||||
}
|
||||
|
||||
Item {
|
||||
id: resizeOverlay
|
||||
|
||||
property real gapBoost: pressed ? Tokens.spacing.small : Tokens.spacing.extraSmall
|
||||
property bool pressed: false
|
||||
property int geometryTick: 0
|
||||
property int activeGapIndex: -1
|
||||
|
||||
anchors.fill: rowLayout
|
||||
z: 10
|
||||
|
||||
Connections {
|
||||
target: columnsData
|
||||
function onValuesChanged() {
|
||||
resizeOverlay.geometryTick++;
|
||||
}
|
||||
}
|
||||
|
||||
Connections {
|
||||
target: columnList
|
||||
function onCountChanged() {
|
||||
resizeOverlay.geometryTick++;
|
||||
}
|
||||
function onContentWidthChanged() {
|
||||
resizeOverlay.geometryTick++;
|
||||
}
|
||||
}
|
||||
|
||||
Component.onCompleted: Qt.callLater(() => geometryTick++)
|
||||
|
||||
Repeater {
|
||||
model: Math.max(0, columnsData.values.length - 1)
|
||||
|
||||
MouseArea {
|
||||
id: handleRoot
|
||||
|
||||
required property int index
|
||||
|
||||
readonly property bool hovered: containsMouse
|
||||
|
||||
property ColumnHeaderCell leftCell: {
|
||||
const left = leftCell;
|
||||
if (resizing && left)
|
||||
return left;
|
||||
const tick = resizeOverlay.geometryTick;
|
||||
return resolveCell(true);
|
||||
}
|
||||
|
||||
property ColumnHeaderCell rightCell: {
|
||||
const right = rightCell;
|
||||
if (resizing && right)
|
||||
return right;
|
||||
const tick = resizeOverlay.geometryTick;
|
||||
return resolveCell(false);
|
||||
}
|
||||
|
||||
property bool resizing: false
|
||||
property real originX: 0
|
||||
property real originWidth: 0
|
||||
property real originRightWidth: 0
|
||||
property real originAbsX: 0
|
||||
|
||||
function resolveCell(left: bool): ColumnHeaderCell {
|
||||
if (left) { // qmllint disable incompatible-type
|
||||
const leftItem = columnList.itemAtIndex(index);
|
||||
if (leftItem)
|
||||
return leftItem;
|
||||
else
|
||||
return null;
|
||||
} else {
|
||||
const rightItem = columnList.itemAtIndex(index + 1);
|
||||
if (rightItem)
|
||||
return rightItem;
|
||||
else
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
cursorShape: pressed ? Qt.ClosedHandCursor : Qt.OpenHandCursor
|
||||
preventStealing: true
|
||||
hoverEnabled: true
|
||||
enabled: !root.anyHeld
|
||||
|
||||
x: {
|
||||
if (!leftCell)
|
||||
return 0;
|
||||
const gapCenter = leftCell.x + leftCell.width + columnList.spacing / 2;
|
||||
return gapCenter - width / 2;
|
||||
}
|
||||
y: 0
|
||||
implicitWidth: 16
|
||||
implicitHeight: columnList.height
|
||||
|
||||
function pairAvailableWidth(rightCell) {
|
||||
let othersWidth = 0;
|
||||
for (const item of columnList.contentItem.children) {
|
||||
if (item.modelData === undefined || item === handleRoot.leftCell || item === rightCell)
|
||||
continue;
|
||||
othersWidth += item.width;
|
||||
}
|
||||
const spacingTotal = columnList.spacing * Math.max(0, columnsData.values.length - 1);
|
||||
return columnList.width - othersWidth - spacingTotal;
|
||||
}
|
||||
|
||||
CustomRect {
|
||||
id: handle
|
||||
|
||||
readonly property bool shouldBeVisible: handleRoot.hovered || handleRoot.pressed
|
||||
|
||||
anchors.top: parent.top
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
|
||||
implicitWidth: shouldBeVisible ? resizeOverlay.gapBoost : 0
|
||||
color: Colors.palette.m3secondary
|
||||
radius: Tokens.rounding.full
|
||||
opacity: shouldBeVisible ? 1.0 : 0
|
||||
|
||||
Behavior on implicitWidth {
|
||||
Anim {
|
||||
type: Anim.FastSpatial
|
||||
}
|
||||
}
|
||||
|
||||
Behavior on opacity {
|
||||
Anim {}
|
||||
}
|
||||
|
||||
transform: Scale {
|
||||
origin {
|
||||
x: handle.implicitWidth / 2
|
||||
y: handle.height / 2
|
||||
}
|
||||
|
||||
yScale: handle.shouldBeVisible ? 1 : 0.5
|
||||
xScale: handle.shouldBeVisible ? 1 : 0.5
|
||||
|
||||
Behavior on xScale {
|
||||
Anim {}
|
||||
}
|
||||
|
||||
Behavior on yScale {
|
||||
Anim {}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
onHoveredChanged: resizeOverlay.activeGapIndex = hovered || pressed ? handleRoot.index : (resizeOverlay.activeGapIndex === handleRoot.index ? -1 : resizeOverlay.activeGapIndex)
|
||||
|
||||
onPressedChanged: {
|
||||
resizeOverlay.pressed = pressed;
|
||||
if (!pressed)
|
||||
resizeOverlay.activeGapIndex = hovered ? handleRoot.index : resizeOverlay.activeGapIndex === handleRoot.index ? -1 : resizeOverlay.activeGapIndex;
|
||||
}
|
||||
|
||||
onPressed: e => {
|
||||
if (!handleRoot.leftCell)
|
||||
return;
|
||||
|
||||
Cursor.setOverride(Qt.ClosedHandCursor);
|
||||
resizing = true;
|
||||
originAbsX = handleRoot.mapToItem(resizeOverlay, e.x, 0).x;
|
||||
originWidth = handleRoot.leftCell.implicitWidth;
|
||||
originRightWidth = handleRoot.rightCell ? handleRoot.rightCell.implicitWidth : 0;
|
||||
}
|
||||
|
||||
onPositionChanged: e => {
|
||||
if (!resizing || !handleRoot.leftCell)
|
||||
return;
|
||||
|
||||
const nowAbsX = handleRoot.mapToItem(resizeOverlay, e.x, 0).x;
|
||||
let newLeftWidth = Math.max(50, originWidth + (nowAbsX - originAbsX));
|
||||
|
||||
const rightCell = handleRoot.rightCell;
|
||||
let roundedLeft = Math.round(newLeftWidth);
|
||||
|
||||
if (rightCell) {
|
||||
const available = Math.round(handleRoot.pairAvailableWidth(rightCell));
|
||||
const maxLeftWidth = Math.max(50, available - 50);
|
||||
roundedLeft = Math.min(roundedLeft, maxLeftWidth);
|
||||
rightCell.liveWidth = Math.max(50, available - roundedLeft);
|
||||
}
|
||||
|
||||
handleRoot.leftCell.liveWidth = roundedLeft;
|
||||
}
|
||||
|
||||
onReleased: {
|
||||
Cursor.clearOverride();
|
||||
resizing = false;
|
||||
const cell = handleRoot.leftCell;
|
||||
const rightCell = handleRoot.rightCell;
|
||||
|
||||
if (cell.liveWidth !== 0)
|
||||
ProcessesColumns.resizeColumn(cell.DelegateModel.itemsIndex, cell.liveWidth);
|
||||
if (rightCell.liveWidth !== 0)
|
||||
ProcessesColumns.resizeColumn(rightCell.DelegateModel.itemsIndex, rightCell.liveWidth);
|
||||
if (cell || rightCell) {
|
||||
cell.liveWidth = 0;
|
||||
rightCell.liveWidth = 0;
|
||||
}
|
||||
resizeOverlay.geometryTick++;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
component ColumnHeaderCell: Item {
|
||||
id: cell
|
||||
|
||||
required property var modelData
|
||||
required property int index
|
||||
required property DelegateModel parentModel
|
||||
|
||||
property int leftRadius: pushSide !== 1 && DelegateModel.itemsIndex === 0 ? cell.implicitHeight / 2 : Tokens.rounding.extraSmall
|
||||
property int rightRadius: pushSide !== -1 && DelegateModel.itemsIndex === parentModel.count - 1 ? cell.implicitHeight / 2 : Tokens.rounding.extraSmall
|
||||
property real radiusLerpProg
|
||||
property bool held
|
||||
property bool moved: false
|
||||
property int pressIndex: -1
|
||||
property point pressPos
|
||||
property real lastMoveX: 0
|
||||
property real liveWidth: 0
|
||||
|
||||
readonly property bool isActiveSort: Processes.sortField === (ProcessesColumns.defFor(cell.modelData.id)?.field ?? 0)
|
||||
readonly property int pushSide: {
|
||||
const gapIdx = resizeOverlay.activeGapIndex;
|
||||
if (gapIdx < 0)
|
||||
return 0;
|
||||
const myIdx = cell.DelegateModel.itemsIndex;
|
||||
if (myIdx === gapIdx)
|
||||
return -1;
|
||||
if (myIdx === gapIdx + 1)
|
||||
return 1;
|
||||
return 0;
|
||||
}
|
||||
property real gapBoost: resizeOverlay.gapBoost
|
||||
readonly property real gapShrink: gapBoost / 2
|
||||
|
||||
property real gapProg: pushSide !== 0 ? 1 : 0
|
||||
property real gapX: pushSide === 1 ? 1 : 0
|
||||
|
||||
function lerpRadius(a: real, b: real): real {
|
||||
return a + (b - a) * radiusLerpProg;
|
||||
}
|
||||
|
||||
Behavior on gapBoost {
|
||||
Anim {
|
||||
type: Anim.FastSpatial
|
||||
}
|
||||
}
|
||||
|
||||
Behavior on gapX {
|
||||
Anim {
|
||||
type: Anim.FastSpatial
|
||||
}
|
||||
}
|
||||
|
||||
Behavior on gapProg {
|
||||
Anim {
|
||||
type: Anim.FastSpatial
|
||||
}
|
||||
}
|
||||
|
||||
implicitHeight: root.headerHeight
|
||||
implicitWidth: liveWidth > 0 ? liveWidth : (modelData.width > 0 ? modelData.width : (ProcessesColumns.defFor(modelData.id)?.width ?? 100))
|
||||
z: held || returnAnim.running ? 1 : 0
|
||||
|
||||
states: State {
|
||||
name: "held"
|
||||
|
||||
PropertyChanges {
|
||||
cellBg.color: Colors.palette.m3primaryContainer
|
||||
elevation.opacity: 1
|
||||
placeholder.opacity: 0.1
|
||||
cell.radiusLerpProg: 1
|
||||
title.color: Colors.palette.m3onPrimaryContainer
|
||||
removeBtn.inactiveOnColor: Colors.palette.m3onPrimaryContainer
|
||||
}
|
||||
}
|
||||
|
||||
Behavior on leftRadius {
|
||||
Anim {
|
||||
type: Anim.DefaultEffects
|
||||
}
|
||||
}
|
||||
Behavior on rightRadius {
|
||||
Anim {
|
||||
type: Anim.DefaultEffects
|
||||
}
|
||||
}
|
||||
transitions: Transition {
|
||||
Anim {
|
||||
properties: "opacity,radiusLerpProg"
|
||||
type: Anim.SlowEffects
|
||||
}
|
||||
|
||||
PropertyAction {
|
||||
properties: "color,inactiveOnColor"
|
||||
}
|
||||
}
|
||||
state: held ? "held" : ""
|
||||
|
||||
CustomRect {
|
||||
id: placeholder
|
||||
|
||||
anchors.fill: parent
|
||||
color: Colors.palette.m3primary
|
||||
opacity: 0
|
||||
topLeftRadius: cell.leftRadius
|
||||
bottomLeftRadius: cell.leftRadius
|
||||
topRightRadius: cell.rightRadius
|
||||
bottomRightRadius: cell.rightRadius
|
||||
}
|
||||
|
||||
DragHandler {
|
||||
id: dragHandler
|
||||
|
||||
property real centerOffset: 0
|
||||
|
||||
enabled: cell.modelData.id !== ProcessesColumns.pinnedColumnId
|
||||
target: null
|
||||
xAxis.enabled: true
|
||||
dragThreshold: 10
|
||||
grabPermissions: PointerHandler.CanTakeOverFromItems
|
||||
|
||||
onActiveChanged: {
|
||||
if (active) {
|
||||
Cursor.setOverride(Qt.ClosedHandCursor);
|
||||
returnAnim.stop();
|
||||
|
||||
cell.pressIndex = cell.DelegateModel.itemsIndex;
|
||||
cell.lastMoveX = cell.x;
|
||||
cell.moved = true;
|
||||
cell.held = true;
|
||||
|
||||
const p = centroid.position;
|
||||
cell.pressPos = Qt.point(p.x, p.y);
|
||||
dragHandler.centerOffset = p.x - cell.width / 2;
|
||||
|
||||
cellContent.x = Qt.binding(() => {
|
||||
const maxOvershoot = Tokens.padding.extraLarge;
|
||||
const xDiff = cell.x - cell.lastMoveX;
|
||||
const x = dragHandler.centroid.position.x - cell.pressPos.x - xDiff;
|
||||
const absX = cell.mapToItem(columnList.contentItem, x, 0).x;
|
||||
const maxX = columnList.contentWidth - cell.width;
|
||||
|
||||
if (absX < 0)
|
||||
return x - absX - ProcessesColumns.dampOvershoot(-absX, maxOvershoot);
|
||||
|
||||
if (absX > maxX)
|
||||
return x - absX + maxX + ProcessesColumns.dampOvershoot(absX - maxX, maxOvershoot);
|
||||
|
||||
return x;
|
||||
});
|
||||
|
||||
cellContent.y = Qt.binding(() => {
|
||||
const maxOvershoot = Tokens.padding.extraLargeIncreased;
|
||||
const y = dragHandler.centroid.position.y - cell.pressPos.y;
|
||||
|
||||
return ProcessesColumns.dampOvershoot(Math.abs(y), maxOvershoot) * Math.sign(y);
|
||||
});
|
||||
} else {
|
||||
Cursor.clearOverride();
|
||||
if (cell.held) {
|
||||
cellContent.x = cellContent.x;
|
||||
cellContent.y = cellContent.y;
|
||||
|
||||
cell.held = false;
|
||||
returnAnim.start();
|
||||
|
||||
if (cell.DelegateModel.itemsIndex !== cell.pressIndex) {
|
||||
ProcessesColumns.moveColumns(cell.pressIndex, cell.DelegateModel.itemsIndex);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
onCentroidChanged: {
|
||||
if (!active)
|
||||
return;
|
||||
|
||||
const p = centroid.position;
|
||||
cell.lastMoveX = cell.x;
|
||||
|
||||
const cursorAbsX = cell.mapToItem(columnList.contentItem, p.x, 0).x;
|
||||
|
||||
const centerAbsX = cursorAbsX - dragHandler.centerOffset;
|
||||
|
||||
const movingRight = p.x > cell.pressPos.x;
|
||||
const grabbedRight = dragHandler.centerOffset > 0;
|
||||
|
||||
const useCursor = movingRight === grabbedRight;
|
||||
const refX = useCursor ? cursorAbsX : centerAbsX;
|
||||
|
||||
const myIndex = cell.DelegateModel.itemsIndex;
|
||||
|
||||
const rightItem = columnList.itemAtIndex(myIndex + 1);
|
||||
if (rightItem) {
|
||||
const rightMid = rightItem.x + rightItem.width / 2;
|
||||
if (refX > rightMid) {
|
||||
columnsVisual.items.move(myIndex, myIndex + 1);
|
||||
resizeOverlay.geometryTick++;
|
||||
Qt.callLater(() => resizeOverlay.geometryTick++);
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
const leftItem = columnList.itemAtIndex(myIndex - 1);
|
||||
if (leftItem) {
|
||||
const leftMid = leftItem.x + leftItem.width / 2;
|
||||
const pinnedAtZero = columnList.itemAtIndex(0)?.modelData?.id === ProcessesColumns.pinnedColumnId;
|
||||
if (refX < leftMid && !(myIndex === 1 && pinnedAtZero)) {
|
||||
columnsVisual.items.move(myIndex, myIndex - 1);
|
||||
resizeOverlay.geometryTick++;
|
||||
Qt.callLater(() => resizeOverlay.geometryTick++);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Anim {
|
||||
id: returnAnim
|
||||
|
||||
properties: "x,y"
|
||||
target: cellContent
|
||||
to: 0
|
||||
}
|
||||
|
||||
Item {
|
||||
id: cellVisual
|
||||
|
||||
x: cell.gapShrink * cell.gapX
|
||||
y: 0
|
||||
width: cell.width - cell.gapShrink * cell.gapProg
|
||||
height: cell.height
|
||||
|
||||
Item {
|
||||
id: cellContent
|
||||
|
||||
width: cellVisual.width
|
||||
height: cellVisual.height
|
||||
|
||||
readonly property int topLeftRadius: cell.lerpRadius(cell.leftRadius, cell.implicitHeight / 2)
|
||||
readonly property int topRightRadius: cell.lerpRadius(cell.rightRadius, cell.implicitHeight / 2)
|
||||
readonly property int bottomLeftRadius: cell.lerpRadius(cell.leftRadius, cell.implicitHeight / 2)
|
||||
readonly property int bottomRightRadius: cell.lerpRadius(cell.rightRadius, cell.implicitHeight / 2)
|
||||
|
||||
Elevation {
|
||||
id: elevation
|
||||
|
||||
anchors.fill: parent
|
||||
level: 3
|
||||
opacity: 0
|
||||
topLeftRadius: parent.topLeftRadius
|
||||
topRightRadius: parent.topRightRadius
|
||||
bottomLeftRadius: parent.bottomLeftRadius
|
||||
bottomRightRadius: parent.bottomRightRadius
|
||||
}
|
||||
|
||||
CustomRect {
|
||||
id: cellBg
|
||||
|
||||
anchors.fill: parent
|
||||
color: cell.isActiveSort ? Colors.palette.m3primary : Colors.palette.m3surfaceContainer
|
||||
|
||||
topLeftRadius: cell.lerpRadius(cell.leftRadius, cell.implicitHeight / 2)
|
||||
topRightRadius: cell.lerpRadius(cell.rightRadius, cell.implicitHeight / 2)
|
||||
bottomLeftRadius: cell.lerpRadius(cell.leftRadius, cell.implicitHeight / 2)
|
||||
bottomRightRadius: cell.lerpRadius(cell.rightRadius, cell.implicitHeight / 2)
|
||||
|
||||
StateLayer {
|
||||
id: layer
|
||||
|
||||
color: cell.isActiveSort ? Colors.palette.m3onPrimary : Colors.palette.m3onSurface
|
||||
manualHoverOverride: cell.held
|
||||
|
||||
onClicked: {
|
||||
Processes.sortBy(ProcessesColumns.defFor(cell.modelData.id)?.field ?? 0);
|
||||
root.pList.positionViewAtBeginning();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Item {
|
||||
anchors.fill: parent
|
||||
anchors.leftMargin: Tokens.padding.medium
|
||||
anchors.rightMargin: 12
|
||||
|
||||
CustomText {
|
||||
id: title
|
||||
anchors.left: parent.left
|
||||
anchors.right: removeBtn.visible ? removeBtn.left : parent.right
|
||||
anchors.rightMargin: Tokens.spacing.extraSmall
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
color: cell.isActiveSort ? Colors.palette.m3onPrimary : Colors.palette.m3onSurfaceVariant
|
||||
elide: CustomText.ElideRight
|
||||
text: ProcessesColumns.defFor(cell.modelData.id)?.title ?? cell.modelData.id
|
||||
}
|
||||
|
||||
IconButton {
|
||||
id: removeBtn
|
||||
anchors.right: parent.right
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
type: IconButton.Text
|
||||
icon: "close"
|
||||
font: Tokens.font.icon.small
|
||||
inactiveOnColor: Colors.palette.m3onPrimary
|
||||
visible: cell.modelData.id !== ProcessesColumns.pinnedColumnId
|
||||
onClicked: ProcessesColumns.removeColumn(cell.DelegateModel.itemsIndex)
|
||||
}
|
||||
|
||||
MaterialIcon {
|
||||
anchors.right: removeBtn.visible ? removeBtn.left : parent.right
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
|
||||
text: "keyboard_arrow_down"
|
||||
opacity: cell.isActiveSort ? 1 : 0
|
||||
visible: opacity > 0
|
||||
rotation: !Processes.sortAscending && opacity > 0 ? 180 : 0
|
||||
color: Colors.palette.m3onPrimary
|
||||
|
||||
Behavior on rotation {
|
||||
Anim {}
|
||||
}
|
||||
|
||||
Behavior on opacity {
|
||||
Anim {}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
component HiddenColumnItem: MenuItem {
|
||||
required property var modelData
|
||||
|
||||
text: modelData.title
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user