github/dootask
1
0
Fork 0
mirror of https://github.com/kuaifan/dootask.git synced 2025-12-11 18:42:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: 工作流支持自定义颜色

Browse Source
This commit is contained in:
kuaifan 2025-08-01 11:27:00 +08:00
parent 02544d29fd
commit e792ab7b4d
27 changed files with 397 additions and 243 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app/Http/Controllers/Api/ProjectController.php
View File

@ -2367,7 +2367,7 @@ class ProjectController extends AbstractController
$task->updateTask($data, $updateMarking); $task->updateTask($data, $updateMarking);
// //
$data = ProjectTask::oneTask($task->id)->toArray(); $data = ProjectTask::oneTask($task->id)->toArray();
$data["flow_item_name"] = $newFlowItem->status . "|" . $newFlowItem->name; $data["flow_item_name"] = $newFlowItem->status . "|" . $newFlowItem->name . "|" . $newFlowItem->color;
$data['update_marking'] = $updateMarking ?: json_decode('{}'); $data['update_marking'] = $updateMarking ?: json_decode('{}');
$task->pushMsg('update', $data); $task->pushMsg('update', $data);
// //
@ -2424,7 +2424,7 @@ class ProjectController extends AbstractController
]); ]);
} }
// //
$turns = ProjectFlowItem::select(['id', 'name', 'status', 'turns'])->whereFlowId($projectFlow->id)->orderBy('sort')->get(); $turns = ProjectFlowItem::select(['id', 'name', 'status', 'turns', 'color'])->whereFlowId($projectFlow->id)->orderBy('sort')->get();
if (empty($projectFlowItem)) { if (empty($projectFlowItem)) {
$data = [ $data = [
'task_id' => $projectTask->id, 'task_id' => $projectTask->id,

14
app/Models/Project.php
View File

@ -423,24 +423,25 @@ class Project extends AbstractModel
$projectUserids = $this->relationUserids(); $projectUserids = $this->relationUserids();
foreach ($flows as $item) { foreach ($flows as $item) {
$id = intval($item['id']); $id = intval($item['id']);
$name = trim(str_replace('|', '·', $item['name']));
$turns = Base::arrayRetainInt($item['turns'] ?: [], true); $turns = Base::arrayRetainInt($item['turns'] ?: [], true);
$userids = Base::arrayRetainInt($item['userids'] ?: [], true); $userids = Base::arrayRetainInt($item['userids'] ?: [], true);
$usertype = trim($item['usertype']); $usertype = trim($item['usertype']);
$userlimit = intval($item['userlimit']); $userlimit = intval($item['userlimit']);
$columnid = intval($item['columnid']); $columnid = intval($item['columnid']);
if ($usertype == 'replace' && empty($userids)) { if ($usertype == 'replace' && empty($userids)) {
throw new ApiException("状态[{$item['name']}]设置错误，设置流转模式时必须填写状态负责人"); throw new ApiException("状态[{$name}]设置错误，设置流转模式时必须填写状态负责人");
} }
if ($usertype == 'merge' && empty($userids)) { if ($usertype == 'merge' && empty($userids)) {
throw new ApiException("状态[{$item['name']}]设置错误，设置剔除模式时必须填写状态负责人"); throw new ApiException("状态[{$name}]设置错误，设置剔除模式时必须填写状态负责人");
} }
if ($userlimit && empty($userids)) { if ($userlimit && empty($userids)) {
throw new ApiException("状态[{$item['name']}]设置错误，设置限制负责人时必须填写状态负责人"); throw new ApiException("状态[{$name}]设置错误，设置限制负责人时必须填写状态负责人");
} }
foreach ($userids as $userid) { foreach ($userids as $userid) {
if (!in_array($userid, $projectUserids)) { if (!in_array($userid, $projectUserids)) {
$nickname = User::userid2nickname($userid); $nickname = User::userid2nickname($userid);
throw new ApiException("状态[{$item['name']}]设置错误，状态负责人[{$nickname}]不在项目成员内"); throw new ApiException("状态[{$name}]设置错误，状态负责人[{$nickname}]不在项目成员内");
} }
} }
$flow = ProjectFlowItem::updateInsert([ $flow = ProjectFlowItem::updateInsert([
@ -448,8 +449,9 @@ class Project extends AbstractModel
'project_id' => $this->id, 'project_id' => $this->id,
'flow_id' => $projectFlow->id, 'flow_id' => $projectFlow->id,
], [ ], [
'name' => trim($item['name']), 'name' => $name,
'status' => trim($item['status']), 'status' => trim($item['status']),
'color' => trim($item['color']),
'sort' => intval($item['sort']), 'sort' => intval($item['sort']),
'turns' => $turns, 'turns' => $turns,
'userids' => $userids, 'userids' => $userids,
@ -469,7 +471,7 @@ class Project extends AbstractModel
$hasEnd = true; $hasEnd = true;
} }
if (!$isInsert) { if (!$isInsert) {
$upTaskList[$flow->id] = $flow->status . "|" . $flow->name; $upTaskList[$flow->id] = $flow->status . "|" . $flow->name . "|" . $flow->color;
} }
} }
} }

2
app/Models/ProjectFlowItem.php
View File

@ -12,6 +12,7 @@ use App\Module\Base;
* @property int|null $flow_id 流程ID * @property int|null $flow_id 流程ID
* @property string|null $name 名称 * @property string|null $name 名称
* @property string|null $status 状态 * @property string|null $status 状态
* @property string|null $color 自定义颜色
* @property array $turns 可流转 * @property array $turns 可流转
* @property array $userids 状态负责人ID * @property array $userids 状态负责人ID
* @property string|null $usertype 流转模式 * @property string|null $usertype 流转模式
@ -38,6 +39,7 @@ use App\Module\Base;
* @method static \Illuminate\Database\Eloquent\Builder|ProjectFlowItem whereProjectId($value) * @method static \Illuminate\Database\Eloquent\Builder|ProjectFlowItem whereProjectId($value)
* @method static \Illuminate\Database\Eloquent\Builder|ProjectFlowItem whereSort($value) * @method static \Illuminate\Database\Eloquent\Builder|ProjectFlowItem whereSort($value)
* @method static \Illuminate\Database\Eloquent\Builder|ProjectFlowItem whereStatus($value) * @method static \Illuminate\Database\Eloquent\Builder|ProjectFlowItem whereStatus($value)
* @method static \Illuminate\Database\Eloquent\Builder|ProjectFlowItem whereColor($value)
* @method static \Illuminate\Database\Eloquent\Builder|ProjectFlowItem whereTurns($value) * @method static \Illuminate\Database\Eloquent\Builder|ProjectFlowItem whereTurns($value)
* @method static \Illuminate\Database\Eloquent\Builder|ProjectFlowItem whereUpdatedAt($value) * @method static \Illuminate\Database\Eloquent\Builder|ProjectFlowItem whereUpdatedAt($value)
* @method static \Illuminate\Database\Eloquent\Builder|ProjectFlowItem whereUserids($value) * @method static \Illuminate\Database\Eloquent\Builder|ProjectFlowItem whereUserids($value)

6
app/Models/ProjectTask.php
View File

@ -485,7 +485,7 @@ class ProjectTask extends AbstractModel
foreach ($projectFlowItem as $item) { foreach ($projectFlowItem as $item) {
if ($item->status == 'start') { if ($item->status == 'start') {
$task->flow_item_id = $item->id; $task->flow_item_id = $item->id;
$task->flow_item_name = $item->status . "|" . $item->name; $task->flow_item_name = $item->status . "|" . $item->name . "|" . $item->color;
$owner = array_merge($owner, $item->userids); $owner = array_merge($owner, $item->userids);
break; break;
} }
@ -649,7 +649,7 @@ class ProjectTask extends AbstractModel
$data['column_id'] = $newFlowItem->columnid; $data['column_id'] = $newFlowItem->columnid;
} }
$this->flow_item_id = $newFlowItem->id; $this->flow_item_id = $newFlowItem->id;
$this->flow_item_name = $newFlowItem->status . "|" . $newFlowItem->name; $this->flow_item_name = $newFlowItem->status . "|" . $newFlowItem->name . "|" . $newFlowItem->color;
$this->addLog("修改{任务}状态", [ $this->addLog("修改{任务}状态", [
'flow' => $flowData, 'flow' => $flowData,
'change' => [$currentFlowItem?->name, $newFlowItem->name] 'change' => [$currentFlowItem?->name, $newFlowItem->name]
@ -1907,7 +1907,7 @@ class ProjectTask extends AbstractModel
// 更新任务流程 // 更新任务流程
$flowItem = projectFlowItem::whereProjectId($projectId)->whereId($flowItemId)->first(); $flowItem = projectFlowItem::whereProjectId($projectId)->whereId($flowItemId)->first();
$this->flow_item_id = $flowItemId; $this->flow_item_id = $flowItemId;
$this->flow_item_name = $flowItem->status . "|" . $flowItem->name; $this->flow_item_name = $flowItem->status . "|" . $flowItem->name . "|" . $flowItem->color;
if ($flowItem->status == 'end') { if ($flowItem->status == 'end') {
$this->completeTask(Carbon::now(), $flowItem->name); $this->completeTask(Carbon::now(), $flowItem->name);
} else { } else {

2
app/Tasks/LoopTask.php
View File

@ -40,7 +40,7 @@ class LoopTask extends AbstractTask
foreach ($projectFlowItem as $flowItem) { foreach ($projectFlowItem as $flowItem) {
if ($flowItem->status == 'start') { if ($flowItem->status == 'start') {
$task->flow_item_id = $flowItem->id; $task->flow_item_id = $flowItem->id;
$task->flow_item_name = $flowItem->status . "|" . $flowItem->name; $task->flow_item_name = $flowItem->status . "|" . $flowItem->name . "|" . $flowItem->color;
if ($flowItem->userids) { if ($flowItem->userids) {
$userids = array_values(array_unique($flowItem->userids)); $userids = array_values(array_unique($flowItem->userids));
foreach ($userids as $uid) { foreach ($userids as $uid) {

34
database/migrations/2025_07_31_231557_add_color_to_project_flow_items_table.php Normal file
View File

@ -0,0 +1,34 @@
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
class AddColorToProjectFlowItemsTable extends Migration
{
/**
* Run the migrations.
*
* @return void
*/
public function up()
{
Schema::table('project_flow_items', function (Blueprint $table) {
if (!Schema::hasColumn('project_flow_items', 'color')) {
$table->string('color', 20)->nullable()->default('')->after('status')->comment('自定义颜色');
}
});
}
/**
* Reverse the migrations.
*
* @return void
*/
public function down()
{
Schema::table('project_flow_items', function (Blueprint $table) {
$table->dropColumn('color');
});
}
}

65
resources/assets/js/functions/web.js vendored
View File

@ -692,6 +692,71 @@ import {convertLocalResourcePath} from "../components/Replace/utils";
return secondLast; return secondLast;
} }
return ""; return "";
},
/**
* 根据十六进制颜色生成通用 CSS 变量样式
* @param {string} hexColor - 颜色值，格式如 "#RRGGBB"
* @param {number[]} levels - 需要生成的透明度等级数组（如 [10, 20, 70]，代表 10%、20%、70%）
* @param {string} prefix - 生成的 CSS 变量前缀，默认为 'custom-color'
* @param {Object|null} styles - 可选的样式对象，如果未传入则会创建一个新的对象
* @returns {Object|null} 返回包含 CSS 变量的对象，若未传入颜色则返回 null
*/
generateColorVarStyle(hexColor, levels = [], prefix = 'custom-color', styles = null) {
if (typeof hexColor !== 'string' || !/^#([0-9a-fA-F]{6})$/.test(hexColor)) {
return styles;
}
// 解析十六进制颜色为 RGB
const r = parseInt(hexColor.substring(1, 3), 16);
const g = parseInt(hexColor.substring(3, 5), 16);
const b = parseInt(hexColor.substring(5, 7), 16);
// 初始化样式对象
if (!$A.isJson(styles)) {
styles = {};
}
// 遍历 levels，生成对应透明度的 rgba 变量
levels.forEach(level => {
// 只处理有效的数字
if (typeof level === 'number' && level >= 0 && level <= 100) {
const alpha = Math.round((level / 100) * 100) / 100; // 保留两位小数
styles[`--${prefix}-${level}`] = `rgba(${r}, ${g}, ${b}, ${alpha})`;
}
});
// 加上 100% 不透明度直接用 hexColor
styles[`--${prefix}-100`] = hexColor
return styles;
},
/**
* 转换工作流状态
* @param {string|{flow_item_name, complete_at}} item
* @returns {{status: null, name: string, color: null}}
*/
convertWorkflow(item) {
let status = null,
name = item,
color = null;
if ($A.isJson(item)) {
name = item.flow_item_name
if (name.indexOf("|") === -1) {
if (name.complete_at) {
name = $A.L('已完成');
} else {
name = $A.L('未完成');
}
}
}
if (name && name.indexOf("|") !== -1) {
const arr = `${name}||`.split("|")
status = arr[0]
name = arr[1]
color = arr[2]
}
return {status, name, color}
} }
}); });

1
resources/assets/js/pages/manage.vue
View File

@ -36,6 +36,7 @@
v-for="(item, key) in taskBrowseLists" v-for="(item, key) in taskBrowseLists"
v-if="item.id > 0 && key < 10" v-if="item.id > 0 && key < 10"
:key="key" :key="key"
:style="$A.generateColorVarStyle(item.flow_item_color, [10], 'flow-item-custom-color')"
class="task-title" class="task-title"
@click.native="openTask(item)" @click.native="openTask(item)"
:name="item.name"> :name="item.name">

7
resources/assets/js/pages/manage/components/ProjectPanel.vue
View File

@ -128,7 +128,6 @@
<EDropdown <EDropdown
v-else v-else
trigger="click" trigger="click"
size="small"
@command="dropColumn(column, $event)"> @command="dropColumn(column, $event)">
<Icon type="ios-more" /> <Icon type="ios-more" />
<EDropdownMenu slot="dropdown" class="project-panel-more-dropdown-menu"> <EDropdownMenu slot="dropdown" class="project-panel-more-dropdown-menu">
@ -181,9 +180,10 @@
@remove="sortUpdate"> @remove="sortUpdate">
<div <div
v-for="item in column.tasks" v-for="item in column.tasks"
:key="`${column.id}_${item.id}`"
:data-id="item.id" :data-id="item.id"
:class="['task-item task-draggable', item.complete_at ? 'complete' : '', taskIsHidden(item) ? 'hidden' : '']" :class="['task-item task-draggable', item.complete_at ? 'complete' : '', taskIsHidden(item) ? 'hidden' : '']"
:style="taskItemStyle(item)" :style="$A.generateColorVarStyle(item.flow_item_color, [10], 'flow-item-custom-color', taskItemStyle(item))"
@click="openTask(item)"> @click="openTask(item)">
<template v-if="taskItemVisible(item)"> <template v-if="taskItemVisible(item)">
<div :class="['task-head', item.desc ? 'has-desc' : '']"> <div :class="['task-head', item.desc ? 'has-desc' : '']">
@ -973,7 +973,8 @@ export default {
value: item2.id, value: item2.id,
label: `${item2.name} (${length})`, label: `${item2.name} (${length})`,
status: item2.status, status: item2.status,
class: item2.status class: item2.status,
style: $A.generateColorVarStyle(item2.color, [10], 'flow-item-custom-color'),
} }
}) })
} }

37
resources/assets/js/pages/manage/components/ProjectWorkflow.vue
View File

@ -13,7 +13,13 @@
<div class="workflow-item"> <div class="workflow-item">
<div class="workflow-name">{{data.name}}</div> <div class="workflow-name">{{data.name}}</div>
<div class="workflow-status"> <div class="workflow-status">
<div v-for="item in data.project_flow_item" :class="item.status">{{item.name}}</div> <div
v-for="item in data.project_flow_item"
:key="item.id"
:class="item.status"
:style="$A.generateColorVarStyle(item.color, [10], 'flow-item-custom-color')">
{{item.name}}
</div>
</div> </div>
<div class="workflow-save" @click.stop=""> <div class="workflow-save" @click.stop="">
<template v-if="contrast(data.project_flow_item, data.project_flow_bak)"> <template v-if="contrast(data.project_flow_item, data.project_flow_bak)">
@ -57,7 +63,7 @@
</div> </div>
<div class="taskflow-config-table-block hr"> <div class="taskflow-config-table-block hr">
<div class="taskflow-config-table-block-title">{{$L('可流转到')}}</div> <div class="taskflow-config-table-block-title">{{$L('可流转到')}}</div>
<div v-for="item in data.project_flow_item" class="taskflow-config-table-block-item"> <div v-for="item in data.project_flow_item" :key="item.id" class="taskflow-config-table-block-item">
<span class="transform-status-name">{{item.name}}</span> <span class="transform-status-name">{{item.name}}</span>
</div> </div>
</div> </div>
@ -71,8 +77,13 @@
class="taskflow-config-table-list-wrapper" class="taskflow-config-table-list-wrapper"
tag="div" tag="div"
draggable=".column-border" draggable=".column-border"
@sort=""> @sort="() => {}">
<div v-for="item in data.project_flow_item" class="taskflow-config-table-status-column column-border" :class="item.status"> <div
v-for="(item, index) in data.project_flow_item"
:key="index"
:style="$A.generateColorVarStyle(item.color, [10, 20, 70], 'flow-item-custom-color')"
class="taskflow-config-table-status-column column-border"
:class="item.status">
<div <div
class="taskflow-config-table-status-item taskflow-config-table-column-header"> class="taskflow-config-table-status-item taskflow-config-table-column-header">
<div class="status-label-with-menu" :class="item.status"> <div class="status-label-with-menu" :class="item.status">
@ -88,6 +99,8 @@
</Badge> </Badge>
</div> </div>
<EDropdownMenu slot="dropdown" class="taskflow-config-more-dropdown-menu"> <EDropdownMenu slot="dropdown" class="taskflow-config-more-dropdown-menu">
<li class="taskflow-config-more-dropdown-warp">
<ul>
<EDropdownItem v-if="item.userids.length > 0" command="user"> <EDropdownItem v-if="item.userids.length > 0" command="user">
<div class="users"> <div class="users">
<UserAvatar v-for="(uid, ukey) in item.userids" :key="ukey" :userid="uid" :size="28" :borderWidth="1" :showName="item.userids.length === 1"/> <UserAvatar v-for="(uid, ukey) in item.userids" :key="ukey" :userid="uid" :size="28" :borderWidth="1" :showName="item.userids.length === 1"/>
@ -111,6 +124,13 @@
<Icon type="md-trash" />{{$L('删除')}} <Icon type="md-trash" />{{$L('删除')}}
</div> </div>
</EDropdownItem> </EDropdownItem>
<EDropdownItem v-for="(c, k) in $store.state.columnColorList" :key="k" :divided="k==0" :command="c">
<div class="item">
<i class="taskfont" :style="{color:c.color||'#ddd'}" v-html="c.color == item.color ? '&#xe61d;' : '&#xe61c;'"></i>{{$L(c.name)}}
</div>
</EDropdownItem>
</ul>
</li>
</EDropdownMenu> </EDropdownMenu>
</EDropdown> </EDropdown>
</div> </div>
@ -415,8 +435,8 @@ export default {
}); });
}, },
onMore(name, item) { onMore(command, item) {
switch (name) { switch (command) {
case "user": case "user":
this.$set(this.settingData, 'id', item.id); this.$set(this.settingData, 'id', item.id);
this.$set(this.settingData, 'name', item.name); this.$set(this.settingData, 'name', item.name);
@ -434,6 +454,11 @@ export default {
case "remove": case "remove":
this.onRemove(item); this.onRemove(item);
break; break;
default:
if (command.name) {
this.$set(item, 'color', command.color);
}
} }
}, },

10
resources/assets/js/pages/manage/components/TaskArchived.vue
View File

@ -26,13 +26,19 @@
<template v-if="flows.type==='group'"> <template v-if="flows.type==='group'">
<OptionGroup v-for="(group, index) in flows.groups" :key="index" :label="group.label"> <OptionGroup v-for="(group, index) in flows.groups" :key="index" :label="group.label">
<Option v-for="(item, key) in group.items" :key="key" :value="item.id" :label="item.name"> <Option v-for="(item, key) in group.items" :key="key" :value="item.id" :label="item.name">
<div class="tag-dot" :class="item.status">{{item.name}}</div> <div
class="tag-dot"
:style="$A.generateColorVarStyle(item.color, [], 'flow-item-custom-color')"
:class="item.status">{{item.name}}</div>
</Option> </Option>
</OptionGroup> </OptionGroup>
</template> </template>
<template v-else> <template v-else>
<Option v-for="(item, key) in flows.items" :key="key" :value="item.id" :label="item.name"> <Option v-for="(item, key) in flows.items" :key="key" :value="item.id" :label="item.name">
<div class="tag-dot" :class="item.status">{{item.name}}</div> <div
class="tag-dot"
:style="$A.generateColorVarStyle(item.color, [], 'flow-item-custom-color')"
:class="item.status">{{item.name}}</div>
</Option> </Option>
</template> </template>
</Select> </Select>

10
resources/assets/js/pages/manage/components/TaskDeleted.vue
View File

@ -26,13 +26,19 @@
<template v-if="flows.type==='group'"> <template v-if="flows.type==='group'">
<OptionGroup v-for="(group, index) in flows.groups" :key="index" :label="group.label"> <OptionGroup v-for="(group, index) in flows.groups" :key="index" :label="group.label">
<Option v-for="(item, key) in group.items" :key="key" :value="item.id" :label="item.name"> <Option v-for="(item, key) in group.items" :key="key" :value="item.id" :label="item.name">
<div class="tag-dot" :class="item.status">{{item.name}}</div> <div
class="tag-dot"
:style="$A.generateColorVarStyle(item.color, [], 'flow-item-custom-color')"
:class="item.status">{{item.name}}</div>
</Option> </Option>
</OptionGroup> </OptionGroup>
</template> </template>
<template v-else> <template v-else>
<Option v-for="(item, key) in flows.items" :key="key" :value="item.id" :label="item.name"> <Option v-for="(item, key) in flows.items" :key="key" :value="item.id" :label="item.name">
<div class="tag-dot" :class="item.status">{{item.name}}</div> <div
class="tag-dot"
:style="$A.generateColorVarStyle(item.color, [], 'flow-item-custom-color')"
:class="item.status">{{item.name}}</div>
</Option> </Option>
</template> </template>
</Select> </Select>

10
resources/assets/js/pages/manage/components/TaskDetail.vue
View File

@ -9,7 +9,10 @@
:load-status="taskDetail.loading === true" :load-status="taskDetail.loading === true"
@on-update="getLogLists"/> @on-update="getLogLists"/>
</div> </div>
<div v-if="taskDetail.flow_item_name" class="subtask-flow"> <div
v-if="taskDetail.flow_item_name"
class="subtask-flow"
:style="$A.generateColorVarStyle(taskDetail.flow_item_color, [10], 'flow-item-custom-color')">
<span :class="taskDetail.flow_item_status" @click.stop="openMenu($event, taskDetail)">{{taskDetail.flow_item_name}}</span> <span :class="taskDetail.flow_item_status" @click.stop="openMenu($event, taskDetail)">{{taskDetail.flow_item_name}}</span>
</div> </div>
<div class="subtask-name"> <div class="subtask-name">
@ -69,7 +72,10 @@
size="medium" size="medium"
:color-show="false" :color-show="false"
@on-update="getLogLists"/> @on-update="getLogLists"/>
<div v-if="taskDetail.flow_item_name" class="flow"> <div
v-if="taskDetail.flow_item_name"
class="flow"
:style="$A.generateColorVarStyle(taskDetail.flow_item_color, [10], 'flow-item-custom-color')">
<span :class="taskDetail.flow_item_status" @click.stop="openMenu($event, taskDetail)">{{taskDetail.flow_item_name}}</span> <span :class="taskDetail.flow_item_status" @click.stop="openMenu($event, taskDetail)">{{taskDetail.flow_item_name}}</span>
</div> </div>
<div v-if="taskDetail.archived_at" class="flow"> <div v-if="taskDetail.archived_at" class="flow">

2
resources/assets/js/pages/manage/components/TaskMove.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<div class="task-move"> <div class="task-move" :style="$A.generateColorVarStyle(task.flow_item_color, [10], 'flow-item-custom-color')">
<Cascader <Cascader
v-model="cascader" v-model="cascader"

6
resources/assets/js/pages/manage/components/TaskOperation.vue
View File

@ -20,7 +20,11 @@
</div> </div>
</EDropdownItem> </EDropdownItem>
<template v-else-if="turns.length > 0"> <template v-else-if="turns.length > 0">
<EDropdownItem v-for="item in turns" :key="item.id" :command="`turn::${item.id}`"> <EDropdownItem
v-for="item in turns"
:key="item.id"
:command="`turn::${item.id}`"
:style="$A.generateColorVarStyle(item.color, [10], 'flow-item-custom-color')">
<div class="item flow"> <div class="item flow">
<Icon v-if="item.id == task.flow_item_id && flow.auto_assign !== true" class="check" type="md-checkmark-circle-outline" /> <Icon v-if="item.id == task.flow_item_id && flow.auto_assign !== true" class="check" type="md-checkmark-circle-outline" />
<Icon v-else type="md-radio-button-off" /> <Icon v-else type="md-radio-button-off" />

2
resources/assets/js/pages/manage/components/TaskRow.vue
View File

@ -8,7 +8,7 @@
class="task-item"> class="task-item">
<Row <Row
class="task-row" class="task-row"
:style="taskItemStyle(item)"> :style="$A.generateColorVarStyle(item.flow_item_color, [10], 'flow-item-custom-color', taskItemStyle(item))">
<template v-if="taskItemVisible(`${openKey}_${item.id}`)"> <template v-if="taskItemVisible(`${openKey}_${item.id}`)">
<em v-if="item.p_name" class="priority-color" :style="{backgroundColor:item.p_color}"></em> <em v-if="item.p_name" class="priority-color" :style="{backgroundColor:item.p_color}"></em>
<Col span="12" :class="['row-name', item.complete_at ? 'complete' : '']"> <Col span="12" :class="['row-name', item.complete_at ? 'complete' : '']">

2
resources/assets/js/pages/manage/dashboard.vue
View File

@ -64,7 +64,7 @@
v-for="(item, index) in column.list" v-for="(item, index) in column.list"
:key="index" :key="index"
:class="{complete: item.complete_at}" :class="{complete: item.complete_at}"
:style="item.color ? {backgroundColor: item.color} : {}" :style="$A.generateColorVarStyle(item.flow_item_color, [10], 'flow-item-custom-color', item.color ? {backgroundColor: item.color} : {})"
@click="openTask(item)"> @click="openTask(item)">
<em <em
v-if="item.p_name" v-if="item.p_name"

8
resources/assets/js/store/actions.js vendored
View File

@ -1868,8 +1868,12 @@ export default {
}); });
} else if ($A.isJson(data)) { } else if ($A.isJson(data)) {
data._time = $A.dayjs().unix(); data._time = $A.dayjs().unix();
//
if (data.flow_item_name && data.flow_item_name.indexOf("|") !== -1) { if (data.flow_item_name && data.flow_item_name.indexOf("|") !== -1) {
[data.flow_item_status, data.flow_item_name] = data.flow_item_name.split("|") const flowInfo = $A.convertWorkflow(data.flow_item_name)
data.flow_item_status = flowInfo.status;
data.flow_item_name = flowInfo.name;
data.flow_item_color = flowInfo.color;
} }
// //
if (typeof data.archived_at !== "undefined") { if (typeof data.archived_at !== "undefined") {
@ -2652,7 +2656,7 @@ export default {
state.cacheTasks.filter(({flow_item_id})=> flow_item_id == item.id).some(task => { state.cacheTasks.filter(({flow_item_id})=> flow_item_id == item.id).some(task => {
dispatch("saveTask", { dispatch("saveTask", {
id: task.id, id: task.id,
flow_item_name: `${item.status}|${item.name}`, flow_item_name: `${item.status}|${item.name}|${item.color}`,
}) })
}) })
} }

17
resources/assets/js/store/state.js vendored
View File

@ -193,15 +193,20 @@ export default {
// 列表背景色 // 列表背景色
columnColorList: [ columnColorList: [
{name: '默认', color: ''}, {name: '默认', color: ''},
{name: '灰色', color: '#999999'},
{name: '棕色', color: '#947364'},
{name: '橘色', color: '#faaa6c'},
{name: '黄色', color: '#f2d86d'},
{name: '绿色', color: '#73b45c'},
{name: '蓝色', color: '#51abea'}, {name: '蓝色', color: '#51abea'},
{name: '绿色', color: '#73b45c'},
{name: '黄色', color: '#f2d86d'},
{name: '橙色', color: '#faaa6c'},
{name: '红色', color: '#ff7070'},
{name: '紫色', color: '#b583e3'}, {name: '紫色', color: '#b583e3'},
{name: '粉色', color: '#ff819c'}, {name: '粉色', color: '#ff819c'},
{name: '红色', color: '#ff7070'}, {name: '青色', color: '#3ad1c8'},
{name: '棕色', color: '#947364'},
{name: '灰色', color: '#999999'},
{name: '深蓝', color: '#2b5caa'},
{name: '深绿', color: '#1a7f5a'},
{name: '金色', color: '#ffd700'},
{name: '湖蓝', color: '#00bcd4'},
], ],
// 任务背景色 // 任务背景色

11
resources/assets/sass/pages/common.scss vendored
View File

@ -974,19 +974,22 @@ body.window-portrait {
transform: translateY(-50%); transform: translateY(-50%);
} }
&.start:after { &.start:after {
background-color: $flow-status-start-color; background-color: var(--flow-item-custom-color-100, $flow-status-start-color);
} }
&.progress:after { &.progress:after {
background-color: $flow-status-progress-color; background-color: var(--flow-item-custom-color-100, $flow-status-progress-color);
} }
&.test:after { &.test:after {
background-color: $flow-status-test-color; background-color: var(--flow-item-custom-color-100, $flow-status-test-color);
} }
&.completed:after,
&.end:after { &.end:after {
background-color: var(--flow-item-custom-color-100, $flow-status-end-color);
}
&.completed:after {
background-color: $flow-status-end-color; background-color: $flow-status-end-color;
} }

24
resources/assets/sass/pages/components/general-operation.scss vendored
View File

@ -113,27 +113,27 @@
color: #595959; color: #595959;
&.start { &.start {
background-color: rgba($flow-status-start-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-start-color, 0.1));
border-color: rgba($flow-status-start-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-start-color, 0.1));
color: $flow-status-start-color; color: var(--flow-item-custom-color-100, $flow-status-start-color);
} }
&.progress { &.progress {
background-color: rgba($flow-status-progress-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-progress-color, 0.1));
border-color: rgba($flow-status-progress-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-progress-color, 0.1));
color: $flow-status-progress-color; color: var(--flow-item-custom-color-100, $flow-status-progress-color);
} }
&.test { &.test {
background-color: rgba($flow-status-test-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-test-color, 0.1));
border-color: rgba($flow-status-test-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-test-color, 0.1));
color: $flow-status-test-color; color: var(--flow-item-custom-color-100, $flow-status-test-color);
} }
&.end { &.end {
background-color: rgba($flow-status-end-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-end-color, 0.1));
border-color: rgba($flow-status-end-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-end-color, 0.1));
color: $flow-status-end-color; color: var(--flow-item-custom-color-100, $flow-status-end-color);
} }
} }
} }

