|
@@ -0,0 +1,182 @@
|
|
|
+<template>
|
|
|
+ <el-dialog title="基准场景筛选编辑" :visible.sync="dialogVisible" width="700" @close="dialogClose">
|
|
|
+ <h3>标签类型</h3>
|
|
|
+ <el-radio-group v-model="radio" style="display: flex; flex-wrap: wrap; justify-content: flex-start;"
|
|
|
+ @input="radioChange">
|
|
|
+ <el-radio style="margin: 5px 5px" label="sceneLibrodeType" border>道路类型</el-radio>
|
|
|
+ <el-radio style="margin: 5px 5px;" label="egoAction" border>主车行动</el-radio>
|
|
|
+ <el-radio style="margin: 5px 5px;" label="targetAction" border>它车行动</el-radio>
|
|
|
+ <el-radio style="margin: 5px 5px;" label="sceneLibWeather" border>天气</el-radio>
|
|
|
+ <el-radio style="margin: 5px 5px;" label="roadPlaneGeometry" border>道路平面几何</el-radio>
|
|
|
+ <el-radio style="margin: 5px 5px;" label="roadProfileGeometry" border>道路几何-纵断面</el-radio>
|
|
|
+ <el-radio style="margin: 5px 5px;" label="rodeSection" border>运行区域</el-radio>
|
|
|
+ <el-radio style="margin: 5px 5px;" label="supportedAdas" border>智能驾驶</el-radio>
|
|
|
+ <el-radio style="margin: 5px 5px;" label="complexityLevel" border>复杂度等级</el-radio>
|
|
|
+ <el-radio style="margin: 5px 5px;" label="riskLevel" border>危险度等级</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ <h3>下拉内容编辑</h3>
|
|
|
+ <div style="display: flex; margin-bottom: 30px;">
|
|
|
+ <el-tag :key="tag.id" v-for="tag in dynamicTags" closable :disable-transitions="false"
|
|
|
+ @close="handleClose(tag.id)">
|
|
|
+ {{ tag.dictName }}
|
|
|
+ </el-tag>
|
|
|
+ <el-input placeholder="请输入新增内容" style="width: 150px; margin-left: 20px;" v-if="inputVisible"
|
|
|
+ v-model="inputValue" ref="saveTagInput" size="small" @keyup.enter.native="handleInputConfirm"
|
|
|
+ @blur="handleInputConfirm">
|
|
|
+ </el-input>
|
|
|
+ <el-button v-else class="button-new-tag" size="small" @click="showInput">新增数据+</el-button>
|
|
|
+ </div>
|
|
|
+ <!-- <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="dialogVisible = false">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
|
|
|
+ </span> -->
|
|
|
+ </el-dialog>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+const dictionaryMap = {
|
|
|
+ sceneLibrodeType: '道路类型',
|
|
|
+ egoAction: '主车动作',
|
|
|
+ targetAction: '它车动作',
|
|
|
+ sceneLibWeather: '天气',
|
|
|
+ roadPlaneGeometry: '道路平面几何',
|
|
|
+ roadProfileGeometry: '道路几何-纵断面',
|
|
|
+ rodeSection: '运行区域',
|
|
|
+ supportedAdas: '智能驾驶',
|
|
|
+ complexityLevel: '复杂度等级',
|
|
|
+ riskLevel: '危险度等级',
|
|
|
+}
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: "benchmarkEdit", // 基准场景筛选项编辑
|
|
|
+ components: {},
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ radio: 'sceneLibrodeType',
|
|
|
+ dialogVisible: true,
|
|
|
+ dictionaryList: {}, // 字典对象
|
|
|
+ dynamicTags: [{ label: 'xxx', value: '123' }],
|
|
|
+ inputVisible: false,
|
|
|
+ inputValue: '',
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ props: {
|
|
|
+ // content: {
|
|
|
+ // type: String,
|
|
|
+ // default: "",
|
|
|
+ // },
|
|
|
+ // isEdit: {
|
|
|
+ // type: Boolean,
|
|
|
+ // default: true,
|
|
|
+ // },
|
|
|
+ },
|
|
|
+
|
|
|
+ methods: {
|
|
|
+ init(defaultType = 'sceneLibrodeType') {
|
|
|
+ this.$axios({
|
|
|
+ method: 'post',
|
|
|
+ url: this.$api.common.getDictListsByTypes,
|
|
|
+ data: { dictTypes: "egoAction,targetAction,sceneLibWeather,sceneLibrodeType,roadPlaneGeometry,roadProfileGeometry,supportedAdas,rodeSection,complexityLevel,riskLevel" },
|
|
|
+ }).then((res) => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.dictionaryList = res.info
|
|
|
+ // 默认加载道路类型数据
|
|
|
+ this.dynamicTags = res.info[defaultType] || []
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.message || '查询失败')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ radioChange(type) {
|
|
|
+ this.dynamicTags = this.dictionaryList[type] || []
|
|
|
+ },
|
|
|
+ handleClose(tag) {
|
|
|
+ console.log(tag)
|
|
|
+ // this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1);
|
|
|
+ this.$axios({
|
|
|
+ method: 'post',
|
|
|
+ url: this.$api.sceneLibrary.benchmarkSearchDelete,
|
|
|
+ data: {
|
|
|
+ id: tag,
|
|
|
+ dictType: this.radio
|
|
|
+ },
|
|
|
+ }).then((res) => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.$message.success('数据删除成功')
|
|
|
+ this.init(this.radio)
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.message || '删除失败')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ showInput() {
|
|
|
+ this.inputVisible = true;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs.saveTagInput.$refs.input.focus();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ handleInputConfirm() {
|
|
|
+ console.log(this.radio, dictionaryMap[this.radio])
|
|
|
+ let inputValue = this.inputValue;
|
|
|
+ if (inputValue) {
|
|
|
+ this.$axios({
|
|
|
+ method: 'post',
|
|
|
+ url: this.$api.sceneLibrary.benchmarkSearchCreate,
|
|
|
+ data: {
|
|
|
+ dictType: this.radio,
|
|
|
+ dictName: this.inputValue,
|
|
|
+ dictCode: this.inputValue,
|
|
|
+ dictComment: dictionaryMap[this.radio]
|
|
|
+ },
|
|
|
+ }).then((res) => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.$message.success('数据新增成功')
|
|
|
+ this.init(this.radio)
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.message || '新增失败')
|
|
|
+ }
|
|
|
+ this.inputVisible = false;
|
|
|
+ this.inputValue = '';
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ dialogClose(){
|
|
|
+ console.log('关闭')
|
|
|
+ this.$emit('closeHandle');
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.init()
|
|
|
+ },
|
|
|
+ beforeDestroy() {
|
|
|
+
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang='less' scoped>
|
|
|
+.el-tag+.el-tag {
|
|
|
+ margin-left: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.button-new-tag {
|
|
|
+ margin-left: 10px;
|
|
|
+ height: 32px;
|
|
|
+ line-height: 30px;
|
|
|
+ padding-top: 0;
|
|
|
+ padding-bottom: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.input-new-tag {
|
|
|
+ border: 2px solid red;
|
|
|
+ width: 50px;
|
|
|
+ margin-left: 10px;
|
|
|
+ vertical-align: bottom;
|
|
|
+}
|
|
|
+
|
|
|
+h3 {
|
|
|
+ font-size: 18px;
|
|
|
+ margin: 20px 0 10px;
|
|
|
+}
|
|
|
+</style>
|