Files
x_admin/x_admin_app/pages/monitor_project/edit.vue
2024-06-07 19:34:07 +08:00

110 lines
2.4 KiB
Vue

<template>
<view class="page-content">
<uv-form labelPosition="left" labelWidth="80" :model="form" :rules="formRules" ref="formRef">
<uv-form-item label="项目uuid" prop="projectKey" borderBottom>
<uv-input v-model="form.projectKey" border="surround"></uv-input>
</uv-form-item>
<uv-form-item label="项目名称" prop="projectName" borderBottom>
<uv-input v-model="form.projectName" border="surround"></uv-input>
</uv-form-item>
<uv-form-item label="项目类型" prop="projectType" borderBottom>
<x-picker v-model="form.projectType" valueKey="value" labelKey="name"
:columns="dictData.project_type"></x-picker>
</uv-form-item>
<uv-button type="primary" text="提交" customStyle="margin-top: 20rpx" @click="submit"></uv-button>
</uv-form>
</view>
</template>
<script setup lang="ts">
import {
reactive,
ref,
computed
} from "vue";
import {
onLoad
} from "@dcloudio/uni-app";
import {
monitor_project_detail,
monitor_project_edit,
} from "@/api/monitor_project";
import type {type_monitor_project_edit} from "@/api/monitor_project";
import {
toast,
alert
} from "@/utils/utils";
import {
useDictData
} from "@/hooks/useDictOptions";
const {
dictData
} = useDictData(['project_type'])
let formRef = ref();
let form = ref<type_monitor_project_edit>({
id: null,
projectKey: "",
projectName: "",
projectType: "",
});
const formRules = {
projectKey: [{
required: true,
message: "请输入项目uuid",
trigger: ["blur"],
}, ],
projectName: [{
required: true,
message: "请输入项目名称",
trigger: ["blur"],
}, ],
projectType: [{
required: true,
message: "请选择项目类型",
trigger: ["blur"],
}, ],
};
onLoad((e) => {
console.log("onLoad", e);
getDetails(e.id);
});
function getDetails(id) {
monitor_project_detail(id)
.then((res) => {
if (res.code == 200) {
if (res.data) {
form.value = res?.data;
}
} else {
toast(res.message);
}
})
.catch((err) => {
toast(err.message || "网络错误");
});
}
function submit() {
console.log("submit", form);
formRef.value.validate().then(() => {
monitor_project_edit(form.value).then((res) => {
if (res.code == 200) {
toast("编辑成功");
getDetails(form.value?.id);
} else {
toast(res.message);
}
});
});
}
</script>
<style lang="scss" scoped>
.page-content {
padding: 10rpx 20rpx 300rpx;
}
</style>