|
@@ -1,14 +1,12 @@
|
|
|
<template>
|
|
<template>
|
|
|
<div
|
|
<div
|
|
|
- class="iot-project-info-page grid grid-rows-[auto_minmax(360px,1fr)_auto] gap-4 h-[calc(100vh-20px-var(--top-tool-height)-var(--tags-view-height)-var(--app-footer-height))]"
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ class="iot-project-info-page grid grid-rows-[auto_minmax(360px,1fr)_auto] gap-4 h-[calc(100vh-20px-var(--top-tool-height)-var(--tags-view-height)-var(--app-footer-height))]">
|
|
|
<el-form
|
|
<el-form
|
|
|
ref="queryFormRef"
|
|
ref="queryFormRef"
|
|
|
:model="queryParams"
|
|
:model="queryParams"
|
|
|
size="default"
|
|
size="default"
|
|
|
label-width="72px"
|
|
label-width="72px"
|
|
|
- class="iot-project-info-query bg-white dark:bg-[#1d1e1f] rounded-lg shadow px-6 py-3 min-w-0"
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ class="iot-project-info-query bg-white dark:bg-[#1d1e1f] rounded-lg shadow px-6 py-3 min-w-0">
|
|
|
<div class="query-row">
|
|
<div class="query-row">
|
|
|
<el-form-item label="公司" prop="companyDeptId">
|
|
<el-form-item label="公司" prop="companyDeptId">
|
|
|
<el-select
|
|
<el-select
|
|
@@ -16,14 +14,12 @@
|
|
|
placeholder="请选择公司"
|
|
placeholder="请选择公司"
|
|
|
clearable
|
|
clearable
|
|
|
filterable
|
|
filterable
|
|
|
- class="query-control"
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ class="query-control">
|
|
|
<el-option
|
|
<el-option
|
|
|
v-for="item in companyDeptList"
|
|
v-for="item in companyDeptList"
|
|
|
:key="item.id"
|
|
:key="item.id"
|
|
|
:label="item.name"
|
|
:label="item.name"
|
|
|
- :value="item.id"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ :value="item.id" />
|
|
|
</el-select>
|
|
</el-select>
|
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
<el-form-item label="项目部" prop="projectDeptId">
|
|
<el-form-item label="项目部" prop="projectDeptId">
|
|
@@ -34,14 +30,12 @@
|
|
|
:loading="projectDeptLoading"
|
|
:loading="projectDeptLoading"
|
|
|
clearable
|
|
clearable
|
|
|
filterable
|
|
filterable
|
|
|
- class="query-control"
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ class="query-control">
|
|
|
<el-option
|
|
<el-option
|
|
|
v-for="item in projectDeptOptions"
|
|
v-for="item in projectDeptOptions"
|
|
|
:key="item.value"
|
|
:key="item.value"
|
|
|
:label="item.label"
|
|
:label="item.label"
|
|
|
- :value="item.value"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ :value="item.value" />
|
|
|
</el-select>
|
|
</el-select>
|
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
<el-form-item label="合同名称" prop="contractName">
|
|
<el-form-item label="合同名称" prop="contractName">
|
|
@@ -50,8 +44,7 @@
|
|
|
placeholder="请输入合同名称"
|
|
placeholder="请输入合同名称"
|
|
|
clearable
|
|
clearable
|
|
|
class="query-control"
|
|
class="query-control"
|
|
|
- @keyup.enter="handleQuery"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ @keyup.enter="handleQuery" />
|
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
<el-form-item label="合同编号" prop="contractCode">
|
|
<el-form-item label="合同编号" prop="contractCode">
|
|
|
<el-input
|
|
<el-input
|
|
@@ -59,8 +52,7 @@
|
|
|
placeholder="请输入合同编号"
|
|
placeholder="请输入合同编号"
|
|
|
clearable
|
|
clearable
|
|
|
class="query-control"
|
|
class="query-control"
|
|
|
- @keyup.enter="handleQuery"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ @keyup.enter="handleQuery" />
|
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
<el-form-item label="起止日期" prop="startTime">
|
|
<el-form-item label="起止日期" prop="startTime">
|
|
|
<el-date-picker
|
|
<el-date-picker
|
|
@@ -70,8 +62,7 @@
|
|
|
start-placeholder="开始日期"
|
|
start-placeholder="开始日期"
|
|
|
end-placeholder="结束日期"
|
|
end-placeholder="结束日期"
|
|
|
:default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
|
|
:default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
|
|
|
- class="query-control query-control--date"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ class="query-control query-control--date" />
|
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
<el-form-item class="query-actions">
|
|
<el-form-item class="query-actions">
|
|
|
<el-button type="primary" @click="handleQuery">
|
|
<el-button type="primary" @click="handleQuery">
|
|
@@ -82,8 +73,7 @@
|
|
|
type="primary"
|
|
type="primary"
|
|
|
plain
|
|
plain
|
|
|
@click="openForm('create', undefined)"
|
|
@click="openForm('create', undefined)"
|
|
|
- v-hasPermi="['rq:iot-project-info:create']"
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ v-hasPermi="['rq:iot-project-info:create']">
|
|
|
<Icon icon="ep:plus" class="mr-5px" />新增
|
|
<Icon icon="ep:plus" class="mr-5px" />新增
|
|
|
</el-button>
|
|
</el-button>
|
|
|
<el-button type="success" plain :loading="exportLoading" @click="handleExport">
|
|
<el-button type="success" plain :loading="exportLoading" @click="handleExport">
|
|
@@ -103,22 +93,19 @@
|
|
|
:width="width"
|
|
:width="width"
|
|
|
:height="height"
|
|
:height="height"
|
|
|
:max-height="height"
|
|
:max-height="height"
|
|
|
- show-border
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ show-border>
|
|
|
<ZmTableColumn
|
|
<ZmTableColumn
|
|
|
type="index"
|
|
type="index"
|
|
|
:label="t('monitor.serial')"
|
|
:label="t('monitor.serial')"
|
|
|
:width="70"
|
|
:width="70"
|
|
|
fixed="left"
|
|
fixed="left"
|
|
|
- hide-in-column-settings
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ hide-in-column-settings />
|
|
|
<ZmTableColumn
|
|
<ZmTableColumn
|
|
|
prop="manufactureName"
|
|
prop="manufactureName"
|
|
|
label="客户名称"
|
|
label="客户名称"
|
|
|
min-width="180"
|
|
min-width="180"
|
|
|
fixed="left"
|
|
fixed="left"
|
|
|
- align="left"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ align="left" />
|
|
|
<ZmTableColumn prop="contractName" label="合同名称" min-width="220" fixed="left">
|
|
<ZmTableColumn prop="contractName" label="合同名称" min-width="220" fixed="left">
|
|
|
<template #default="{ row }">
|
|
<template #default="{ row }">
|
|
|
<el-link type="primary" :underline="false" @click="showTaskList(row)">
|
|
<el-link type="primary" :underline="false" @click="showTaskList(row)">
|
|
@@ -153,24 +140,21 @@
|
|
|
link
|
|
link
|
|
|
type="primary"
|
|
type="primary"
|
|
|
@click="openForm('update', row.id)"
|
|
@click="openForm('update', row.id)"
|
|
|
- v-hasPermi="['rq:iot-project-info:update']"
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ v-hasPermi="['rq:iot-project-info:update']">
|
|
|
编辑
|
|
编辑
|
|
|
</el-button>
|
|
</el-button>
|
|
|
<el-button
|
|
<el-button
|
|
|
link
|
|
link
|
|
|
type="primary"
|
|
type="primary"
|
|
|
@click="assignTask(row)"
|
|
@click="assignTask(row)"
|
|
|
- v-hasPermi="['rq:iot-project-task:create']"
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ v-hasPermi="['rq:iot-project-task:create']">
|
|
|
分配任务
|
|
分配任务
|
|
|
</el-button>
|
|
</el-button>
|
|
|
<el-button
|
|
<el-button
|
|
|
link
|
|
link
|
|
|
type="danger"
|
|
type="danger"
|
|
|
@click="handleDelete(row.id)"
|
|
@click="handleDelete(row.id)"
|
|
|
- v-hasPermi="['rq:iot-project-info:delete']"
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ v-hasPermi="['rq:iot-project-info:delete']">
|
|
|
删除
|
|
删除
|
|
|
</el-button>
|
|
</el-button>
|
|
|
</template>
|
|
</template>
|
|
@@ -191,16 +175,14 @@
|
|
|
:total="total"
|
|
:total="total"
|
|
|
layout="total, sizes, prev, pager, next, jumper"
|
|
layout="total, sizes, prev, pager, next, jumper"
|
|
|
@size-change="handleSizeChange"
|
|
@size-change="handleSizeChange"
|
|
|
- @current-change="handleCurrentChange"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ @current-change="handleCurrentChange" />
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<div
|
|
<div
|
|
|
v-if="selectedProject"
|
|
v-if="selectedProject"
|
|
|
:style="{ height: taskListPanelHeight }"
|
|
:style="{ height: taskListPanelHeight }"
|
|
|
- class="bg-white dark:bg-[#1d1e1f] shadow rounded-lg flex flex-col p-4 min-w-0 min-h-0 task-list-panel"
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ class="bg-white dark:bg-[#1d1e1f] shadow rounded-lg flex flex-col p-4 min-w-0 min-h-0 task-list-panel">
|
|
|
<div class="card-header mb-3">
|
|
<div class="card-header mb-3">
|
|
|
<span class="font-600">任务列表 - {{ selectedProject.contractName }}</span>
|
|
<span class="font-600">任务列表 - {{ selectedProject.contractName }}</span>
|
|
|
<el-button link @click="closeTaskList" class="close-btn">
|
|
<el-button link @click="closeTaskList" class="close-btn">
|
|
@@ -216,15 +198,13 @@
|
|
|
:width="width"
|
|
:width="width"
|
|
|
:height="height"
|
|
:height="height"
|
|
|
:max-height="height"
|
|
:max-height="height"
|
|
|
- show-border
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ show-border>
|
|
|
<ZmTableColumn prop="wellName" label="井号" min-width="100" />
|
|
<ZmTableColumn prop="wellName" label="井号" min-width="100" />
|
|
|
<ZmTableColumn prop="status" :label="t('project.status')" min-width="120">
|
|
<ZmTableColumn prop="status" :label="t('project.status')" min-width="120">
|
|
|
<template #default="{ row }">
|
|
<template #default="{ row }">
|
|
|
<el-link type="primary" :underline="false" @click="openTimelineDialog(row)">
|
|
<el-link type="primary" :underline="false" @click="openTimelineDialog(row)">
|
|
|
<template
|
|
<template
|
|
|
- v-if="row.status !== null && row.status !== undefined && row.status !== ''"
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ v-if="row.status !== null && row.status !== undefined && row.status !== ''">
|
|
|
<dict-tag :type="getStatusDictType(row.deptId)" :value="row.status" />
|
|
<dict-tag :type="getStatusDictType(row.deptId)" :value="row.status" />
|
|
|
</template>
|
|
</template>
|
|
|
<template v-else>未更新状态</template>
|
|
<template v-else>未更新状态</template>
|
|
@@ -265,8 +245,7 @@
|
|
|
<template #default="{ row }">
|
|
<template #default="{ row }">
|
|
|
<el-tooltip
|
|
<el-tooltip
|
|
|
:content="getAllResponsiblePersonNames(row.responsiblePerson)"
|
|
:content="getAllResponsiblePersonNames(row.responsiblePerson)"
|
|
|
- placement="top"
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ placement="top">
|
|
|
<span class="responsible-names">
|
|
<span class="responsible-names">
|
|
|
{{ getResponsiblePersonNames(row.responsiblePerson) }}
|
|
{{ getResponsiblePersonNames(row.responsiblePerson) }}
|
|
|
</span>
|
|
</span>
|
|
@@ -284,8 +263,7 @@
|
|
|
<el-dialog
|
|
<el-dialog
|
|
|
v-model="timelineDialogVisible"
|
|
v-model="timelineDialogVisible"
|
|
|
:title="`任务进度 - ${currentTaskRow ? currentTaskRow.wellName : ''}`"
|
|
:title="`任务进度 - ${currentTaskRow ? currentTaskRow.wellName : ''}`"
|
|
|
- :width="dialogWidth"
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ :width="dialogWidth">
|
|
|
<div class="progress-container">
|
|
<div class="progress-container">
|
|
|
<!-- 计划进度 -->
|
|
<!-- 计划进度 -->
|
|
|
<!-- <div class="progress-section">
|
|
<!-- <div class="progress-section">
|
|
@@ -311,15 +289,13 @@
|
|
|
<el-steps
|
|
<el-steps
|
|
|
direction="horizontal"
|
|
direction="horizontal"
|
|
|
:active="actualStepsData.length - 1"
|
|
:active="actualStepsData.length - 1"
|
|
|
- finish-status="success"
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ finish-status="success">
|
|
|
<el-step
|
|
<el-step
|
|
|
v-for="(step, index) in actualStepsData"
|
|
v-for="(step, index) in actualStepsData"
|
|
|
:key="index"
|
|
:key="index"
|
|
|
:title="step.title"
|
|
:title="step.title"
|
|
|
:description="step.description"
|
|
:description="step.description"
|
|
|
- :status="step.status"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ :status="step.status" />
|
|
|
</el-steps>
|
|
</el-steps>
|
|
|
</div>
|
|
</div>
|
|
|
<el-empty v-else description="暂无实际进度数据" :image-size="80" />
|
|
<el-empty v-else description="暂无实际进度数据" :image-size="80" />
|
|
@@ -920,13 +896,74 @@ watch(
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
|
|
<style scoped>
|
|
<style scoped>
|
|
|
|
|
+@media (width <= 1500px) {
|
|
|
|
|
+ .iot-project-info-query .query-row {
|
|
|
|
|
+ gap: 12px 18px;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .iot-project-info-query .query-control {
|
|
|
|
|
+ width: 210px;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .iot-project-info-query .query-control--date {
|
|
|
|
|
+ width: 280px;
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+@media (width <= 1200px) {
|
|
|
|
|
+ .iot-project-info-page {
|
|
|
|
|
+ grid-template-rows: auto minmax(480px, 1fr) auto;
|
|
|
|
|
+ height: auto;
|
|
|
|
|
+ min-height: calc(
|
|
|
|
|
+ 100vh - 20px - var(--top-tool-height) - var(--tags-view-height) - var(--app-footer-height)
|
|
|
|
|
+ );
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .iot-project-info-query .query-actions {
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .iot-project-info-query .query-actions :deep(.el-form-item__content) {
|
|
|
|
|
+ justify-content: flex-start;
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+@media (width <= 768px) {
|
|
|
|
|
+ .iot-project-info-query {
|
|
|
|
|
+ padding: 12px;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .iot-project-info-query .query-row,
|
|
|
|
|
+ .iot-project-info-query .query-row :deep(.el-form-item),
|
|
|
|
|
+ .iot-project-info-query .query-actions {
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .iot-project-info-query .query-control,
|
|
|
|
|
+ .iot-project-info-query .query-control--date {
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .iot-project-info-query .query-actions :deep(.el-form-item__content) {
|
|
|
|
|
+ display: grid;
|
|
|
|
|
+ grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
|
|
|
+ gap: 8px;
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .iot-project-info-query .query-actions :deep(.el-button) {
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ margin-left: 0;
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
.iot-project-info-query {
|
|
.iot-project-info-query {
|
|
|
display: block;
|
|
display: block;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.query-row {
|
|
.query-row {
|
|
|
display: flex;
|
|
display: flex;
|
|
|
- flex-wrap: nowrap;
|
|
|
|
|
|
|
+ flex-wrap: wrap;
|
|
|
align-items: center;
|
|
align-items: center;
|
|
|
gap: 12px 24px;
|
|
gap: 12px 24px;
|
|
|
min-width: 0;
|
|
min-width: 0;
|
|
@@ -1082,75 +1119,4 @@ watch(
|
|
|
font-size: 14px;
|
|
font-size: 14px;
|
|
|
color: #909399;
|
|
color: #909399;
|
|
|
}
|
|
}
|
|
|
-
|
|
|
|
|
-@media (width <= 1800px) {
|
|
|
|
|
- .query-row {
|
|
|
|
|
- flex-wrap: wrap;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .query-actions {
|
|
|
|
|
- margin-left: 0;
|
|
|
|
|
- }
|
|
|
|
|
-}
|
|
|
|
|
-
|
|
|
|
|
-@media (width <= 1500px) {
|
|
|
|
|
- .query-row {
|
|
|
|
|
- gap: 12px 18px;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .query-control {
|
|
|
|
|
- width: 210px;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .query-control--date {
|
|
|
|
|
- width: 280px;
|
|
|
|
|
- }
|
|
|
|
|
-}
|
|
|
|
|
-
|
|
|
|
|
-@media (width <= 1200px) {
|
|
|
|
|
- .iot-project-info-page {
|
|
|
|
|
- grid-template-rows: auto minmax(480px, 1fr) auto;
|
|
|
|
|
- height: auto;
|
|
|
|
|
- min-height: calc(
|
|
|
|
|
- 100vh - 20px - var(--top-tool-height) - var(--tags-view-height) - var(--app-footer-height)
|
|
|
|
|
- );
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .query-actions {
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .query-actions :deep(.el-form-item__content) {
|
|
|
|
|
- justify-content: flex-start;
|
|
|
|
|
- }
|
|
|
|
|
-}
|
|
|
|
|
-
|
|
|
|
|
-@media (width <= 768px) {
|
|
|
|
|
- .iot-project-info-query {
|
|
|
|
|
- padding: 12px;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .query-row,
|
|
|
|
|
- .query-row :deep(.el-form-item),
|
|
|
|
|
- .query-actions {
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .query-control,
|
|
|
|
|
- .query-control--date {
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .query-actions :deep(.el-form-item__content) {
|
|
|
|
|
- display: grid;
|
|
|
|
|
- grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
|
|
|
- gap: 8px;
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .query-actions :deep(.el-button) {
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- margin-left: 0;
|
|
|
|
|
- }
|
|
|
|
|
-}
|
|
|
|
|
</style>
|
|
</style>
|