99
resources/assets/sass/pages/components/project-panel.scss vendored
View File

@ -173,24 +173,24 @@
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
&.start { &.start {
background-color: rgba($flow-status-start-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-start-color, 0.1));
border-color: rgba($flow-status-start-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-start-color, 0.1));
color: $flow-status-start-color; color: var(--flow-item-custom-color-100, $flow-status-start-color);
} }
&.progress { &.progress {
background-color: rgba($flow-status-progress-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-progress-color, 0.1));
border-color: rgba($flow-status-progress-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-progress-color, 0.1));
color: $flow-status-progress-color; color: var(--flow-item-custom-color-100, $flow-status-progress-color);
} }
&.test { &.test {
background-color: rgba($flow-status-test-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-test-color, 0.1));
border-color: rgba($flow-status-test-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-test-color, 0.1));
color: $flow-status-test-color; color: var(--flow-item-custom-color-100, $flow-status-test-color);
} }
&.end { &.end {
background-color: rgba($flow-status-end-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-end-color, 0.1));
border-color: rgba($flow-status-end-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-end-color, 0.1));
color: $flow-status-end-color; color: var(--flow-item-custom-color-100, $flow-status-end-color);
} }
&.tag-dot { &.tag-dot {
position: relative; position: relative;
@ -420,24 +420,24 @@
text-align: center; text-align: center;
overflow: hidden; overflow: hidden;
&.start { &.start {
background-color: rgba($flow-status-start-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-start-color, 0.1));
border-color: rgba($flow-status-start-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-start-color, 0.1));
color: $flow-status-start-color; color: var(--flow-item-custom-color-100, $flow-status-start-color);
} }
&.progress { &.progress {
background-color: rgba($flow-status-progress-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-progress-color, 0.1));
border-color: rgba($flow-status-progress-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-progress-color, 0.1));
color: $flow-status-progress-color; color: var(--flow-item-custom-color-100, $flow-status-progress-color);
} }
&.test { &.test {
background-color: rgba($flow-status-test-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-test-color, 0.1));
border-color: rgba($flow-status-test-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-test-color, 0.1));
color: $flow-status-test-color; color: var(--flow-item-custom-color-100, $flow-status-test-color);
} }
&.end { &.end {
background-color: rgba($flow-status-end-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-end-color, 0.1));
border-color: rgba($flow-status-end-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-end-color, 0.1));
color: $flow-status-end-color; color: var(--flow-item-custom-color-100, $flow-status-end-color);
} }
} }
> pre { > pre {
@ -788,24 +788,24 @@
margin-right: 3px; margin-right: 3px;
text-align: center; text-align: center;
&.start { &.start {
background-color: rgba($flow-status-start-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-start-color, 0.1));
border-color: rgba($flow-status-start-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-start-color, 0.1));
color: $flow-status-start-color; color: var(--flow-item-custom-color-100, $flow-status-start-color);
} }
&.progress { &.progress {
background-color: rgba($flow-status-progress-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-progress-color, 0.1));
border-color: rgba($flow-status-progress-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-progress-color, 0.1));
color: $flow-status-progress-color; color: var(--flow-item-custom-color-100, $flow-status-progress-color);
} }
&.test { &.test {
background-color: rgba($flow-status-test-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-test-color, 0.1));
border-color: rgba($flow-status-test-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-test-color, 0.1));
color: $flow-status-test-color; color: var(--flow-item-custom-color-100, $flow-status-test-color);
} }
&.end { &.end {
background-color: rgba($flow-status-end-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-end-color, 0.1));
border-color: rgba($flow-status-end-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-end-color, 0.1));
color: $flow-status-end-color; color: var(--flow-item-custom-color-100, $flow-status-end-color);
} }
} }
} }
@ -961,6 +961,7 @@
.project-panel-more-dropdown-menu { .project-panel-more-dropdown-menu {
.project-panel-more-dropdown-warp { .project-panel-more-dropdown-warp {
height: 400px;
min-height: 120px; min-height: 120px;
max-height: calc(100vh - 250px); max-height: calc(100vh - 250px);
overflow-y: auto; overflow-y: auto;
@ -1008,16 +1009,16 @@
color: $primary-text-color !important; color: $primary-text-color !important;
&.start { &.start {
color: $flow-status-start-color !important; color: var(--flow-item-custom-color-100, $flow-status-start-color) !important;
} }
&.progress { &.progress {
color: $flow-status-progress-color !important; color: var(--flow-item-custom-color-100, $flow-status-progress-color) !important;
} }
&.test { &.test {
color: $flow-status-test-color !important; color: var(--flow-item-custom-color-100, $flow-status-test-color) !important;
} }
&.end { &.end {
color: $flow-status-end-color !important; color: var(--flow-item-custom-color-100, $flow-status-end-color) !important;
} }
&.tag-dot { &.tag-dot {
@ -1041,24 +1042,6 @@
border-top: 1px solid #EBEEF5; border-top: 1px solid #EBEEF5;
} }
} }
&:hover,
&.ivu-cascader-menu-item-active {
&.project-panel-flow-cascader-item {
&.start {
background-color: rgba($flow-status-start-color, 0.1);
}
&.progress {
background-color: rgba($flow-status-progress-color, 0.1);
}
&.test {
background-color: rgba($flow-status-test-color, 0.1);
}
&.end {
background-color: rgba($flow-status-end-color, 0.1);
}
}
}
} }
} }

