项目信息总览页面开发

This commit is contained in:
shichengtian 2023-07-02 16:08:42 +08:00
parent 9011fca83d
commit 583ba12e22
7 changed files with 49 additions and 39 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 153 KiB

View File

@ -188,7 +188,7 @@ const init = () => {
},
data: [
{
value: 40
value: 86.2
}
]
},

View File

@ -12,7 +12,10 @@ const props = defineProps<{
projectData: Object;
}>();
const setProjectData = async () => {
addMarker();
console.log("setProjectData");
if (AMapRef.value) {
addMarker();
}
};
watch(() => props.projectData, setProjectData, { deep: true });
@ -80,8 +83,10 @@ const addMarker = () => {
// });
};
onMounted(async () => {
console.log("onMounted");
await mapData();
createArea();
addMarker();
});
</script>
<style scoped lang="scss">

View File

@ -3,7 +3,7 @@
<div class="numContent">
<div class="item">
<span class="name">项目总天数</span>
<div class="numBox">{{ $props.projectData.totalDay }}</div>
<div class="numBox">{{ props.projectData.totalDay }}</div>
<span class="unit"></span>
</div>
<div class="item">

View File

@ -50,8 +50,8 @@ let option = {
]
};
let myChart = null;
const setChartData = (newValue, oldValue) => {
console.log("图表数据变化", props.total, props.chartData);
const setChartData = () => {
// console.log("", props.total, props.chartData);
option.series[0].data = props.chartData;
option.title.text = props.total;
init();

View File

@ -8,14 +8,14 @@
<div class="item">
<img src="@/assets/images/hzImg/xm/xmmc.png" alt="" />
<div>
<div class="name">xxx</div>
<div class="name">{{ props.projectData.project_name }}</div>
<div>项目名称</div>
</div>
</div>
<div class="item">
<img src="@/assets/images/hzImg/xm/htje.png" alt="" />
<div>
<div class="name">xxx</div>
<div class="name">8,000,000.00</div>
<div>合同金额</div>
</div>
</div>
@ -24,61 +24,61 @@
<div class="item">
<div class="itemInner">
<span class="label">项目编号</span>
<span>xxx</span>
<span>{{ props.projectData.project_number || "-" }}</span>
</div>
<div class="itemInner">
<span class="label">项目负责人</span>
<span>xxx</span>
<span>{{ props.projectData.project_manage || "-" }}</span>
</div>
</div>
<div class="item">
<div class="itemInner">
<span class="label">项目地点</span>
<span>xxx</span>
<span class="address">{{ props.projectData.project_address || "-" }}</span>
</div>
<div class="itemInner">
<span class="label">项目类型</span>
<span>xxx</span>
<span>-</span>
</div>
</div>
<div class="item">
<div class="itemInner">
<span class="label">合同金额</span>
<span>xxx</span>
<span>8,000,000.00</span>
</div>
<div class="itemInner">
<span class="label">起止时间</span>
<span>xxx</span>
<span>{{ props.projectData.start_work_date || "-" }}</span>
</div>
</div>
<div class="item">
<div class="itemInner">
<span class="label">设计单位</span>
<span>xxx</span>
<span>-</span>
</div>
<div class="itemInner">
<span class="label">联系人</span>
<span>xxx</span>
<span>-</span>
</div>
</div>
<div class="item">
<div class="itemInner">
<span class="label">承建单位</span>
<span>xxx</span>
<span>-</span>
</div>
<div class="itemInner">
<span class="label">联系人</span>
<span>xxx</span>
<span>-</span>
</div>
</div>
<div class="item">
<div class="itemInner">
<span class="label">监理单位</span>
<span>xxx</span>
<span>-</span>
</div>
<div class="itemInner">
<span class="label">联系人</span>
<span>xxx</span>
<span>-</span>
</div>
</div>
</div>
@ -93,13 +93,13 @@
</div>
</div>
</div>
<div class="intro">xxx</div>
<div class="intro">-</div>
<div class="fieList">
<img src="@/assets/images/hzImg/xm/icon-left.png" alt="" class="icon-left" />
<div class="fileBox">
<div class="item" v-for="item in 9" :key="index">
<div class="item" v-for="item in 9" :key="item">
<img src="@/assets/images/hzImg/xm/pdf.png" alt="" class="icon-left" />
<div class="name">xxx</div>
<div class="name">-</div>
</div>
</div>
<img src="@/assets/images/hzImg/xm/icon-right.png" alt="" class="icon-right" />
@ -110,14 +110,9 @@
</template>
<script setup lang="tsx" name="pieChart">
import { ref, onMounted } from "vue";
// const chartDom = ref();
// const props = defineProps<{
// colorArr: Array<string>;
// chartData?: {
// name: string;
// value: Number;
// };
// }>();
const props = defineProps<{
projectData: Object;
}>();
onMounted(() => {
// init();
@ -204,6 +199,14 @@ const closeFn = () => {
border-right: 1px solid #1e3758;
}
}
.address {
display: inline-block;
width: 150px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
vertical-align: top;
}
}
}
.intro {

View File

@ -9,7 +9,7 @@
<projectInfo @projectData="getProjectData"></projectInfo>
</div>
</div>
<projectInfoDialog v-show="projectDialog" @close="closeProjectDialog"></projectInfoDialog>
<projectInfoDialog v-show="projectDialog" @close="closeProjectDialog" :projectData="projectData"></projectInfoDialog>
<div class="blockBox">
<div class="blockTitle">
<img src="@/assets/images/hzImg/xm/zfgl.png" alt="" class="title" />
@ -22,22 +22,22 @@
<div class="item">
<i class="rect"></i>
<span class="name">请款金额</span>
<span>0</span>
<span>607.5</span>
</div>
<div class="item">
<i class="rect"></i>
<span class="name">变更金额</span>
<span>0</span>
<span>7.5</span>
</div>
<div class="item">
<i class="color1 rect"></i>
<span class="name">审批支付</span>
<span>0</span>
<span>600</span>
</div>
<div class="item">
<i class="color2 rect"></i>
<span class="name">实际支付</span>
<span>0</span>
<span>582</span>
</div>
</div>
</div>
@ -46,7 +46,9 @@
<div class="blockTitle">
<img src="@/assets/images/hzImg/xm/gdxcsp.png" alt="" class="title" />
</div>
<div class="blockContent" style="height: 236px"></div>
<div class="blockContent" style="height: 236px">
<img src="@/assets/images/hzImg/xm/video.png" alt="" width="100%" height="100%" />
</div>
</div>
</div>
<div class="centerBox">
@ -160,15 +162,15 @@ const closeProjectDialog = () => {
// --- end
// --- start
const payRatio = ref("0%");
const payRatio = ref("97%");
let payData = ref([
{
name: "审批支付",
value: 0
value: 600
},
{
name: "实际支付",
value: 0
value: 582
}
]);
// --- end