Skip to content

A
apaas-ui
Commit 39475248 authored by 刘殿昕's avatar 刘殿昕
Browse files
Options

table_example

parent 274386dd
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1194 additions and 391 deletions
index.html
View file @ 39475248
......@@ -3,7 +3,7 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<title>宁乡智慧商圈app</title>
<title>apaas 3.0</title>
<link rel="shortcut icon" type="image/x-icon" href="static/favicon.ico" />
</head>
......
src/assets/css/index.css
View file @ 39475248
This diff is collapsed.
src/assets/imgs/btn_blue.svg deleted 100644 → 0
View file @ 274386dd
This diff is collapsed.
src/assets/imgs/img_card.svg deleted 100644 → 0
View file @ 274386dd
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 672 301"><defs><style>.cls-1{fill:#fff;}.cls-1,.cls-2{fill-rule:evenodd;}.cls-2{fill:#f4f7fc;}</style></defs><title>ic_画板 3</title><path class="cls-1" d="M658,59H252.75c-8.84,0-21.28-5.28-27.79-11.79L189.54,11.79C183,5.28,170.59,0,161.75,0H14A14,14,0,0,0,0,14V287a14,14,0,0,0,14,14H658a14,14,0,0,0,14-14V73A14,14,0,0,0,658,59Z"/><path class="cls-2" d="M658,59H252.75c-8.84,0-21.28-5.28-27.79-11.79L189.54,11.79C183,5.28,170.59,0,161.75,0H14A14,14,0,0,0,0,14V231H672V73A14,14,0,0,0,658,59Z"/></svg>
\ No newline at end of file
src/assets/imgs/img_comment_bg.svg deleted 100644 → 0
View file @ 274386dd
<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 672 839"><defs><style>.cls-1{fill:none;}.cls-2{fill:#fff;fill-rule:evenodd;}</style></defs><title>ic_画板 4</title><path class="cls-1" d="M658,59H252.75c-8.84,0-21.28-5.28-27.79-11.79L189.54,11.79C183,5.28,170.59,0,161.75,0H14A14,14,0,0,0,0,14V825a14,14,0,0,0,14,14H658a14,14,0,0,0,14-14V73A14,14,0,0,0,658,59Z"/><path class="cls-2" d="M658,59H252.75c-8.84,0-21.28-5.28-27.79-11.79L189.54,11.79C183,5.28,170.59,0,161.75,0H14A14,14,0,0,0,0,14V825a14,14,0,0,0,14,14H658a14,14,0,0,0,14-14V73A14,14,0,0,0,658,59Z"/></svg>
\ No newline at end of file
src/components/dialog-remove.vue 0 → 100644
View file @ 39475248
<template>
<transition name="mask-bg-fade">
<el-dialog
:visible.sync="show"
width="400px"
top="25vh"
:class="this.confirmModalOptions.className ? this.confirmModalOptions.className : 'user-dialog'"
>
<span slot="title">
<b class="iconLeft"></b>
<span
style=" display: inline-block;vertical-align: middle;"
>{{confirmModalOptions.title || '提示'}}</span>
</span>
<span>{{confirmModalOptions.message || ""}}</span>
<span slot="footer" class="dialog-footer">
<el-button
@click="confirmCancel"
class="form_c"
icon="el-icon-close"
size="mini"
round
>{{confirmModalOptions.btnCancelText || "取消"}}</el-button>
<el-button
type="primary"
icon="el-icon-check"
size="mini"
round
class="form_t"
@click="confirmSubmit"
>{{confirmModalOptions.btnSubmitText || "确定"}}</el-button>
</span>
</el-dialog>
</transition>
</template>
<script>
import services from "@/services";
export default {
props: ["confirmModalOptions", "delSelect"],
data() {
return {
show: false, // 是否显示模态框
all_url: "",
getData: null
};
},
watch: {
delSelect: {
handler() {
this.getData = this.delSelect;
},
deep: true
}
},
methods: {
showModel: function() {
this.show = true;
var className = this.confirmModalOptions.className
? this.confirmModalOptions.className
: "user-dialog";
setTimeout(() => {
document
.getElementsByClassName("v-modal")[0]
.setAttribute("class", "v-modal " + className);
}, 10);
},
confirmCancel: function() {
this.show = false;
},
getDataFromApi() {
return new Promise((resolve, reject) => {
this.all_url = `${this.getData.id}`;
this.$http
.delete(this.all_url)
.then(response => {
resolve(response);
})
.catch(function(response) {
reject(response);
});
});
},
confirmSubmit: function() {
// if(typeof (this.confirmModalOptions.btnSubmitFunction)==='function'){
// this.confirmModalOptions.btnSubmitFunction()
// }
let time;
if (this.confirmModalOptions.time) {
time = this.confirmModalOptions.time;
} else {
time = 1000;
}
this.getDataFromApi().then(data => {
if (data.status == 200) {
setTimeout(() => {
this.$emit("refreshuseList");
}, time);
} else {
this.$message({
showClose: true,
message: this.delSelect.label + "失败",
type: "error"
});
}
this.show = false;
});
}
}
};
</script>
<style>
.el-dialog__header {
border-bottom: 1px solid #edf0ff;
padding: 20px 20px 16px !important;
font-family: "MicrosoftYaHei";
font-size: 16px;
color: #1d1e20;
font-weight: 800;
}
.el-dialog__header .iconLeft {
width: 4px;
height: 16px;
background-color: #0367f6;
border-radius: 2px;
display: inline-block;
vertical-align: middle;
margin-right: 3px;
}
.el-icon-close:before {
font-weight: 800 !important;
}
.el-dialog__body {
padding: 49px 20px !important;
}
</style>
<style scoped>
.group-dialog.el-dialog__wrapper {
width: 100% !important;
left: 0 !important;
overflow: hidden;
}
.user-dialog {
overflow: hidden;
}
</style>
\ No newline at end of file
src/components/table-input.vue 0 → 100644
View file @ 39475248
<template>
<div class="text-xs-center" @click="changeStatus">
<input ref="inp" v-show="inputStatus" v-model="inputText" @blur="changeStatus" class="table_in_input" />
<span v-show="!inputStatus">{{ item }}</span>
</div>
</template>
<script>
import helper from "@/services/helper";
export default {
props: ["item", "header", "rowId"],
data: () => ({
inputStatus: false,
inputText: ""
}),
methods: {
changeStatus() {
this.inputStatus = !this.inputStatus;
if (this.inputStatus) {
// 聚焦事件需要延时
setTimeout(() => {
this.$refs.inp.focus();
}, 100);
this.inputText = this.item;
} else {
this.$emit("changeInputValue", {
rowId: this.rowId,
header: this.header,
inputValue: this.inputText
});
}
}
}
};
</script>
<style scoped>
.text-xs-center {
height: 24px;
}
.text-xs-center input {
width: 100%;
}
.table_in_input {
text-align: center;
font-size: 14px;
}
</style>
\ No newline at end of file
src/components/table-um.vue 0 → 100644
View file @ 39475248
This diff is collapsed.
src/components/table-umhref.vue 0 → 100644
View file @ 39475248
<template>
<div>
<span v-if="this.row.id" class="href" @click="goHref(baseVal)">{{ text }}</span>
<span v-else>{{text}}</span>
</div>
</template>
<script>
import helper from "@/services/helper";
import format from "string-format";
export default {
props: ["header", "row", "detailsUrl"],
computed: {
text: function() {
let text = helper.GetProperty(this.row, this.header.prop);
return text;
},
// get row.id value
baseVal: function() {
let baseVal = helper.GetProperty(this.row, "id");
return baseVal;
},
},
methods: {
// Jump routing using id as parameter
goHref(val) {
this.$router.push(this.detailsUrl + val)
}
}
};
</script>
<style scoped>
.href {
color: #264dd9 !important;
cursor: pointer;
}
</style>
\ No newline at end of file
src/pages/index.vue
View file @ 39475248
<template>
<div class="index_container">
<router-view />
<div>
Index
</div>
</template>
<script>
export default {
data: () => ({})
data: () => ({}),
methods: {
}
};
</script>
<style scoped>
.index_container {
height: 100%;
overflow-x: hidden;
overflow-y: auto;
}
</style>
src/pages/table_example.vue 0 → 100644
View file @ 39475248
<template>
<div class="index_container">
<div style="height: 100px"></div>
<ces-table
class="r_yhgl_table"
size="mini"
:headers="headers"
:url="url"
:searchShow="true"
:addRowBtn="addRowBtn"
:isDialog="true"
:isSelection="true"
:isIndex="true"
:confirmOptions="confirmOptions"
:detailsUrl="detailsUrl"
@primary-edit="editItem"
></ces-table>
</div>
</template>
<script>
import cesTable from "@/components/table-um";
export default {
data: () => ({
headers: [
{ label: "服务url", prop: "date", type: "href", align: "left" },
{ label: "服务名称", prop: "name", type: "input", align: "center" },
{ label: "中文名", prop: "address", type: "input", align: "right" },
{
label: "操作",
type: "Button",
align: "center",
btnList: [
{
type: "primary-edit",
label: "编辑",
line: "|"
},
{
type: "primary-del",
label: "删除"
}
]
}
],
url: "",
detailsUrl: "ss/",
addRowBtn: true,
confirmOptions: {
title: "提示", //提示
message: "确认删除该条数据？", //""
btnCancelText: "取消", //取消
btnSubmitText: "确定" //确定
},
}),
components: {
cesTable
},
methods: {
editItem(val) {
console.log(val);
}
}
};
</script>
<style scoped>
.index_container {
height: 100%;
overflow-x: hidden;
overflow-y: auto;
}
</style>
src/router/index.js
View file @ 39475248
......@@ -2,6 +2,7 @@ import Vue from "vue";
import Router from "vue-router";
import Index from "@/pages/index";
Vue.use(Router);
export default new Router({
......@@ -14,6 +15,12 @@ export default new Router({
path: "/index",
name: "index",
component: Index,
}
redirect: "/table_example"
},
{
path: "/table_example", // 表格实例
name: "table_example",
component: () => import("@/pages/table_example")
},
]
});
src/services/helper.js 0 → 100644
View file @ 39475248
module.exports.GetProperty = function (obj, prop) {
if (!obj) return null;
let res = obj;
if (prop) {
let props = prop.split('.');
for (let i = 0; i < props.length; i++) {
res = res[props[i]];
if (typeof res == "undefined" || res == null) {
return null;
}
}
}
return res;
}
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