95
resources/assets/sass/pages/components/project-workflow.scss vendored
View File

@ -75,24 +75,24 @@
vertical-align: middle; vertical-align: middle;
overflow: hidden; overflow: hidden;
&.start { &.start {
background-color: rgba($flow-status-start-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-start-color, 0.1));
border-color: rgba($flow-status-start-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-start-color, 0.1));
color: $flow-status-start-color; color: var(--flow-item-custom-color-100, $flow-status-start-color);
} }
&.progress { &.progress {
background-color: rgba($flow-status-progress-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-progress-color, 0.1));
border-color: rgba($flow-status-progress-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-progress-color, 0.1));
color: $flow-status-progress-color; color: var(--flow-item-custom-color-100, $flow-status-progress-color);
} }
&.test { &.test {
background-color: rgba($flow-status-test-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-test-color, 0.1));
border-color: rgba($flow-status-test-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-test-color, 0.1));
color: $flow-status-test-color; color: var(--flow-item-custom-color-100, $flow-status-test-color);
} }
&.end { &.end {
background-color: rgba($flow-status-end-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-end-color, 0.1));
border-color: rgba($flow-status-end-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-end-color, 0.1));
color: $flow-status-end-color; color: var(--flow-item-custom-color-100, $flow-status-end-color);
} }
} }
} }
@ -337,74 +337,74 @@
} }
&.start { &.start {
border-color:rgba($flow-status-start-color, 0.2); border-color: var(--flow-item-custom-color-20, rgba($flow-status-start-color, 0.2));
&:hover { &:hover {
border-color: rgba($flow-status-start-color, 0.7); border-color: var(--flow-item-custom-color-70, rgba($flow-status-start-color, 0.7));
} }
.ivu-radio-checked .ivu-radio-inner { .ivu-radio-checked .ivu-radio-inner {
border-color: $flow-status-start-color; border-color: var(--flow-item-custom-color-100, $flow-status-start-color);
box-shadow: none; box-shadow: none;
} }
.ivu-radio-inner::after { .ivu-radio-inner::after {
background-color: $flow-status-start-color; background-color: var(--flow-item-custom-color-100, $flow-status-start-color);
} }
.ivu-checkbox-checked .ivu-checkbox-inner { .ivu-checkbox-checked .ivu-checkbox-inner {
border-color: $flow-status-start-color; border-color: var(--flow-item-custom-color-100, $flow-status-start-color);
background-color: $flow-status-start-color; background-color: var(--flow-item-custom-color-100, $flow-status-start-color);
} }
} }
&.progress { &.progress {
border-color: rgba($flow-status-progress-color, 0.2); border-color: var(--flow-item-custom-color-20, rgba($flow-status-progress-color, 0.2));
&:hover { &:hover {
border-color: rgba($flow-status-progress-color, 0.7); border-color: var(--flow-item-custom-color-70, rgba($flow-status-progress-color, 0.7));
} }
.ivu-radio-checked .ivu-radio-inner { .ivu-radio-checked .ivu-radio-inner {
border-color: $flow-status-progress-color; border-color: var(--flow-item-custom-color-100, $flow-status-progress-color);
box-shadow: none; box-shadow: none;
} }
.ivu-radio-inner::after { .ivu-radio-inner::after {
background-color: $flow-status-progress-color; background-color: var(--flow-item-custom-color-100, $flow-status-progress-color);
} }
.ivu-checkbox-checked .ivu-checkbox-inner { .ivu-checkbox-checked .ivu-checkbox-inner {
border-color: $flow-status-progress-color; border-color: var(--flow-item-custom-color-100, $flow-status-progress-color);
background-color: $flow-status-progress-color; background-color: var(--flow-item-custom-color-100, $flow-status-progress-color);
} }
} }
&.test { &.test {
border-color: rgba($flow-status-test-color, 0.2); border-color: var(--flow-item-custom-color-20, rgba($flow-status-test-color, 0.2));
&:hover { &:hover {
border-color: rgba($flow-status-test-color, 0.7); border-color: var(--flow-item-custom-color-70, rgba($flow-status-test-color, 0.7));
} }
.ivu-radio-checked .ivu-radio-inner { .ivu-radio-checked .ivu-radio-inner {
border-color: $flow-status-test-color; border-color: var(--flow-item-custom-color-100, $flow-status-test-color);
box-shadow: none; box-shadow: none;
} }
.ivu-radio-inner::after { .ivu-radio-inner::after {
background-color: $flow-status-test-color; background-color: var(--flow-item-custom-color-100, $flow-status-test-color);
} }
.ivu-checkbox-checked .ivu-checkbox-inner { .ivu-checkbox-checked .ivu-checkbox-inner {
border-color: $flow-status-test-color; border-color: var(--flow-item-custom-color-100, $flow-status-test-color);
background-color: $flow-status-test-color; background-color: var(--flow-item-custom-color-100, $flow-status-test-color);
} }
} }
&.end { &.end {
border-color: rgba($flow-status-end-color, 0.2); border-color: var(--flow-item-custom-color-20, rgba($flow-status-end-color, 0.2));
&:hover { &:hover {
border-color: rgba($flow-status-end-color, 0.7); border-color: var(--flow-item-custom-color-70, rgba($flow-status-end-color, 0.7));
} }
.ivu-radio-checked .ivu-radio-inner { .ivu-radio-checked .ivu-radio-inner {
border-color: $flow-status-end-color; border-color: var(--flow-item-custom-color-100, $flow-status-end-color);
box-shadow: none; box-shadow: none;
} }
.ivu-radio-inner::after { .ivu-radio-inner::after {
background-color: $flow-status-end-color; background-color: var(--flow-item-custom-color-100, $flow-status-end-color);
} }
.ivu-checkbox-checked .ivu-checkbox-inner { .ivu-checkbox-checked .ivu-checkbox-inner {
border-color: $flow-status-end-color; border-color: var(--flow-item-custom-color-100, $flow-status-end-color);
background-color: $flow-status-end-color; background-color: var(--flow-item-custom-color-100, $flow-status-end-color);
} }
} }
@ -445,20 +445,20 @@
} }
&.start { &.start {
background-color: rgba($flow-status-start-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-start-color, 0.1));
color: $flow-status-start-color; color: var(--flow-item-custom-color-100, $flow-status-start-color);
} }
&.progress { &.progress {
background-color: rgba($flow-status-progress-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-progress-color, 0.1));
color: $flow-status-progress-color; color: var(--flow-item-custom-color-100, $flow-status-progress-color);
} }
&.test { &.test {
background-color: rgba($flow-status-test-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-test-color, 0.1));
color: $flow-status-test-color; color: var(--flow-item-custom-color-100, $flow-status-test-color);
} }
&.end { &.end {
background-color: rgba($flow-status-end-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-end-color, 0.1));
color: $flow-status-end-color; color: var(--flow-item-custom-color-100, $flow-status-end-color);
} }
.name { .name {
@ -545,6 +545,13 @@
} }
} }
.taskflow-config-more-dropdown-menu { .taskflow-config-more-dropdown-menu {
.taskflow-config-more-dropdown-warp {
height: 400px;
min-height: 180px;
max-height: calc(100vh - 250px);
overflow-y: auto;
list-style: none;
}
.users { .users {
display: flex; display: flex;
padding: 6px 0; padding: 6px 0;

54
resources/assets/sass/pages/components/task-detail.scss vendored
View File

@ -129,29 +129,29 @@
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
&.archived { &.archived {
background-color: rgba($flow-status-archived-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-archived-color, 0.1));
border-color: rgba($flow-status-archived-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-archived-color, 0.1));
color: $flow-status-archived-color; color: var(--flow-item-custom-color-100, $flow-status-archived-color);
} }
&.start { &.start {
background-color: rgba($flow-status-start-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-start-color, 0.1));
border-color: rgba($flow-status-start-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-start-color, 0.1));
color: $flow-status-start-color; color: var(--flow-item-custom-color-100, $flow-status-start-color);
} }
&.progress { &.progress {
background-color: rgba($flow-status-progress-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-progress-color, 0.1));
border-color: rgba($flow-status-progress-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-progress-color, 0.1));
color: $flow-status-progress-color; color: var(--flow-item-custom-color-100, $flow-status-progress-color);
} }
&.test { &.test {
background-color: rgba($flow-status-test-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-test-color, 0.1));
border-color: rgba($flow-status-test-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-test-color, 0.1));
color: $flow-status-test-color; color: var(--flow-item-custom-color-100, $flow-status-test-color);
} }
&.end { &.end {
background-color: rgba($flow-status-end-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-end-color, 0.1));
border-color: rgba($flow-status-end-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-end-color, 0.1));
color: $flow-status-end-color; color: var(--flow-item-custom-color-100, $flow-status-end-color);
} }
} }
} }
@ -445,24 +445,24 @@
text-align: center; text-align: center;
cursor: pointer; cursor: pointer;
&.start { &.start {
background-color: rgba($flow-status-start-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-start-color, 0.1));
border-color: rgba($flow-status-start-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-start-color, 0.1));
color: $flow-status-start-color; color: var(--flow-item-custom-color-100, $flow-status-start-color);
} }
&.progress { &.progress {
background-color: rgba($flow-status-progress-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-progress-color, 0.1));
border-color: rgba($flow-status-progress-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-progress-color, 0.1));
color: $flow-status-progress-color; color: var(--flow-item-custom-color-100, $flow-status-progress-color);
} }
&.test { &.test {
background-color: rgba($flow-status-test-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-test-color, 0.1));
border-color: rgba($flow-status-test-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-test-color, 0.1));
color: $flow-status-test-color; color: var(--flow-item-custom-color-100, $flow-status-test-color);
} }
&.end { &.end {
background-color: rgba($flow-status-end-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-end-color, 0.1));
border-color: rgba($flow-status-end-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-end-color, 0.1));
color: $flow-status-end-color; color: var(--flow-item-custom-color-100, $flow-status-end-color);
} }
} }
} }

