Commit aa232724 authored by “yiyousong”'s avatar “yiyousong”

pref:修改站点管理页面

parent 29c8c8c2
...@@ -26,6 +26,7 @@ ...@@ -26,6 +26,7 @@
"core-js": "^3.6.5", "core-js": "^3.6.5",
"date-fns": "^2.14.0", "date-fns": "^2.14.0",
"echarts": "^5.2.2", "echarts": "^5.2.2",
"element-china-area-data": "^5.0.2",
"enquire.js": "^2.1.6", "enquire.js": "^2.1.6",
"file-saver": "^2.0.5", "file-saver": "^2.0.5",
"highlight.js": "^10.2.1", "highlight.js": "^10.2.1",
......
...@@ -109,6 +109,11 @@ ...@@ -109,6 +109,11 @@
style="width: 260px" style="width: 260px"
:options="options" :options="options"
placeholder="请选择位置" placeholder="请选择位置"
:field-names="{
value: 'label',
children: 'children',
label: 'label',
}"
@change="oncityChange" @change="oncityChange"
/> />
</a-form-model-item> </a-form-model-item>
...@@ -254,7 +259,8 @@ ...@@ -254,7 +259,8 @@
<script> <script>
import { modelList, siteSave } from "@/services/basicsetFun"; import { modelList, siteSave } from "@/services/basicsetFun";
import YCheckbox from "@/components/ycheckbox/YCheckbox.vue"; import YCheckbox from "@/components/ycheckbox/YCheckbox.vue";
import options from "@/utils/city"; // import options from "@/utils/city";
import { regionData } from "element-china-area-data";
export default { export default {
props: { props: {
formVisible: { formVisible: {
...@@ -305,7 +311,7 @@ export default { ...@@ -305,7 +311,7 @@ export default {
? process.env.VUE_APP_API_BASE_URL.replace("base", "") ? process.env.VUE_APP_API_BASE_URL.replace("base", "")
: process.env.VUE_APP_API_BASE_URL, : process.env.VUE_APP_API_BASE_URL,
loading: false, loading: false,
options, // 地区级联数据 options: regionData, // 地区级联数据
tablename: "", //接口名称 tablename: "", //接口名称
modelIds: [], // 板块数据 modelIds: [], // 板块数据
cityData: [], cityData: [],
...@@ -625,6 +631,7 @@ export default { ...@@ -625,6 +631,7 @@ export default {
}, },
// 地址 // 地址
oncityChange(val) { oncityChange(val) {
console.log(val);
[ [
this.formInfo.proCode, this.formInfo.proCode,
this.formInfo.cityCode, this.formInfo.cityCode,
...@@ -637,7 +644,7 @@ export default { ...@@ -637,7 +644,7 @@ export default {
this.$jsonp(`https://restapi.amap.com/v3/geocode/geo?parameters`, { this.$jsonp(`https://restapi.amap.com/v3/geocode/geo?parameters`, {
//官方接口 //官方接口
output: "jsonp", output: "jsonp",
key: "21e7ac78b448640e516f1eddc3ffd720", //腾讯地图获取的key key: "21e7ac78b448640e516f1eddc3ffd720", //key
address: address, //获取输入的位置 address: address, //获取输入的位置
}) })
.then((res) => { .then((res) => {
......
...@@ -240,9 +240,10 @@ ...@@ -240,9 +240,10 @@
import sitetree from "@/components/sitetree/index"; import sitetree from "@/components/sitetree/index";
import addsite from "./components/addsite.vue"; import addsite from "./components/addsite.vue";
import alldetails from "./components/alldetails.vue"; import alldetails from "./components/alldetails.vue";
import local from "@/utils/local";
import { import {
deleteSite, deleteSite,
// siteInfo, siteInfo,
getSiteList, getSiteList,
SyncSiteData, SyncSiteData,
} from "@/services/basicsetFun"; } from "@/services/basicsetFun";
...@@ -265,10 +266,13 @@ export default { ...@@ -265,10 +266,13 @@ export default {
active: 0, //站点激活 active: 0, //站点激活
siteData: [], //站点数据 siteData: [], //站点数据
areaID: "", areaID: "",
siteId: local.getLocal("siteId"),
// modelData: [], // 模块数据 // modelData: [], // 模块数据
}; };
}, },
created() {}, created() {
this.getSiteInfo();
},
methods: { methods: {
getArea(info) { getArea(info) {
...@@ -292,16 +296,18 @@ export default { ...@@ -292,16 +296,18 @@ export default {
this.siteData = data; this.siteData = data;
}, },
// 获取站点信息 // 获取站点信息
// async getSiteInfo(info = {}) { async getSiteInfo() {
// let res = await siteInfo({ id: info.id }); let res = await siteInfo({ id: this.siteId });
// let { data, dict } = res.data; let { data, dict } = res.data;
// let arr = data.modelIds.split(","); data.modelIds = data.modelIds.split(",");
// this.modelData = Object.keys(dict.modelIds).reduce( data.modelData = Object.keys(dict.modelIds).reduce(
// (pre, cur) => (arr.includes(cur) && pre.push(dict.modelIds[cur]), pre), (pre, cur) => (
// [] data.modelIds.includes(cur) && pre.push(dict.modelIds[cur]), pre
// ); ),
// this.siteData = data; []
// }, );
this.siteData = [data];
},
// 删除 // 删除
deleteSite(val) { deleteSite(val) {
...@@ -399,6 +405,7 @@ export default { ...@@ -399,6 +405,7 @@ export default {
justify-content: center; justify-content: center;
align-items: center; align-items: center;
.rigth-content { .rigth-content {
width: 100%;
height: 100%; height: 100%;
} }
.cut-btn { .cut-btn {
......
<template>
<a-modal
title="新增皮肤"
on-ok="handleOk"
class="skins_bnt_add"
:width="720"
:visible="Visible"
@cancel="Visible = false"
>
<template slot="footer">
<a-button key="back" @click="handleCancel" class="skins_chongzhi">重置</a-button>
<a-button
key="submit"
type="primary"
:loading="loading"
@click="handleOk"
class="skins_queding"
>确定</a-button>
</template>
<a-checkbox-group @change="onChange">
<a-row>
<a-form-item label="选择系统">
<a-col :span="8">
<a-checkbox value>窗口屏</a-checkbox>
</a-col>
<a-col :span="8">
<a-checkbox value>集中屏</a-checkbox>
</a-col>
<a-col :span="8">
<a-checkbox value>呼叫器</a-checkbox>
</a-col>
<a-col :span="8">
<a-checkbox value>评价器</a-checkbox>
</a-col>
<a-col :span="8">
<a-checkbox value>导视机</a-checkbox>
</a-col>
</a-form-item>
</a-row>
</a-checkbox-group>
<a-form-item label="版本号" class="banben">
<a-input placeholder="请输入版本号" class="skins_num" />
</a-form-item>
<a-form-item label="标题" class="biaoti">
<a-input placeholder="请输入标题" class="skins_num" />
</a-form-item>
<a-form-item label="皮肤" class="pifu">
<a-upload
name="avatar"
list-type="picture-card"
class="avatar-uploader"
:show-upload-list="false"
action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
:before-upload="beforeUpload"
@change="handleChange"
>
<img v-if="imageUrl" :src="imageUrl" alt="avatar" />
<div v-else>
<a-icon :type="loading ? 'loading' : 'plus'" />
<div class="ant-upload-text">上传图片</div>
</div>
</a-upload>
</a-form-item>
</a-modal>
</template>
<script>
export default {
data () {
return {
loading: false,
}
},
props: {
visibleSkin: {
type: Boolean,
default: false,
}
},
methods: {
handleOk () {
this.loading = true;
setTimeout(() => {
this.visibleSkin = false;
this.loading = false;
}, 3000);
},
onChange (checkedValues) {
console.log('checked = ', checkedValues);
},
handleChange () {
console.log(123);
},
handleCancel () {
this.visibleSkin = false;
},
},
computed: {
Visible: {
get () {
return this.visibleSkin
},
set (val) {
this.$emit('update:visibleSkin', val)
}
}
},
}
</script>
<style>
</style>
\ No newline at end of file
<template>
<a-modal :visible="Visible" @cancel="Visible = false" title="皮肤" @ok="showOk" :width="750">
<img src="~@/assets/img/derma.png" class="pht2" />
</a-modal>
</template>
<script>
export default {
data () {
return {
}
},
props: {
visibleImg: {
type: Boolean,
default: false,
}
},
computed: {
Visible: {
get () {
return this.visibleImg
},
set (val) {
this.$emit('update:visibleImg', val)
}
}
},
methods: {
showOk (e) {
console.log(e);
// this.visibleImg = false;
},
}
}
</script>
<style lang="less" scoped>
.pht2 {
width: 100%;
height: 100%;
}
</style>
\ No newline at end of file
<template>
<div class="skins ff">
<p>皮肤管理</p>
<!-- 皮肤管理 -->
<div class="skins_font">
<!-- 按钮 -->
<div class="skins_bnt">
<a-button type="primary" @click="showModal" class="skins_btn_1">新增</a-button>
<!-- 新增弹窗 -->
<addskins :visibleSkin.sync="visibleSkin"></addskins>
</div>
<!-- 输入框 -->
<div class="skins_sou">
<a-input-search
placeholder="请输入系统名称搜索"
style="width: 200px"
@search="onSearch"
class="skins_sou_1"
/>
<!-- 搜索按钮 -->
<a-button type="primary" class="skins_btn_2">搜索</a-button>
</div>
</div>
<!-- 表格 -->
<a-table :columns="columns" :data-source="data">
<a slot="name" slot-scope="text">{{ text }}</a>
<span slot="number" slot-scope="text, record, index">{{ index + 1 }}</span>
<span slot="pic">
<img src="~@/assets/img/derma.png" class="pht" type="primary" @click="showPic" />
<!-- 图片弹窗 -->
<maximg :visibleImg.sync="visibleImg"></maximg>
</span>
<span slot="action">
<a type="primary" @click="showModal" class="edit">编辑</a>
<a class="delet">删除</a>
</span>
</a-table>
<!-- <DelModal :message="message" ref="delModal"/> -->
</div>
</template>
<script>
import addskins from './components/addskins.vue'
import Maximg from './components/maximg.vue';
const columns = [
{
title: "序号",
dataIndex: "number",
scopedSlots: {
customRender: "number"
},
},
{
title: "系统名称",
dataIndex: 'name',
},
{
title: "标题",
dataIndex: "title",
},
{
title: "版本",
dataIndex: "versions",
},
{
title: "皮肤",
dataIndex: "skin",
scopedSlots: {
customRender: "pic"
},
},
{
title: "操作",
scopedSlots: {
customRender: "action",
},
},
];
const data = [
{
key: 1,
name: "自助服务终端",
title: "自助服务终端版本1",
versions: "v1.0",
},
{
key: 2,
name: "集中屏",
title: "窗口屏版本1",
versions: "v1.0",
},
{
key: 3,
name: "评价器",
title: "自助服务终端版本1",
versions: "v1.0",
},
{
key: 4,
name: "窗口屏",
title: "窗口屏版本2",
versions: "v2.0",
},
{
key: 5,
name: "集中屏",
title: "窗口屏版本3",
versions: "v3.0",
},
];
export default {
components: {
addskins,
Maximg
},
data () {
return {
data,
columns,
visibleSkin: false,
visibleImg: false,
// previewVisible: false,
};
},
methods: {
showModal () {
this.visibleSkin = true;
},
showPic () {
this.visibleImg = true;
},
onSearch () {
console.log(13);
},
handleCancell () {
this.previewVisible = false;
},
// delmodal() {
// this.message = '皮肤'
// this.$refs.delModal.show()
// },
},
};
</script>
<style lang="less" scoped>
.biaoti {
margin-left: 20px;
}
.pifu {
margin-left: 20px;
}
.banben {
margin-left: 10px;
}
.pht {
width: 127px;
height: 71px;
}
.skins_font {
display: flex;
margin-bottom: 15px;
}
.skins_btn_1 {
width: 90px;
height: 36px;
background-color: rgba(5, 149, 253, 1);
border-color: rgba(5, 149, 253, 1);
flex: 1;
}
.skins_sou_1 {
position: relative;
// float: left;
margin-left: 1242px;
width: 278px;
height: 36px;
padding: 2px 2px 2px 25px;
font-family: 'Arial Normal', 'Arial', sans-serif;
font-weight: 400;
font-style: normal;
font-size: 13px;
letter-spacing: normal;
margin-right: 10px;
}
.skins_btn_2 {
outline: none;
margin-right: 20px;
width: 72px;
height: 36px;
background: inherit;
background-color: rgba(5, 149, 253, 1);
border: none;
border-radius: 5px;
box-shadow: none;
font-family: 'PingFang-SC-ExtraLight', 'PingFang SC ExtraLight', 'PingFang SC',
sans-serif;
font-weight: 400;
font-style: normal;
}
.skins_btn_2:focus {
outline: none;
}
.ant-table-thead {
background-color: rgb(214, 214, 214) !important;
}
.edit {
color: rgb(41, 184, 41);
margin-right: 40px;
}
.delet {
color: red;
}
.skins_num {
width: 380px;
}
.skins_queding {
width: 90px;
height: 36px;
background: inherit;
background-color: rgba(5, 149, 253, 1);
border: none;
border-radius: 5px;
box-shadow: none;
}
.skins_chongzhi {
width: 90px;
height: 36px;
background: inherit;
background-color: rgba(5, 149, 253, 0);
box-sizing: border-box;
border-width: 1px;
border-style: solid;
border-color: rgba(220, 223, 230, 1);
border-radius: 5px;
}
</style>
\ No newline at end of file
...@@ -11,6 +11,8 @@ export default {}; ...@@ -11,6 +11,8 @@ export default {};
<style lang="less" scoped> <style lang="less" scoped>
.index { .index {
width: 100%; width: 100%;
min-height: 100%;
background-color: #fff; background-color: #fff;
display: flex;
} }
</style> </style>
\ No newline at end of file
...@@ -120,13 +120,16 @@ export default { ...@@ -120,13 +120,16 @@ export default {
<style lang="less" scoped> <style lang="less" scoped>
.surface { .surface {
padding: 15px; width: 100%;
height: auto;
background-color: #fff; background-color: #fff;
.container { .container {
width: 100%; width: 100%;
height: 100%;
position: relative; position: relative;
} }
.main { .main {
height: 100%;
border-top: 1px solid rgb(224, 224, 224); border-top: 1px solid rgb(224, 224, 224);
background-color: #fff; background-color: #fff;
display: flex; display: flex;
...@@ -143,7 +146,13 @@ export default { ...@@ -143,7 +146,13 @@ export default {
} }
} }
} }
/deep/.ant-card {
height: 100%;
display: flex;
flex-direction: column;
}
/deep/.ant-card-body { /deep/.ant-card-body {
flex: 1;
padding: 0px; padding: 0px;
} }
</style> </style>
\ No newline at end of file
...@@ -3066,6 +3066,11 @@ check-types@^8.0.3: ...@@ -3066,6 +3066,11 @@ check-types@^8.0.3:
resolved "https://registry.npm.taobao.org/check-types/download/check-types-8.0.3.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fcheck-types%2Fdownload%2Fcheck-types-8.0.3.tgz" resolved "https://registry.npm.taobao.org/check-types/download/check-types-8.0.3.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fcheck-types%2Fdownload%2Fcheck-types-8.0.3.tgz"
integrity sha1-M1bMoZyIlUTy16le1JzlCKDs9VI= integrity sha1-M1bMoZyIlUTy16le1JzlCKDs9VI=
china-area-data@^5.0.1:
version "5.0.1"
resolved "https://registry.npmmirror.com/china-area-data/-/china-area-data-5.0.1.tgz#7943b83a0619f033bb5893da80cb46e52e44be66"
integrity sha512-BQDPpiv5Nn+018ekcJK2oSD9PAD+E1bvXB0wgabc//dFVS/KvRqCgg0QOEUt3vBkx9XzB5a9BmkJCEZDBxVjVw==
china-division@^2.5.0: china-division@^2.5.0:
version "2.5.0" version "2.5.0"
resolved "https://registry.npmmirror.com/china-division/-/china-division-2.5.0.tgz" resolved "https://registry.npmmirror.com/china-division/-/china-division-2.5.0.tgz"
...@@ -4475,6 +4480,14 @@ electron-to-chromium@^1.4.76: ...@@ -4475,6 +4480,14 @@ electron-to-chromium@^1.4.76:
resolved "https://registry.npmmirror.com/electron-to-chromium/-/electron-to-chromium-1.4.77.tgz" resolved "https://registry.npmmirror.com/electron-to-chromium/-/electron-to-chromium-1.4.77.tgz"
integrity sha512-fiDxw8mO9Ph1Z0bjX2sFTPpi0J0QkOiwOJF+5Q0J0baNc/F9lLePAvDPlnoxvbUYYMizqrKPeotRRkJ9LtxAew== integrity sha512-fiDxw8mO9Ph1Z0bjX2sFTPpi0J0QkOiwOJF+5Q0J0baNc/F9lLePAvDPlnoxvbUYYMizqrKPeotRRkJ9LtxAew==
element-china-area-data@^5.0.2:
version "5.0.2"
resolved "https://registry.npmmirror.com/element-china-area-data/-/element-china-area-data-5.0.2.tgz#006c26594b8865cb619994063c732562e4583d30"
integrity sha512-vLQuvOKJy/uiX7MRHEk3x/j09hipuIl6DJ/C4XFUG7D7Pj3O47sy+Y6aAArM6k9v8cD9UX6e+yz2S4J+IPnZ8g==
dependencies:
china-area-data "^5.0.1"
lodash-es "^4.17.15"
elliptic@^6.0.0, elliptic@^6.5.2: elliptic@^6.0.0, elliptic@^6.5.2:
version "6.5.3" version "6.5.3"
resolved "https://registry.npmjs.org/elliptic/-/elliptic-6.5.3.tgz" resolved "https://registry.npmjs.org/elliptic/-/elliptic-6.5.3.tgz"
...@@ -7104,6 +7117,11 @@ locate-path@^5.0.0: ...@@ -7104,6 +7117,11 @@ locate-path@^5.0.0:
dependencies: dependencies:
p-locate "^4.1.0" p-locate "^4.1.0"
lodash-es@^4.17.15:
version "4.17.21"
resolved "https://registry.npmmirror.com/lodash-es/-/lodash-es-4.17.21.tgz#43e626c46e6591b7750beb2b50117390c609e3ee"
integrity sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==
lodash._reinterpolate@^3.0.0: lodash._reinterpolate@^3.0.0:
version "3.0.0" version "3.0.0"
resolved "https://registry.npm.taobao.org/lodash._reinterpolate/download/lodash._reinterpolate-3.0.0.tgz" resolved "https://registry.npm.taobao.org/lodash._reinterpolate/download/lodash._reinterpolate-3.0.0.tgz"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment