williamet/cas_cloud_admin_i18n
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

SiteOptions

Browse Source
This commit is contained in:
cxc
2022-07-26 17:31:19 +08:00
parent 2f2d61385c
commit 488071ab2b
8 changed files with 254 additions and 143 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/store/modules/data.js Normal file
View File

@ -0,0 +1,20 @@
import { defineStore } from "pinia";
const useDataStore = defineStore("data", {
state: () => ({
siteList: [],
}),
getters: {
getSiteName: (state) => {
return (siteId) =>
state.siteList.find((el) => el.id === siteId)?.name || "无";
},
},
actions: {
setSiteList(list) {
this.siteList = list;
},
},
});
export default useDataStore;

6
src/utils/parameter.js
View File

@ -29,9 +29,9 @@ export const educationOptions = [
];
// 企业类型
export const enterpriseOptions = [
{ key: 101, value: "上市企业" },
{ key: 102, value: "优质企业" },
{ key: 103, value: "普通企业" },
{ key: "101", value: "上市企业" },
{ key: "102", value: "优质企业" },
{ key: "103", value: "普通企业" },
];
// 成果成熟度 技术
export const maturityOptions = [

235
src/views/components/FieldOptions/index.vue
View File

@ -1,6 +1,6 @@
<template>
<el-form
ref="form"
ref="formRef"
:model="value"
:rules="rules"
:label-width="labelWidth + 'px'"
@ -86,39 +86,144 @@
</el-row>
</el-form>
</template>
<script>
<script setup name="FieldOptions">
import { industry } from "@/api/config";
export default {
props: {
value: Object,
labelWidth: {
type: Number,
default: 120,
},
disabled: {
type: Boolean,
default: false,
},
import { ElMessage } from "element-plus";
import { toRefs, watch } from "vue";
const props = defineProps({
modelValue: Object,
labelWidth: {
type: Number,
default: 120,
},
data() {
return {
levelI: [], // I级数据
levelII: [], // II级数据
levelIII: [], // III级数据
fields: [], // 当前下拉框选中的集合
industrysTags: [], // 点击添加按钮后临时存储的数据集合
rules: {
industrys: [
{
type: "array",
required: true,
message: "请选择并添加",
trigger: "change",
},
],
disabled: {
type: Boolean,
default: false,
},
});
const { modelValue, labelWidth, disabled } = toRefs(props);
const formRef = ref(null);
const levelI = ref([]); // I级数据
const levelII = ref([]); // II级数据
const levelIII = ref([]); // III级数据
const fields = ref([]); // 当前下拉框选中的集合
const industrysTags = ref([]); // 点击添加按钮后临时存储的数据集合
const data = reactive({
rules: {
industrys: [
{
type: "array",
required: true,
message: "请选择并添加",
trigger: "change",
},
};
],
},
});
const { rules } = toRefs(data);
const getFieldByParent = (id) => {
return new Promise((resolve, reject) => {
industry({ parent_id: id })
.then(({ code, msg, data }) => {
if (code == 200) {
resolve(data);
} else {
ElMessage.error(msg);
reject({ msg, code });
}
})
.catch((error) => {
reject(error);
});
});
};
const levelIChange = async (item) => {
delete fields.value[1];
delete fields.value[2];
levelII.value = await getFieldByParent(item.id);
};
const levelIIChange = async (item) => {
delete fields.value[2];
levelIII.value = await getFieldByParent(item.id);
};
// 所属领域添加按钮
const fieldAdd = () => {
if (!fields.value.length) return ElMessage.error("请选择领域类型");
modelValue.value.industrys = [];
industrysTags.value.push(fields.value);
for (let i = 0; i < industrysTags.value.length; i++) {
modelValue.value.industrys.push("");
const item = industrysTags.value[i];
for (let j = 0; j < item.length; j++) {
const item2 = item[j];
if (modelValue.value.industrys[i] == "") {
modelValue.value.industrys[i] = item2.id;
} else {
modelValue.value.industrys[i] =
modelValue.value.industrys[i] + "-" + item2.id;
}
}
}
fields.value = [];
levelII.value = [];
levelIII.value = [];
};
const handleFieldClose = (index) => {
industrysTags.value.splice(index, 1);
modelValue.value.industrys.splice(index, 1);
};
const validateForm = async () => {
try {
return await formRef.value.validateForm();
} catch (error) {
return false;
}
};
industry().then((res) => {
levelI.value = res.data;
});
watch(modelValue, (newVal) => {
let _key = [];
let _value = [];
for (let i = 0; i < newVal.industrys.length; i++) {
const item = newVal.industrys[i];
_key.push(item.key);
_value.push(item.value);
}
newVal.industrys = _key;
let keyObj = [];
for (let i = 0; i < _key.length; i++) {
keyObj.push([]);
let array = _key[i].split("-");
for (let j = 0; j < array.length; j++) {
keyObj[i].push({
id: array[j],
});
}
}
for (let i = 0; i < _value.length; i++) {
let array = _value[i].split(">");
for (let j = 0; j < array.length; j++) {
keyObj[i][j]["name"] = array[j];
}
}
industrysTags.value = keyObj;
});
defineExpose({
validateForm,
});
</script>
<!-- <script>
export default {
watch: {
value(newVal, oldVal) {
let _key = [];
@ -146,79 +251,15 @@ export default {
keyObj[i][j]["name"] = array[j];
}
}
this.industrysTags = keyObj;
industrysTags.value = keyObj;
},
},
methods: {
getFieldByParent(id) {
return new Promise((resolve, reject) => {
industry({ parent_id: id })
.then(({ code, msg, data }) => {
if (code == 200) {
resolve(data);
} else {
this.$modal.msgError(msg);
reject({ msg, code });
}
})
.catch((error) => {
reject(error);
});
});
},
async levelIChange(item) {
delete this.fields[1];
delete this.fields[2];
this.levelII = await this.getFieldByParent(item.id);
},
async levelIIChange(item) {
delete this.fields[2];
this.levelIII = await this.getFieldByParent(item.id);
},
// 所属领域添加按钮
fieldAdd() {
if (!this.fields.length) return this.$modal.msgError("请选择领域类型");
this.value.industrys = [];
this.industrysTags.push(this.fields);
for (let i = 0; i < this.industrysTags.length; i++) {
this.value.industrys.push("");
const item = this.industrysTags[i];
for (let j = 0; j < item.length; j++) {
const item2 = item[j];
if (this.value.industrys[i] == "") {
this.value.industrys[i] = item2.id;
} else {
this.value.industrys[i] = this.value.industrys[i] + "-" + item2.id;
}
}
}
this.fields = [];
this.levelII = [];
this.levelIII = [];
},
handleFieldClose(index) {
this.industrysTags.splice(index, 1);
this.value.industrys.splice(index, 1);
},
submitForm() {
let flag = false;
this.$refs["form"].validate((valid) => {
flag = valid;
});
return flag;
},
},
created() {
industry().then((res) => {
this.levelI = res.data;
});
},
};
</script>
</script> -->
<style lang="scss" scoped>
.e_tag {
.el-tag {
margin-right: 10px;
}
}
</style>
</style>

48
src/views/components/SiteOptions/index.vue Normal file
View File

@ -0,0 +1,48 @@
<template>
<el-select
:model-value="modelValue"
placeholder="请选择，支持搜索"
size="default"
:loading="siteList.length === 0"
@change="valueChanged"
filterable
clearable
>
<el-option
v-for="item in siteList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</template>
<script setup name="SiteOptions">
import { tenantSelect } from "@/api/subPlatform/tenant";
import useDataStore from "@/store/modules/data";
import { ref, toRefs } from "vue";
const props = defineProps({
modelValue: {
type: [Number, String],
},
});
const { modelValue } = toRefs(props);
const dataStore = useDataStore();
const siteList = ref([]);
const emit = defineEmits(["update:modelValue"]);
// 获取站点列表
const getSiteList = async () => {
const { rows } = await tenantSelect();
siteList.value = rows;
dataStore.setSiteList(rows);
};
const valueChanged = (val) => {
console.log("changed");
emit("update:modelValue", val);
};
getSiteList();
</script>

2
src/views/platform/industry/index.vue
View File

@ -87,7 +87,7 @@ import {
sysIndustryEdit,
industryDelete,
} from "@/api/platform/industry.js";
import { computed, reactive, ref, toRefs } from "vue";
import { reactive, ref, toRefs } from "vue";
import TreeSelect from "@/components/TreeSelect";
import { ElMessage, ElMessageBox } from "element-plus";
import { cloneDeep } from "lodash";

45
src/views/website/solution/service/index.vue
View File

@ -12,14 +12,14 @@
v-model="queryParams.title"
placeholder="请输入关键字"
clearable
size="small"
size="default"
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="归属导航:" prop="mode">
<el-select
size="small"
size="default"
style="width: 240px"
v-model="queryParams.mode"
placeholder="请选择"
@ -36,10 +36,10 @@
</el-select>
</el-form-item>
<el-form-item label="所属站点" prop="tenantId">
<el-select
<!-- <el-select
v-model="queryParams.tenantId"
placeholder="请选择，支持搜索"
size="small"
size="default"
filterable
>
<el-option
@ -48,18 +48,18 @@
:label="item.name"
:value="item.id"
/>
</el-select>
<!-- <SiteOptions v-model="queryParams" /> -->
</el-select> -->
<SiteOptions v-model="queryParams.tenantId" />
</el-form-item>
<el-form-item>
<el-button
type="primary"
icon="search"
size="small"
size="default"
@click="handleQuery"
>搜索</el-button
>
<el-button icon="refresh" size="small" @click="resetQuery"
<el-button icon="refresh" size="default" @click="resetQuery"
>重置</el-button
>
</el-form-item>
@ -71,7 +71,7 @@
type="primary"
plain
icon="plus"
size="small"
size="default"
@click="handleAdd"
>新增</el-button
>
@ -98,7 +98,7 @@
</el-table-column>
<el-table-column label="所属站点" align="center">
<template #default="{ row }">
{{ siteList.find((el) => el.id === row.tenantId)?.name || "无" }}
{{ dataStore.getSiteName(row.tenantId) }}
</template>
</el-table-column>
@ -151,7 +151,7 @@
<el-input v-model="form.title" placeholder="请输入数据名称" />
</el-form-item>
<el-form-item label="所属站点:" prop="tenantId">
<SiteOptions v-model="form" />
<SiteOptions v-model="form.tenantId" />
</el-form-item>
<el-form-item label="归属导航:" prop="mode">
<el-select v-model="form.mode" placeholder="请选择">
@ -202,15 +202,17 @@ import {
serviceEdit,
serviceDelete,
} from "@/api/website/solution";
import { tenantSelect } from "@/api/subPlatform/tenant";
// import { tenantSelect } from "@/api/subPlatform/tenant";
import { ElMessage, ElMessageBox } from "element-plus";
import { cloneDeep } from "lodash";
import SiteOptions from "@/components/SiteOptions";
import SiteOptions from "@/views/components/SiteOptions";
import useDataStore from "../../../../store/modules/data";
const dataStore = useDataStore();
const dataList = ref([]);
// TODO:isSuper
// const is_super = this.$store.getters.is_super;
const loading = ref(true);
const siteList = ref([]); // 站点列表
// const siteList = ref([]); // 站点列表
const showSearch = ref(true);
const showEditDialog = ref(false); // 是否显示新增、修改弹窗
const title = ref(""); // 弹窗标题
@ -294,16 +296,11 @@ const getList = async () => {
loading.value = false;
};
const getSiteList = async () => {
const resp = await tenantSelect();
siteList.value = resp.rows;
};
// const getSiteName = (tenantId) => {
// const item = siteList.value.find((el) => {
// return el.id === tenantId;
// });
// return item ? item.name : "无";
// const getSiteList = async () => {
// const resp = await tenantSelect();
// siteList.value = resp.rows;
// };
// 取消按钮
const cancel = () => {
showEditDialog.value = false;
@ -363,5 +360,5 @@ const handleDelete = (row) => {
.catch(() => {});
};
getList();
getSiteList();
// getSiteList();
</script>

41
src/views/website/solution/serviceCase/index.vue
View File

@ -12,14 +12,15 @@
v-model="queryParams.title"
placeholder="请输入关键字"
clearable
size="small"
size="default"
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="所属站点" prop="tenantId">
<el-select
<SiteOptions v-model="queryParams.tenantId" />
<!-- <el-select
v-model="queryParams.tenantId"
placeholder="请选择，支持搜索"
size="small"
@ -31,17 +32,17 @@
:label="item.name"
:value="item.id"
/>
</el-select>
</el-select> -->
</el-form-item>
<el-form-item>
<el-button
type="primary"
icon="search"
size="small"
size="default"
@click="handleQuery"
>搜索</el-button
>
<el-button icon="refresh" size="small" @click="resetQuery"
<el-button icon="refresh" size="default" @click="resetQuery"
>重置</el-button
>
</el-form-item>
@ -53,7 +54,7 @@
type="primary"
plain
icon="plus"
size="small"
size="default"
@click="handleAdd"
>新增</el-button
>
@ -80,10 +81,11 @@
</el-table-column>
<el-table-column label="所属站点" align="center">
<template #default="{ row }">
{{
<!-- {{
siteList.find((el) => el.id === row.tenantId)?.name || "无"
}}</template
>
}} -->
{{ dataStore.getSiteName(row.tenantId) }}
</template>
</el-table-column>
<el-table-column
label="描述"
@ -145,8 +147,8 @@
<ImageUpload v-model="form.image" :isShowTip="false" :limit="1" />
</el-form-item>
<el-form-item label="所属站点:" prop="tenantId">
<!-- <SiteOptions v-model="form" /> -->
<el-select
<SiteOptions v-model="form.tenantId" />
<!-- <el-select
v-model="form.tenantId"
placeholder="请选择，支持搜索"
size="small"
@ -158,7 +160,7 @@
:label="item.name"
:value="item.id"
/>
</el-select>
</el-select> -->
</el-form-item>
<el-form-item label="所属服务:" prop="kindId">
<el-cascader
@ -200,6 +202,10 @@ import {
serviceCaseKindSelect,
} from "@/api/website/solution";
import WangEditor from "@/components/WangEditor/index.vue";
import useDataStore from "@/store/modules/data";
import SiteOptions from "@/views/components/SiteOptions";
// import SiteOptions from "../../../components/SiteOptions/index.vue";
const dataStore = useDataStore();
// import SiteOptions from "@/components/SiteOptions";
const dataList = ref([]);
const loading = ref(true);
@ -273,10 +279,10 @@ const getList = async () => {
loading.value = false;
};
const getSiteList = async () => {
const resp = await tenantSelect();
siteList.value = resp.rows;
};
// const getSiteList = async () => {
// const resp = await tenantSelect();
// siteList.value = resp.rows;
// };
const getCaseKindList = async () => {
const resp = await serviceCaseKindSelect();
@ -322,7 +328,6 @@ const handleAdd = () => {
const handleUpdate = async (row) => {
reset();
const resp = await serviceCaseDetail(row.id);
console.log(resp);
form.value = resp.data;
showEditDialog.value = true;
title.value = "修改";
@ -354,6 +359,6 @@ const handleDelete = (row) => {
};
getList();
getSiteList();
// getSiteList();
getCaseKindList();
</script>