24
resources/assets/sass/pages/components/task-move.scss vendored
View File

@ -47,24 +47,24 @@
margin-top: 8px; margin-top: 8px;
text-align: center; text-align: center;
&.start { &.start {
background-color: rgba($flow-status-start-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-start-color, 0.1));
border-color: rgba($flow-status-start-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-start-color, 0.1));
color: $flow-status-start-color; color: var(--flow-item-custom-color-100, $flow-status-start-color);
} }
&.progress { &.progress {
background-color: rgba($flow-status-progress-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-progress-color, 0.1));
border-color: rgba($flow-status-progress-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-progress-color, 0.1));
color: $flow-status-progress-color; color: var(--flow-item-custom-color-100, $flow-status-progress-color);
} }
&.test { &.test {
background-color: rgba($flow-status-test-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-test-color, 0.1));
border-color: rgba($flow-status-test-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-test-color, 0.1));
color: $flow-status-test-color; color: var(--flow-item-custom-color-100, $flow-status-test-color);
} }
&.end { &.end {
background-color: rgba($flow-status-end-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-end-color, 0.1));
border-color: rgba($flow-status-end-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-end-color, 0.1));
color: $flow-status-end-color; color: var(--flow-item-custom-color-100, $flow-status-end-color);
} }
} }
} }

