|
@@ -10,7 +10,7 @@
|
|
|
</div> -->
|
|
|
<!--列表选单end-->
|
|
|
<!--创区选单-->
|
|
|
- <div>
|
|
|
+ <!-- <div>
|
|
|
<div class="areabox">
|
|
|
<p class="aera-title">创建学区</p>
|
|
|
<el-form :label-position="labelPosition" label-width="100px" :model="formArea" :inline="true">
|
|
@@ -44,115 +44,225 @@
|
|
|
<el-button type="success" @click="createdArea">创建</el-button>
|
|
|
<el-button type="info">取消</el-button>
|
|
|
</div>
|
|
|
- </div>
|
|
|
+ </div> -->
|
|
|
<!--创去选单end-->
|
|
|
+ <!--创校选单-->
|
|
|
+ <div class="schoolbox">
|
|
|
+ <p class="aera-title">创建学校</p>
|
|
|
+ <ul>
|
|
|
+ <li class="school-libox" v-for="(item,index) in schoolForm">
|
|
|
+ <div class="school-numlist">{{item.num}}</div>
|
|
|
+ <el-form ref="item" :model="item" label-width="120px">
|
|
|
+ <el-form-item label="学校名称:" class="school-name">
|
|
|
+ <el-input v-model="item.name"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="学段选择:">
|
|
|
+ <el-radio v-model="item.radio1" label="1" border>小学</el-radio>
|
|
|
+ <el-radio v-model="item.radio1" label="2" border>初中</el-radio>
|
|
|
+ <el-radio v-model="item.radio1" label="3" border>高中</el-radio>
|
|
|
+ <el-radio v-model="item.radio1" label="4" border>职高</el-radio>
|
|
|
+ <el-radio v-model="item.radio1" label="5" border>大学</el-radio>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="预设管理员:" class="scholl-admin">
|
|
|
+ <el-autocomplete v-model="item.presupposeAdmin" :fetch-suggestions="querySearch" :trigger-on-focus="false" class="inline-input" placeholder="输入手机号码,查询账号" @select="handleSelect" prefix-icon="el-icon-search" :debounce="500" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="学校所属位置:" class="school-location">
|
|
|
+ <elui-china-area-dht :leave="3" @change="onChange" placeholder="请选择地区"></elui-china-area-dht>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="学校空间大小:">
|
|
|
+ <el-select v-model="item.pitchSpace" placeholder="选择空间大小">
|
|
|
+ <el-option v-for="items in item.schoolSpace" :key="items.value" :label="items.label" :value="items.value">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </li>
|
|
|
+ <div class="add-schoolbtn" @click="addschool">
|
|
|
+ <el-button>添加学校</el-button>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <el-button type="primary">提交创建</el-button>
|
|
|
+ <el-button>取消</el-button>
|
|
|
+ </div>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ <!--创校选单end-->
|
|
|
</template>
|
|
|
<script>
|
|
|
-import { reactive, getCurrentInstance, toRefs } from "vue";
|
|
|
-import { EluiChinaAreaDht } from "elui-china-area-dht";
|
|
|
-import { ElMessage } from "element-plus";
|
|
|
-const chinaData = new EluiChinaAreaDht.ChinaArea().chinaAreaflat;
|
|
|
+import { reactive, getCurrentInstance, toRefs, ref, onMounted } from 'vue'
|
|
|
+import { EluiChinaAreaDht } from 'elui-china-area-dht'
|
|
|
+import { ElMessage } from 'element-plus'
|
|
|
+import { Search } from '@element-plus/icons'
|
|
|
+const chinaData = new EluiChinaAreaDht.ChinaArea().chinaAreaflat
|
|
|
export default {
|
|
|
- components: { EluiChinaAreaDht },
|
|
|
+ components: { EluiChinaAreaDht, Search },
|
|
|
setup() {
|
|
|
- const labelPosition = "left";
|
|
|
- let { proxy } = getCurrentInstance();
|
|
|
+ const labelPosition = 'left'
|
|
|
+ let { proxy } = getCurrentInstance()
|
|
|
let formLabelAlign = reactive({
|
|
|
- name: "",
|
|
|
- region: "",
|
|
|
- type: "",
|
|
|
- });
|
|
|
+ name: '',
|
|
|
+ region: '',
|
|
|
+ type: '',
|
|
|
+ })
|
|
|
let formArea = reactive({
|
|
|
areaselect: {
|
|
|
- province: "",
|
|
|
- provincevalue: "",
|
|
|
- city: "",
|
|
|
- cityvalue: "",
|
|
|
- area: "",
|
|
|
- areavalue: "",
|
|
|
+ province: '',
|
|
|
+ provincevalue: '',
|
|
|
+ city: '',
|
|
|
+ cityvalue: '',
|
|
|
+ area: '',
|
|
|
+ areavalue: '',
|
|
|
state: false,
|
|
|
},
|
|
|
areaname: {
|
|
|
- value: "",
|
|
|
+ value: '',
|
|
|
state: false,
|
|
|
},
|
|
|
- capacityvalue: "",
|
|
|
+ capacityvalue: '',
|
|
|
options: [],
|
|
|
- });
|
|
|
+ })
|
|
|
+ let form = reactive({
|
|
|
+ name: '',
|
|
|
+ region: '',
|
|
|
+ date1: '',
|
|
|
+ date2: '',
|
|
|
+ delivery: false,
|
|
|
+ type: [],
|
|
|
+ resource: '',
|
|
|
+ desc: '',
|
|
|
+ })
|
|
|
+ let radio1 = ref('1')
|
|
|
+ const input2 = ref('')
|
|
|
+ let schoolForm = reactive([])
|
|
|
//地区选择器
|
|
|
function onChange(e) {
|
|
|
- const one = chinaData[e[0]];
|
|
|
- const two = chinaData[e[1]];
|
|
|
- const three = chinaData[e[2]];
|
|
|
- console.log(e, one, two, three);
|
|
|
- formArea.areaname.value =
|
|
|
- one.label + two.label + three.label + "学区";
|
|
|
- formArea.areaselect.province = one.label;
|
|
|
- formArea.areaselect.provincevalue = one.value;
|
|
|
- formArea.areaselect.city = two.label;
|
|
|
- formArea.areaselect.cityvalue = two.value;
|
|
|
- formArea.areaselect.area = three.label;
|
|
|
- formArea.areaselect.areavalue = three.value;
|
|
|
- formArea.areaname.state = false;
|
|
|
+ const one = chinaData[e[0]]
|
|
|
+ const two = chinaData[e[1]]
|
|
|
+ const three = chinaData[e[2]]
|
|
|
+ console.log(e, one, two, three)
|
|
|
+ formArea.areaname.value = one.label + two.label + three.label + '学区'
|
|
|
+ formArea.areaselect.province = one.label
|
|
|
+ formArea.areaselect.provincevalue = one.value
|
|
|
+ formArea.areaselect.city = two.label
|
|
|
+ formArea.areaselect.cityvalue = two.value
|
|
|
+ formArea.areaselect.area = three.label
|
|
|
+ formArea.areaselect.areavalue = three.value
|
|
|
+ formArea.areaname.state = false
|
|
|
}
|
|
|
function changnone(val) {
|
|
|
- val
|
|
|
- ? (formArea.areaname.value = "全国区域学区")
|
|
|
- : (formArea.areaname.value = "");
|
|
|
+ val ? (formArea.areaname.value = '全国区域学区') : (formArea.areaname.value = '')
|
|
|
}
|
|
|
//获取微能力点
|
|
|
function getCapacitys() {
|
|
|
proxy.$api.getCapacity({}).then((res) => {
|
|
|
- console.log(res, "微能力点");
|
|
|
- res.state === 200
|
|
|
- ? (formArea.options = res.areas)
|
|
|
- : ElMessage.error("获取微能力点方案失败,API异常");
|
|
|
- });
|
|
|
+ console.log(res, '微能力点')
|
|
|
+ res.state === 200 ? (formArea.options = res.areas) : ElMessage.error('获取微能力点方案失败,API异常')
|
|
|
+ })
|
|
|
}
|
|
|
//创建区域
|
|
|
function createdArea() {
|
|
|
//获取最后一位的名字,生成名字
|
|
|
- let newstandard = formArea.options[
|
|
|
- formArea.options.length - 1
|
|
|
- ].standard.substring(
|
|
|
- formArea.options[formArea.options.length - 1].standard.indexOf(
|
|
|
- "standard"
|
|
|
- ) + 8
|
|
|
- );
|
|
|
- let newname = "standard" + (Number(newstandard) + 1);
|
|
|
- console.log(newstandard, newname, "截取的内容");
|
|
|
+ let newstandard = formArea.options[formArea.options.length - 1].standard.substring(formArea.options[formArea.options.length - 1].standard.indexOf('standard') + 8)
|
|
|
+ let newname = 'standard' + (Number(newstandard) + 1)
|
|
|
+ console.log(newstandard, newname, '截取的内容')
|
|
|
//查找选中的名字
|
|
|
let selectName = formArea.options.filter((item) => {
|
|
|
- return item.id === formArea.capacityvalue;
|
|
|
- });
|
|
|
- console.log(selectName, "选中的名字");
|
|
|
- let users = JSON.parse(localStorage.getItem("userData"));
|
|
|
- console.log(users);
|
|
|
+ return item.id === formArea.capacityvalue
|
|
|
+ })
|
|
|
+ console.log(selectName, '选中的名字')
|
|
|
+ let users = JSON.parse(localStorage.getItem('userData'))
|
|
|
+ console.log(users)
|
|
|
let createdParame = {
|
|
|
name: formArea.areaname.value,
|
|
|
- provCode: formArea.areaselect.provincevalue,
|
|
|
- provName: formArea.areaselect.province,
|
|
|
- cityCode: formArea.areaselect.cityvalue,
|
|
|
- cityName: formArea.areaselect.city,
|
|
|
+ provCode: !formArea.areaselect.state ? formArea.areaselect.provincevalue : '',
|
|
|
+ provName: !formArea.areaselect.state ? formArea.areaselect.province : '',
|
|
|
+ cityCode: !formArea.areaselect.state ? formArea.areaselect.cityvalue : '',
|
|
|
+ cityName: !formArea.areaselect.state ? formArea.areaselect.city : '',
|
|
|
standard: newname,
|
|
|
standardName: formArea.areaname.value,
|
|
|
- institution: "醍摩豆(成都)信息技术有限公司",
|
|
|
+ institution: '醍摩豆(成都)信息技术有限公司',
|
|
|
oldId: formArea.capacityvalue,
|
|
|
oldStandard: selectName[0].standard,
|
|
|
tmdId: users.teacher.id,
|
|
|
tmdName: users.teacher.name,
|
|
|
- };
|
|
|
- proxy.$api
|
|
|
- .createAreas(createdParame)
|
|
|
- .then((res) =>
|
|
|
- console.log(
|
|
|
- res === 200
|
|
|
- ? ElMessage.success("学区创建成功")
|
|
|
- : ElMessage.error("学区创建失败")
|
|
|
- )
|
|
|
- );
|
|
|
+ }
|
|
|
+ proxy.$api.createAreas(createdParame).then((res) => console.log(res.state === 200 ? ElMessage.success('学区创建成功') : ElMessage.error('学区创建失败')))
|
|
|
+ }
|
|
|
+ let state2 = ref('')
|
|
|
+ const restaurants = ref([])
|
|
|
+ const loadAll = () => {
|
|
|
+ return [
|
|
|
+ { value: 'vue', link: 'https://github.com/vuejs/vue' },
|
|
|
+ { value: 'element', link: 'https://github.com/ElemeFE/element' },
|
|
|
+ { value: 'cooking', link: 'https://github.com/ElemeFE/cooking' },
|
|
|
+ { value: 'mint-ui', link: 'https://github.com/ElemeFE/mint-ui' },
|
|
|
+ { value: 'vuex', link: 'https://github.com/vuejs/vuex' },
|
|
|
+ { value: 'vue-router', link: 'https://github.com/vuejs/vue-router' },
|
|
|
+ { value: 'babel', link: 'https://github.com/babel/babel' },
|
|
|
+ { value: '15218635716', link: 'https://github.com/babel/babel' },
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ function querySearch(queryString, cb) {
|
|
|
+ console.log(queryString, '3333')
|
|
|
+ const results = queryString ? restaurants.value.filter(createFilter(queryString)) : restaurants.value
|
|
|
+ cb(results)
|
|
|
+ }
|
|
|
+ function createFilter(queryString) {
|
|
|
+ return (restaurant) => {
|
|
|
+ return restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0
|
|
|
+ }
|
|
|
+ }
|
|
|
+ function handleSelect(item) {
|
|
|
+ console.log(item)
|
|
|
+ }
|
|
|
+ onMounted(() => {
|
|
|
+ restaurants.value = loadAll()
|
|
|
+ console.log(restaurants.value)
|
|
|
+ let schoolData = {
|
|
|
+ num: 1,
|
|
|
+ name: '',
|
|
|
+ radio1: '',
|
|
|
+ presupposeAdmin: '',
|
|
|
+ schoolLocation: {
|
|
|
+ province: '',
|
|
|
+ provincevalue: '',
|
|
|
+ city: '',
|
|
|
+ cityvalue: '',
|
|
|
+ area: '',
|
|
|
+ areavalue: '',
|
|
|
+ state: false,
|
|
|
+ },
|
|
|
+ schoolSpace: [],
|
|
|
+ pitchSpace: '',
|
|
|
+ }
|
|
|
+ schoolForm.push(schoolData)
|
|
|
+ console.log(schoolForm, '学校内容')
|
|
|
+ })
|
|
|
+ function addschool() {
|
|
|
+ console.log(schoolForm.length)
|
|
|
+ let idnum = Number(schoolForm.length) + 1
|
|
|
+ let data = {
|
|
|
+ num: idnum,
|
|
|
+ name: '',
|
|
|
+ radio1: '',
|
|
|
+ presupposeAdmin: '',
|
|
|
+ schoolLocation: {
|
|
|
+ province: '',
|
|
|
+ provincevalue: '',
|
|
|
+ city: '',
|
|
|
+ cityvalue: '',
|
|
|
+ area: '',
|
|
|
+ areavalue: '',
|
|
|
+ state: false,
|
|
|
+ },
|
|
|
+ schoolSpace: [],
|
|
|
+ pitchSpace: '',
|
|
|
+ }
|
|
|
+ console.log(schoolForm, '添加之前的')
|
|
|
+ schoolForm.push(data)
|
|
|
+ console.log(schoolForm, '添加后的学校')
|
|
|
}
|
|
|
- getCapacitys();
|
|
|
+ getCapacitys()
|
|
|
return {
|
|
|
labelPosition,
|
|
|
formLabelAlign,
|
|
@@ -161,9 +271,18 @@ export default {
|
|
|
changnone,
|
|
|
getCapacitys,
|
|
|
createdArea,
|
|
|
- };
|
|
|
+ form,
|
|
|
+ radio1,
|
|
|
+ querySearch,
|
|
|
+ loadAll,
|
|
|
+ restaurants,
|
|
|
+ state2,
|
|
|
+ schoolForm,
|
|
|
+ handleSelect,
|
|
|
+ addschool,
|
|
|
+ }
|
|
|
},
|
|
|
-};
|
|
|
+}
|
|
|
</script>
|
|
|
<style scoped>
|
|
|
.selectbox {
|
|
@@ -213,6 +332,55 @@ export default {
|
|
|
.capacity-box .el-select {
|
|
|
width: 100%;
|
|
|
}
|
|
|
+.school-box {
|
|
|
+ width: 70%;
|
|
|
+}
|
|
|
+/*创建学校样式*/
|
|
|
+.schoolbox {
|
|
|
+ width: 100%;
|
|
|
+ padding: 2%;
|
|
|
+ border: 1px solid #ccc;
|
|
|
+ line-height: 140px;
|
|
|
+ min-height: 895px;
|
|
|
+}
|
|
|
+.school-name {
|
|
|
+ width: 70%;
|
|
|
+}
|
|
|
+.school-libox {
|
|
|
+ position: relative;
|
|
|
+ border: 1px dashed #ccc;
|
|
|
+ padding: 1%;
|
|
|
+ margin-bottom: 2%;
|
|
|
+}
|
|
|
+.scholl-admin {
|
|
|
+ width: 65%;
|
|
|
+}
|
|
|
+.school-numlist {
|
|
|
+ position: absolute;
|
|
|
+ top: -3px;
|
|
|
+ left: -6px;
|
|
|
+ line-height: 1px;
|
|
|
+ width: 36px;
|
|
|
+ height: 36px;
|
|
|
+ line-height: 30px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 900;
|
|
|
+ background: url('../../assets/img/list-num.png');
|
|
|
+}
|
|
|
+.add-schoolbtn {
|
|
|
+ width: 5.5%;
|
|
|
+ line-height: 0px;
|
|
|
+}
|
|
|
+.add-schoolbtn button {
|
|
|
+ font-weight: 800;
|
|
|
+}
|
|
|
+.demo-input-label {
|
|
|
+ display: inline-block;
|
|
|
+ width: 130px;
|
|
|
+}
|
|
|
+.demo-input-suffix {
|
|
|
+ margin-bottom: 16px;
|
|
|
+}
|
|
|
</style>
|
|
|
<style>
|
|
|
.areabox .el-form {
|
|
@@ -228,4 +396,14 @@ export default {
|
|
|
.areabox .el-form-item {
|
|
|
min-width: 380px;
|
|
|
}
|
|
|
+.schoolbox .el-form-item__content {
|
|
|
+ text-align: left;
|
|
|
+ margin-left: 1%;
|
|
|
+}
|
|
|
+.scholl-admin .el-autocomplete {
|
|
|
+ width: 70%;
|
|
|
+}
|
|
|
+.school-location .el-cascader {
|
|
|
+ width: 42%;
|
|
|
+}
|
|
|
</style>
|