Compare commits

..

2 Commits

11 changed files with 543 additions and 130 deletions

View File

@ -376,6 +376,10 @@ const getDetailData = async (row) => {
// 打开新增设备弹窗
const openAddEquipmentModel = () => {
if (!selectedYHZData.value) {
ElMessage.error('请先选择养护站');
return;
}
model.title = `新增设备`;
model.content = AddDialog;
const extraData = {

View File

@ -50,7 +50,6 @@
<div class="form-box">
<div class="event-box">
<el-button
v-if="selectedYHZData"
type="primary"
size="large"
@click="script.openAddEquipmentModel"

View File

@ -8,7 +8,7 @@
detailData.material?.wzmc
}}</el-descriptions-item>
<el-descriptions-item label="余量: ">{{
detailData.material?.ye + ' ' + detailData.material?.dw
detailData.material?.ye + " " + detailData.material?.dw
}}</el-descriptions-item>
<el-descriptions-item label="所属服务站: ">{{
detailData.material?.yhzMc
@ -20,6 +20,7 @@
</el-col>
<el-col :span="12" style="position: relative">
<el-image
v-if="detailData.photos?.length > 0"
style="
max-width: 180px;
max-height: 180px;
@ -34,6 +35,9 @@
show-progresss
fit="cover"
/>
<div v-else class="no-photo">
<span>暂无图片</span>
</div>
</el-col>
</el-row>
</el-card>
@ -81,4 +85,15 @@ const props = defineProps({
flex-direction: column;
gap: 30px;
}
.no-photo {
width: 180px;
height: 180px;
display: flex;
justify-content: center;
align-items: center;
position: absolute;
right: 0;
font-size: 14px;
background-color: #f5f5f5;
}
</style>

View File

@ -376,6 +376,10 @@ const getDetailData = async (row) => {
// 打开新增物资弹窗
const openAddModel = () => {
if(!yhzid.value){
ElMessage.error('请先选择养护站');
return;
}
model.title = `新增物资`;
model.content = AddDialog;
resetForm(); // 重置表单

View File

@ -28,7 +28,7 @@
</div>
<div class="form-box">
<div class="event-box">
<el-button v-if="script.yhzid.value" type="primary" size="large" @click="script.openAddModel"
<el-button type="primary" size="large" @click="script.openAddModel"
>新增物资</el-button
>
<el-button type="info" size="large" @click="script.handelExport"

View File

@ -0,0 +1,75 @@
<template>
<div class="detail-container">
<el-form
ref="formRef"
label-position="right"
label-width="150px"
style="max-height: 60vh; overflow-y: auto; padding-right: 50px"
>
<el-form-item label="所属服务站:">
<span>{{ basicData.mc }}</span>
</el-form-item>
<el-form-item label="物资名称:">
<el-input
maxlength="20"
show-word-limit
v-model="form.material.wzmc"
></el-input>
</el-form-item>
<el-form-item label="数量与单位:">
<el-row :gutter="20">
<el-col :span="16">
<el-input
v-model="form.material.sl"
type="number"
placeholder="请输入数量"
></el-input>
</el-col>
<el-col :span="8">
<el-select
v-model="form.material.dw"
filterable
allow-create
clearable
placeholder="选择单位"
>
<el-option label="个" value="个"></el-option>
<el-option label="包" value="包"></el-option>
<el-option label="盒" value="盒"></el-option>
<el-option label="桶" value="桶"></el-option>
<el-option label="箱" value="箱"></el-option>
<el-option label="袋" value="袋"></el-option>
</el-select>
</el-col>
</el-row>
</el-form-item>
<el-form-item label="设备经度:">
<span>{{ form.material.jd }}</span>
</el-form-item>
<el-form-item label="设备纬度:">
<span>{{ form.material.wd }}</span>
</el-form-item>
</el-form>
</div>
</template>
<script setup>
import { ref } from "vue";
const formRef = ref(null);
defineExpose({ formRef });
const props = defineProps({
form: {
type: Object,
default: () => ({}),
},
basicData:{
type: Object,
default: () => ({})
}
});
</script>
<style>
</style>

View File

@ -6,7 +6,7 @@
label-width="150px"
style="max-height: 60vh; overflow-y: auto; padding-right: 50px"
>
<el-form-item label=":">
<el-form-item label="负责人:">
<el-select
v-model="ryxx"
filterable
@ -26,26 +26,23 @@
/>
</el-select>
</el-form-item>
<el-form-item label="岗位:">
<el-input v-model="form.gw" />
</el-form-item>
<el-form-item label="养护站:">
<el-input disabled v-model="yhzdata.mc" />
</el-form-item>
<el-form-item label="人员角色:">
<el-select v-model="form.ryjs" placeholder="请选择人员角色">
<el-option label="负责人" value="1"></el-option>
<el-option label="普通工作人员" value="2"></el-option>
<el-form-item label="负责人添加经纬度:">
<el-select v-model="form.sfjwd">
<el-option label="是" value="是"></el-option>
<el-option label="否" value="否"></el-option>
</el-select>
</el-form-item>
<el-form-item label="站点经纬度:">
<el-input v-model="form.jwd" />
</el-form-item>
</el-form>
</div>
</template>
<script setup>
import { ref, onMounted, watch } from "vue";
import { request } from "@/utils/request";
const formRef = ref(null);
defineExpose({ formRef });
@ -54,19 +51,37 @@ const props = defineProps({
type: Object,
default: () => ({}),
},
getUserList: {
type: Function,
default: () => () => {},
},
yhzdata: {
type: Object,
default: () => ({}),
},
});
const ryxx = ref("");
const loading = ref(false);
const selectOptions = ref([]);
//
const getUserList = async (key) => {
try {
const keyword = key;
let url = "";
if (keyword) {
url = `/snow-ops-platform/yhzry/getUserByKey?key=${keyword}`;
} else {
url = `/snow-ops-platform/yhzry/getUserByKey?key=`;
}
const res = await request({
url: url,
method: "GET",
});
if (res.code === "00000") {
return res.data;
} else {
throw new Error(res.message);
}
} catch (error) {
ElMessage.error(error.message);
console.log(error);
}
};
//
const remoteMethod = async (query) => {
if (query === "") {
@ -74,7 +89,7 @@ const remoteMethod = async (query) => {
return [];
}
loading.value = true;
const res = await props.getUserList(query);
const res = await getUserList(query);
if (res) {
selectOptions.value = res;
}

View File

@ -1,37 +0,0 @@
<template>
<div class="detail-container">
<el-form
label-position="right"
label-width="150px"
style="max-height: 60vh; overflow-y: auto; padding-right: 50px"
>
<el-form-item label="人员名称:">
<el-input disabled v-model="detailData.xm" />
</el-form-item>
<el-form-item label="岗位:">
<el-input disabled v-model="detailData.gw" />
</el-form-item>
<el-form-item label="手机号码:">
<el-input disabled v-model="detailData.sjhm" />
</el-form-item>
<el-form-item label="人员角色:">
<el-input disabled :value="detailData.ryjs === 1 ? '管理员' : '普通用户'" />
</el-form-item>
<el-form-item label="创建时间:">
<el-input disabled v-model="detailData.cjsj" />
</el-form-item>
</el-form>
</div>
</template>
<script setup>
const props = defineProps({
detailData: {
type: Object,
default: () => ({}),
},
});
</script>
<style>
</style>

View File

@ -1,45 +0,0 @@
<template>
<div class="detail-container">
<el-form
ref="formRef"
label-position="right"
label-width="150px"
style="max-height: 60vh; overflow-y: auto; padding-right: 50px"
>
<el-form-item label="人员名称:">
<el-input disabled v-model="form.xm" />
</el-form-item>
<el-form-item label="岗位:">
<el-input v-model="form.gw" />
</el-form-item>
<el-form-item label="手机号码:">
<el-input disabled v-model="form.sjhm" />
</el-form-item>
<el-form-item label="人员角色:" prop="ryjs">
<el-select v-model="form.ryjs" placeholder="请选择角色">
<el-option label="负责人" :value="1" />
<el-option label="普通工作人员" :value="2" />
</el-select>
</el-form-item>
<el-form-item label="创建时间:">
<el-input disabled v-model="form.cjsj" />
</el-form-item>
</el-form>
</div>
</template>
<script setup>
import { ref } from "vue";
const formRef = ref(null);
defineExpose({ formRef });
const props = defineProps({
form: {
type: Object,
default: () => ({}),
},
});
</script>
<style>
</style>

View File

@ -2,34 +2,83 @@
<div class="detail-container">
<el-card shadow="hover">
<el-descriptions title="基础信息" :column="3">
<el-descriptions-item label="服务站名称">{{
<el-descriptions-item label="服务站名称:">{{
basicData.mc
}}</el-descriptions-item>
<el-descriptions-item label="服务站经度">{{
<el-descriptions-item label="服务站经度:">{{
basicData.jd
}}</el-descriptions-item>
<el-descriptions-item label="服务站纬度">{{
<el-descriptions-item label="服务站纬度:">{{
basicData.wd
}}</el-descriptions-item>
<el-descriptions-item label="设备数">{{}}</el-descriptions-item>
<el-descriptions-item label="物资数">{{}}</el-descriptions-item>
<el-descriptions-item label="人员数">{{}}</el-descriptions-item>
<el-descriptions-item label="创建日期">{{}}</el-descriptions-item>
<el-descriptions-item label="设备数:">{{
basicData.sbsl
}}</el-descriptions-item>
<el-descriptions-item label="物资数:">{{
basicData.wzsl
}}</el-descriptions-item>
<el-descriptions-item label="人员数:">{{
basicData.rysl
}}</el-descriptions-item>
<el-descriptions-item label="创建日期:">{{
basicData.createTime
}}</el-descriptions-item>
</el-descriptions>
</el-card>
<el-card shadow="hover">
<el-descriptions title="配置信息" :column="3"> </el-descriptions>
<el-tabs v-model="activeTab" class="demo-tabs" @tab-click="handleClick">
<el-tab-pane label="人员信息" name="people">人员信息</el-tab-pane>
<el-tab-pane label="物资信息" name="second">物资信息</el-tab-pane>
<el-tab-pane label="设备信息" name="third">设备信息</el-tab-pane>
<div class="button-container">
<el-button type="primary" @click="handleAdd">新增</el-button>
</div>
<el-tab-pane label="人员信息" name="people">
<DynamicTable
:dataSource="peopleList"
:columns="columns()"
:autoHeight="true"
:pagination="pagination"
></DynamicTable>
</el-tab-pane>
<el-tab-pane label="物资信息" name="material">
<DynamicTable
:dataSource="materialList"
:columns="columns()"
:autoHeight="true"
:pagination="pagination"
></DynamicTable>
</el-tab-pane>
<el-tab-pane label="设备信息" name="equipment">
<DynamicTable
:dataSource="equipmentList"
:columns="columns()"
:autoHeight="true"
:pagination="pagination"
></DynamicTable>
</el-tab-pane>
</el-tabs>
</el-card>
<MyDialog
v-model="modelVisible"
:title="model?.title"
:dynamicComponent="model?.content"
:component-props="model?.props"
:onConfirm="model?.onConfirm"
:onCancel="model?.onCancel"
ref="dialogRef"
:width="model?.width"
>
</MyDialog>
</div>
</template>
<script setup>
import { h, ref, onMounted, reactive, watch, toRaw, nextTick } from "vue";
import DynamicTable from "../../component/DynamicTable";
import MyDialog from "../../component/MyDialog";
import { request } from "@/utils/request";
import { render } from "less";
import PersonAddDialog from "./component/PersonAddDialog.vue";
import MaterialAddDialog from "./component/MaterialAddDialog.vue";
const props = defineProps({
basicData: {
type: Object,
@ -37,9 +86,349 @@ const props = defineProps({
},
});
const pagination = reactive({
current: 1,
pageSize: 10,
total: 0,
pageSizes: [10, 20, 50],
layout: "prev, pager, next, jumper",
onChange: (page, pageSize) => {
pagination.current = page;
pagination.pageSize = pageSize;
if (activeTab.value === "people") {
getPeopleList();
}
},
}); //
const columns = () => {
switch (activeTab.value) {
case "people":
return [
{
width: "100px",
label: "序号",
render: (...args) => {
return () => {
const actualIndex =
(pagination.current - 1) * pagination.pageSize + args[2] + 1;
return h("div", {}, actualIndex);
};
},
},
{
prop: "xm",
label: "姓名",
},
{
prop: "sjhm",
label: "手机号",
},
{
label: "人员角色",
render: (row) => () => {
const role = Number(row.ryjs);
const config = {
1: { type: "danger", text: "负责人" },
2: { type: "success", text: "普通工作人员" },
}[role] || { type: "info", text: "未知角色" };
return h(
ElTag,
{
type: config.type,
style: { margin: "2px" },
},
() => config.text
);
},
},
];
case "material":
return [
{
width: "100px",
label: "序号",
render: (...args) => {
return () => {
const actualIndex =
(pagination.current - 1) * pagination.pageSize + args[2] + 1;
return h("div", {}, actualIndex);
};
},
},
{
prop: "wzmc",
label: "物资名称",
},
{
prop: "ye",
label: "余量",
render: (row) => () => {
return h("span", {}, row.ye + " " + row.dw);
},
},
{
prop: "fzr",
label: "负责人",
},
{
prop: "rkrq",
label: "入库日期",
render: (row) => () => {
return h("span", row.rkrq?.substring(0, 10));
},
},
];
case "equipment":
return [
{
width: "100px",
label: "序号",
render: (...args) => {
return () => {
const actualIndex =
(pagination.current - 1) * pagination.pageSize + args[2] + 1;
return h("div", {}, actualIndex);
};
},
},
{
prop: "sbmc",
label: "设备名称",
},
{
prop: "sbxh",
label: "设备型号",
},
{
prop: "sbbh",
label: "设备编号",
},
{
prop: "sbdl",
label: "设备大类",
},
{
prop: "sblx",
label: "设备类型",
},
{
prop: "gzrq",
label: "购置日期",
render: (row) => () => {
return h("span", row.gzrq?.substring(0, 10));
},
},
];
}
};
onMounted(() => {
getPeopleList();
});
const peopleList = ref([]); //
const materialList = ref([]); //
const equipmentList = ref([]); //
const activeTab = ref("people");
//
const getPeopleList = async () => {
try {
const data = {
pageNum: pagination.current,
pageSize: pagination.pageSize,
yhzid: Number(props.basicData.id),
};
const res = await request({
url: "/snow-ops-platform/yhzry/list",
method: "get",
params: data,
});
if (res.code === "00000") {
pagination.total = res.data.total;
peopleList.value = res.data.records;
} else {
throw new Error(res.message);
}
} catch (error) {
console.log(error);
ElMessage.error(error.message);
}
};
//
const getMaterialList = async () => {
try {
const data = {
pageNum: pagination.current,
pageSize: pagination.pageSize,
yhzid: Number(props.basicData.id),
};
const res = await request({
url: "/snow-ops-platform/yjwz/list",
method: "get",
params: data,
});
if (res.code === "00000") {
pagination.total = res.data.total;
materialList.value = res.data.records;
} else {
throw new Error(res.message);
}
} catch (error) {
console.log(error);
ElMessage.error(error.message);
}
};
//
const getEquipmentList = async () => {
try {
const data = {
pageNum: pagination.current,
pageSize: pagination.pageSize,
yhzid: Number(props.basicData.id),
};
const res = await request({
url: "/snow-ops-platform/yjsb/list",
method: "get",
params: data,
});
if (res.code === "00000") {
pagination.total = res.data.total;
equipmentList.value = res.data.records;
} else {
throw new Error(res.message);
}
} catch (error) {
console.log(error);
ElMessage.error(error.message);
}
};
const handleClick = (tab, event) => {
console.log("tab", tab, "event", event);
pagination.current = 1;
switch (tab.props.name) {
case "people":
getPeopleList();
break;
case "material":
getMaterialList();
break;
case "equipment":
getEquipmentList();
break;
}
};
//
const peopleForm = reactive({});
const INIT_FORM_people = {
userId: "",
ryjs: 1,
yhzid: props.basicData.id,
sjhm: "",
xm: "",
sfjwd: "",
jwd: "",
};
const materialForm = reactive({});
const INIT_FORM_material = {
material: {
rkrq: "",
rkdw: "",
sl: "",
dw: "",
cfdd: "",
fzr: "",
lxdh: "",
ye: "",
qxmc: "",
wzmc: "",
fzrid: "",
yhzid: "",
jd: "",
wd: "",
},
photos: [],
};
const equipmentForm = reactive({});
const modelVisible = ref(false);
const model = reactive({
title: "",
content: null,
props: {},
onConfirm: () => {},
onCancel: () => {},
width: "30%",
});
const handleAdd = () => {
switch (activeTab.value) {
case "people":
model.title = "新增人员";
model.content = PersonAddDialog;
peopleForm.value = { ...INIT_FORM_people };
model.props = {
form: peopleForm.value,
};
model.onConfirm = handleAddPeopleConfirm;
model.onCancel = handleCancel;
model.width = "30%";
modelVisible.value = true;
break;
case "material":
model.title = "新增物资";
model.content = MaterialAddDialog;
//
materialForm.material = { ...INIT_FORM_material.material };
materialForm.photos = [...INIT_FORM_material.photos];
materialForm.material.yhzid = props.basicData.id;
materialForm.material.jd = props.basicData.jd;
materialForm.material.wd = props.basicData.wd;
model.props = {
form: materialForm,
basicData: props.basicData,
};
model.onConfirm = handleAddMaterialConfirm;
model.onCancel = handleCancel;
model.width = "40%";
modelVisible.value = true;
break;
}
};
//
const handleAddPeopleConfirm = async () => {
try {
const res = await request({
url: "/snow-ops-platform/yhzry/add",
method: "post",
data: toRaw(peopleForm.value),
});
if (res.code === "00000") {
ElMessage.success("新增成功");
modelVisible.value = false;
getPeopleList();
} else {
throw new Error(res.message);
}
} catch (error) {
console.log(error);
ElMessage.error(error.message);
}
};
//
const handleAddMaterialConfirm = async () => {
console.log('materialForm',toRaw(materialForm));
};
//
const handleCancel = () => {
modelVisible.value = false;
};
</script>
@ -49,4 +438,10 @@ const handleClick = (tab, event) => {
flex-direction: column;
gap: 30px;
}
.button-container {
width: 100%;
display: flex;
justify-content: flex-end;
margin: 10px 0px 10px 0px;
}
</style>

View File

@ -181,18 +181,6 @@ export default () => {
},
() => "详情"
),
h(
ElButton,
{
type: "success",
link: true,
style: "margin-left: 10px;",
onClick: async () => {
},
},
() => "编辑"
),
h(
ElButton,
{