24
resources/assets/sass/pages/page-dashboard.scss vendored
View File

@ -279,24 +279,24 @@
margin-right: 3px; margin-right: 3px;
text-align: center; text-align: center;
&.start { &.start {
background-color: rgba($flow-status-start-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-start-color, 0.1));
border-color: rgba($flow-status-start-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-start-color, 0.1));
color: $flow-status-start-color; color: var(--flow-item-custom-color-100, $flow-status-start-color);
} }
&.progress { &.progress {
background-color: rgba($flow-status-progress-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-progress-color, 0.1));
border-color: rgba($flow-status-progress-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-progress-color, 0.1));
color: $flow-status-progress-color; color: var(--flow-item-custom-color-100, $flow-status-progress-color);
} }
&.test { &.test {
background-color: rgba($flow-status-test-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-test-color, 0.1));
border-color: rgba($flow-status-test-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-test-color, 0.1));
color: $flow-status-test-color; color: var(--flow-item-custom-color-100, $flow-status-test-color);
} }
&.end { &.end {
background-color: rgba($flow-status-end-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-end-color, 0.1));
border-color: rgba($flow-status-end-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-end-color, 0.1));
color: $flow-status-end-color; color: var(--flow-item-custom-color-100, $flow-status-end-color);
} }
} }
} }

24
resources/assets/sass/pages/page-manage.scss vendored
View File

@ -433,24 +433,24 @@
border: 1px solid $primary-color; border: 1px solid $primary-color;
margin-right: 6px; margin-right: 6px;
&.start { &.start {
background-color: rgba($flow-status-start-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-start-color, 0.1));
border-color: rgba($flow-status-start-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-start-color, 0.1));
color: $flow-status-start-color; color: var(--flow-item-custom-color-100, $flow-status-start-color);
} }
&.progress { &.progress {
background-color: rgba($flow-status-progress-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-progress-color, 0.1));
border-color: rgba($flow-status-progress-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-progress-color, 0.1));
color: $flow-status-progress-color; color: var(--flow-item-custom-color-100, $flow-status-progress-color);
} }
&.test { &.test {
background-color: rgba($flow-status-test-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-test-color, 0.1));
border-color: rgba($flow-status-test-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-test-color, 0.1));
color: $flow-status-test-color; color: var(--flow-item-custom-color-100, $flow-status-test-color);
} }
&.end { &.end {
background-color: rgba($flow-status-end-color, 0.1); background-color: var(--flow-item-custom-color-10, rgba($flow-status-end-color, 0.1));
border-color: rgba($flow-status-end-color, 0.1); border-color: var(--flow-item-custom-color-10, rgba($flow-status-end-color, 0.1));
color: $flow-status-end-color; color: var(--flow-item-custom-color-100, $flow-status-end-color);
} }
} }
.task-title-text { .task-title-text {