|
@@ -0,0 +1,514 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <el-form
|
|
|
+ ref="form"
|
|
|
+ :model="form"
|
|
|
+ :rules="rules"
|
|
|
+ label-width="120px"
|
|
|
+ class="flexBox"
|
|
|
+ >
|
|
|
+ <div class="formItemBox">
|
|
|
+ <el-form-item label="项目名称:" prop="projectName">
|
|
|
+ <el-input
|
|
|
+ placeholder="请输入"
|
|
|
+ maxlength="30"
|
|
|
+ v-autoTrim="{ obj: form, key: 'projectName' }"
|
|
|
+ v-model="form.projectName"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="项目描述:" prop="projectDescribe">
|
|
|
+ <el-input
|
|
|
+ type="textarea"
|
|
|
+ :autosize="{ minRows: 4, maxRows: 4 }"
|
|
|
+ placeholder="请输入"
|
|
|
+ maxlength="300"
|
|
|
+ v-autoTrim="{ obj: form, key: 'projectDescribe' }"
|
|
|
+ v-model="form.projectDescribe"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="算法来源:" prop="algorithmType">
|
|
|
+ <el-radio
|
|
|
+ v-model="form.algorithmType"
|
|
|
+ label="1"
|
|
|
+ @change="typeChange"
|
|
|
+ >私有导入</el-radio
|
|
|
+ >
|
|
|
+ <el-radio
|
|
|
+ v-model="form.algorithmType"
|
|
|
+ label="3"
|
|
|
+ @change="typeChange"
|
|
|
+ >算法平台</el-radio
|
|
|
+ >
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="选择算法:" prop="algorithm">
|
|
|
+ <el-select v-model="form.algorithm">
|
|
|
+ <el-option
|
|
|
+ v-for="item in algorithmList"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"
|
|
|
+ :key="item.id"
|
|
|
+ :title="item.description"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="选择车辆:" prop="vehicle">
|
|
|
+ <el-select
|
|
|
+ v-model="form.vehicle"
|
|
|
+ @change="vehicleSelChange"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in vehicleList"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"
|
|
|
+ :key="item.id"
|
|
|
+ :title="item.description"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="选择场景:" prop="scene">
|
|
|
+ <el-select v-model="form.scene" @change="sceneSelChange">
|
|
|
+ <el-option
|
|
|
+ v-for="item in sceneList"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"
|
|
|
+ :key="item.id"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="并行度:" prop="parallelism">
|
|
|
+ <el-input
|
|
|
+ :disabled="runDisabled"
|
|
|
+ placeholder="请输入"
|
|
|
+ maxlength="10"
|
|
|
+ v-autoTrim="{ obj: form, key: 'parallelism' }"
|
|
|
+ v-model="form.parallelism"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="最大仿真时间:" prop="maxSimulationTime">
|
|
|
+ <el-input
|
|
|
+ placeholder="请输入"
|
|
|
+ maxlength="10"
|
|
|
+ v-autoTrim="{ obj: form, key: 'maxSimulationTime' }"
|
|
|
+ v-model="form.maxSimulationTime"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="运行周期:" prop="operationCycle">
|
|
|
+ <el-input
|
|
|
+ placeholder="请输入"
|
|
|
+ maxlength="60"
|
|
|
+ v-autoTrim="{ obj: form, key: 'operationCycle' }"
|
|
|
+ v-model="form.operationCycle"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="是否选择GPU:" prop="isChoiceGpu">
|
|
|
+ <el-radio v-model="form.isChoiceGpu" label="0">是</el-radio>
|
|
|
+ <el-radio v-model="form.isChoiceGpu" label="1">否</el-radio>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="tipBox">
|
|
|
+ <div class="tip tipA">
|
|
|
+ <!-- (传感器1:根据车辆自动带出;传感器2:根据车辆自动带出) -->
|
|
|
+ <span
|
|
|
+ v-for="item in sensors"
|
|
|
+ :key="item"
|
|
|
+ v-bind:class="{
|
|
|
+ iconA: item === 'camera',
|
|
|
+ iconB: item === 'ogt',
|
|
|
+ iconC: item === 'lidar',
|
|
|
+ iconE: item === 'gps',
|
|
|
+ }"
|
|
|
+ ></span>
|
|
|
+ </div>
|
|
|
+ <div class="tip">(场景数量:{{ sceneCount }})</div>
|
|
|
+ <!-- <div class="tip flexBox">
|
|
|
+ <div>(下次运行时间:XX时XX分XX秒)</div>
|
|
|
+ <div class="tipBtnBox">
|
|
|
+ <el-button type="primary">规则查看</el-button>
|
|
|
+ </div>
|
|
|
+ </div> -->
|
|
|
+ <div class="tip">(最多可用资源:{{ maxCount }})</div>
|
|
|
+ <div class="tip">(最小是5,最大是60)</div>
|
|
|
+ </div>
|
|
|
+ </el-form>
|
|
|
+
|
|
|
+ <div class="ruleTip">
|
|
|
+ <el-collapse v-model="activeNames">
|
|
|
+ <el-collapse-item title="运行周期规则查看" name="1">
|
|
|
+ <div class="collapseInfo">
|
|
|
+ 运行周期规则查看
|
|
|
+ </div>
|
|
|
+ </el-collapse-item>
|
|
|
+ </el-collapse>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="btns">
|
|
|
+ <el-button type="primary" @click="save(false)">保存</el-button>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ @click="save(true)"
|
|
|
+ v-if="this.$route.query.id"
|
|
|
+ >另存为</el-button
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ @click="save(false, true)"
|
|
|
+ :disabled="runDisabled"
|
|
|
+ >提交</el-button
|
|
|
+ >
|
|
|
+ <el-button type="primary" plain @click="cancel">取消</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+//import from '';
|
|
|
+let maxCount = 0; // 用于校验
|
|
|
+let validateNum = (rule, value, callback) => {
|
|
|
+ !/^(\d+)$/.test(value) && callback(new Error(rule.message));
|
|
|
+ if (value <= 0 || value > maxCount) callback(new Error(rule.message));
|
|
|
+ callback();
|
|
|
+};
|
|
|
+let validateNumA = (rule, value, callback) => {
|
|
|
+ !/^(\d+)$/.test(value) && callback(new Error(rule.message));
|
|
|
+ if (value < 5 || value > 60) callback(new Error(rule.message));
|
|
|
+ callback();
|
|
|
+};
|
|
|
+let validateNumB = (rule, value, callback) => {
|
|
|
+ !/^(\d+)$/.test(value) && callback(new Error(rule.message));
|
|
|
+ if (value <= 0) callback(new Error(rule.message));
|
|
|
+ callback();
|
|
|
+};
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: "autoRunProjectDetail", // 自动运行项目详情
|
|
|
+ components: {},
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ form: {
|
|
|
+ id: "",
|
|
|
+ projectName: "", // 项目名称
|
|
|
+ projectDescribe: "", // 项目描述
|
|
|
+ algorithmType: "1", // 算法来源
|
|
|
+ algorithm: "", // 选择算法
|
|
|
+ vehicle: "", // 选择车辆
|
|
|
+ scene: "", // 选择场景
|
|
|
+ parallelism: "", // 并行度
|
|
|
+ maxSimulationTime: "", // 最大仿真时间
|
|
|
+ isChoiceGpu: "0", // 是否选择GPU
|
|
|
+ nowRunState: "10", // 运行状态
|
|
|
+ operationCycle: "", // 运行周期
|
|
|
+ },
|
|
|
+ algorithmList: [], // 算法对应列表
|
|
|
+ vehicleList: [], // 车辆对应列表
|
|
|
+ sceneList: [], // 场景对应列表
|
|
|
+ maxCount: 0, // 最多可用资源
|
|
|
+ sceneCount: 0, // 场景数量
|
|
|
+ rules: {
|
|
|
+ projectName: [
|
|
|
+ { required: true, message: "请输入", trigger: "blur" },
|
|
|
+ ],
|
|
|
+ projectDescribe: [
|
|
|
+ { required: true, message: "请输入", trigger: "blur" },
|
|
|
+ ],
|
|
|
+ algorithmType: [
|
|
|
+ { required: true, message: "请选择", trigger: "change" },
|
|
|
+ ],
|
|
|
+ algorithm: [
|
|
|
+ { required: true, message: "请选择", trigger: "change" },
|
|
|
+ ],
|
|
|
+ vehicle: [
|
|
|
+ { required: true, message: "请选择", trigger: "change" },
|
|
|
+ ],
|
|
|
+ scene: [
|
|
|
+ { required: true, message: "请选择", trigger: "change" },
|
|
|
+ ],
|
|
|
+ parallelism: [
|
|
|
+ { required: true, message: "请输入", trigger: "blur" },
|
|
|
+ ],
|
|
|
+ maxSimulationTime: [
|
|
|
+ { required: true, message: "请输入", trigger: "blur" },
|
|
|
+ {
|
|
|
+ validator: validateNumA,
|
|
|
+ message: "请输入不小于5且不大于60的正整数",
|
|
|
+ trigger: ["blur"],
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ isChoiceGpu: [
|
|
|
+ { required: true, message: "请选择", trigger: "change" },
|
|
|
+ ],
|
|
|
+ operationCycle: [
|
|
|
+ { required: true, message: "请输入", trigger: "blur" },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ sensors: [], // 选中车辆后对应的传感器数组
|
|
|
+ activeNames: [""],
|
|
|
+ runDisabled: false, // 若最多可用资源为0,则不可点击"提交"
|
|
|
+ };
|
|
|
+ },
|
|
|
+
|
|
|
+ computed: {},
|
|
|
+
|
|
|
+ methods: {
|
|
|
+ async getLists(dropDownType = "") {
|
|
|
+ await this.$axios({
|
|
|
+ method: "post",
|
|
|
+ url: this.$api.workManagement.selectDropDownByType,
|
|
|
+ data: {
|
|
|
+ dropDownType,
|
|
|
+ algorithmType: this.form.algorithmType,
|
|
|
+ },
|
|
|
+ }).then((res) => {
|
|
|
+ if (res.code == 200 && res.info) {
|
|
|
+ res.info.forEach((item) => {
|
|
|
+ if (item.type === "1") {
|
|
|
+ this.algorithmList = item.dropDownList;
|
|
|
+ } else if (item.type === "2") {
|
|
|
+ this.vehicleList = item.dropDownList;
|
|
|
+ } else if (item.type === "3") {
|
|
|
+ this.sceneList = item.dropDownList;
|
|
|
+ }
|
|
|
+ // 空表示第一次进,有值表示在切换算法来源,需要清空选择算法的值
|
|
|
+ if (dropDownType) {
|
|
|
+ this.form.algorithm = "";
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs.form.clearValidate("algorithm");
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.message || "获取信息失败");
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ typeChange() {
|
|
|
+ this.getLists("1");
|
|
|
+ },
|
|
|
+ async getMaxSimulationTime() {
|
|
|
+ await this.$axios({
|
|
|
+ method: "post",
|
|
|
+ url: this.$api.workManagement.selectMaxParallelism,
|
|
|
+ data: {},
|
|
|
+ }).then((res) => {
|
|
|
+ // res.info = 10;
|
|
|
+ if (res.code == 200 && res.info && res.info != 0) {
|
|
|
+ this.maxCount = maxCount = res.info;
|
|
|
+ if (res.info == -1) {
|
|
|
+ this.rules.parallelism.push({
|
|
|
+ validator: validateNumB,
|
|
|
+ message: "请输入正整数",
|
|
|
+ trigger: ["blur"],
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.rules.parallelism.push({
|
|
|
+ validator: validateNum,
|
|
|
+ message: "请输入不大于最多可用资源的正整数",
|
|
|
+ trigger: ["blur"],
|
|
|
+ });
|
|
|
+ }
|
|
|
+ } else if (res.code == 200 && res.info == 0) {
|
|
|
+ this.maxCount = maxCount = 0;
|
|
|
+ this.runDisabled = true;
|
|
|
+ this.form.parallelism = 0;
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.message || "获取信息失败");
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ sceneSelChange(item) {
|
|
|
+ this.sceneCount = this.sceneList.find(
|
|
|
+ (i) => i.id === item
|
|
|
+ ).sceneNum;
|
|
|
+ },
|
|
|
+ vehicleSelChange(item) {
|
|
|
+ let sensor = this.vehicleList.find((i) => i.id === item).sensor;
|
|
|
+
|
|
|
+ if (!sensor) {
|
|
|
+ this.sensors = [];
|
|
|
+ } else {
|
|
|
+ this.sensors = sensor.split(",");
|
|
|
+ }
|
|
|
+ },
|
|
|
+ save(isAdd = false, needChange = false) {
|
|
|
+ // isAdd是否强制新增,needChange是否需要改变状态
|
|
|
+ this.$refs.form.validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ if (isAdd) {
|
|
|
+ // 另存为
|
|
|
+ this.form.id = "";
|
|
|
+ }
|
|
|
+
|
|
|
+ this.form.nowRunState = "10";
|
|
|
+
|
|
|
+ this.$axios({
|
|
|
+ method: "post",
|
|
|
+ url: this.$api.workManagement
|
|
|
+ .addOrUpdateAutomaticProject,
|
|
|
+ data: {
|
|
|
+ ...this.form,
|
|
|
+ },
|
|
|
+ }).then((res) => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.$message.success("保存成功");
|
|
|
+ if (needChange) {
|
|
|
+ this.form.id = res.info;
|
|
|
+ this.stateChange();
|
|
|
+ } else {
|
|
|
+ this.cancel();
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.message || "保存失败");
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ cancel() {
|
|
|
+ this.$router.replace({ path: "/autoRunProjectList" });
|
|
|
+ },
|
|
|
+ stateChange() {
|
|
|
+ this.$axios({
|
|
|
+ method: "post",
|
|
|
+ url: this.$api.workManagement.updateAutomaticRunState,
|
|
|
+ data: {
|
|
|
+ id: this.form.id,
|
|
|
+ automaticRunState: "0",
|
|
|
+ },
|
|
|
+ }).then((res) => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.$message.success("提交成功");
|
|
|
+ this.cancel();
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.message || "提交失败");
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+
|
|
|
+ mounted() {
|
|
|
+ if (this.$route.query.id) {
|
|
|
+ let id = "";
|
|
|
+ this.form.id = id = this.$route.query.id;
|
|
|
+
|
|
|
+ if (id) {
|
|
|
+ this.$axios({
|
|
|
+ method: "post",
|
|
|
+ url: this.$api.workManagement.selectAutomaticProjectById,
|
|
|
+ data: {
|
|
|
+ id,
|
|
|
+ },
|
|
|
+ }).then(async (res) => {
|
|
|
+ if (res.code == 200 && res.info) {
|
|
|
+ this.form = res.info;
|
|
|
+ await this.getLists();
|
|
|
+ await this.getMaxSimulationTime();
|
|
|
+ this.vehicleSelChange(res.info.vehicle);
|
|
|
+ this.sceneSelChange(res.info.scene);
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.message || "获取信息失败");
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.getLists();
|
|
|
+ this.getMaxSimulationTime();
|
|
|
+ }
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang='less' scoped>
|
|
|
+.el-form {
|
|
|
+ width: 60%;
|
|
|
+ min-width: 900px;
|
|
|
+ padding-top: 60px;
|
|
|
+ margin: 0 auto;
|
|
|
+
|
|
|
+ .formItemBox {
|
|
|
+ flex: 1;
|
|
|
+
|
|
|
+ /deep/ .el-input,
|
|
|
+ .el-select {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-textarea {
|
|
|
+ height: 96px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tipBox {
|
|
|
+ min-width: 270px;
|
|
|
+ margin-left: 20px;
|
|
|
+
|
|
|
+ .tip {
|
|
|
+ margin-bottom: 22px;
|
|
|
+ line-height: 32px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tipA {
|
|
|
+ height: 32px;
|
|
|
+ // 按54往上加
|
|
|
+ margin-top: 280px;
|
|
|
+
|
|
|
+ .iconA {
|
|
|
+ background: url("../../assets/common/image/sensor/001.png")
|
|
|
+ center no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ }
|
|
|
+ .iconB {
|
|
|
+ background: url("../../assets/common/image/sensor/002.png")
|
|
|
+ center no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ }
|
|
|
+ .iconC {
|
|
|
+ background: url("../../assets/common/image/sensor/003.png")
|
|
|
+ center no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ }
|
|
|
+ .iconD {
|
|
|
+ background: url("../../assets/common/image/sensor/004.png")
|
|
|
+ center no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ }
|
|
|
+ .iconE {
|
|
|
+ background: url("../../assets/common/image/sensor/005.png")
|
|
|
+ center no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ }
|
|
|
+
|
|
|
+ span {
|
|
|
+ display: inline-block;
|
|
|
+ width: 18px;
|
|
|
+ height: 18px;
|
|
|
+ margin-top: 7px;
|
|
|
+ margin-right: 6px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .tipB {
|
|
|
+ padding-top: 54px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tipBtnBox {
|
|
|
+ margin-left: 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.ruleTip {
|
|
|
+ width: 60%;
|
|
|
+ min-width: 900px;
|
|
|
+ margin: 0 auto;
|
|
|
+}
|
|
|
+
|
|
|
+.btns {
|
|
|
+ padding-top: 30px;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+</style>
|