no message

src/components/xForm/index.vue

@@ -3,7 +3,7 @@
 -->
 <template>
 	<el-skeleton v-if="renderLoading || Object.keys(form).length==0" animated />
-	<el-form v-else ref="form" :model="form" :label-width="config.labelWidth" :label-position="config.labelPosition" v-loading="loading" element-loading-text="Loading...">
+	<el-form v-else ref="form" :model="form" :label-width="config.labelWidth" :size="config.size || 'default'" :label-position="config.labelPosition" v-loading="loading" element-loading-text="Loading...">
 		<el-row :gutter="15">
 			<template v-for="(item, index) in config.column" :key="index">
 				<el-col :span="item.span || 24" v-if="!hideHandle(item)">

src/components/xTabledialog/index.vue

@@ -0,0 +1,162 @@
+<!--
+ * @Descripttion: 表格窗口
+ * 
+-->
+<template>
+	<div class="x-tabledialog">
+
+		<component :is="componentType" :title="(config.name || titleMap[mode]) || '编辑'" v-model="visible" :size="size" :style="style" @closed="$emit('closed')" width="80%">
+		  <div style="padding:0 6px 6px 6px" class="pagetable">
+		    <xTable 
+		      ref="table" 
+		      :tableColumn="column" 
+		      :name="tablename" 
+		      :params="search" 
+		      api="app/url/lists" 
+		      :row-key="key" 
+		      :remoteSort="true" 
+		      :remoteFilter="true" 
+		      :hideDo="true" 
+		      :hideRefresh="true" 
+		      :hideSetting="true" 
+		      :hidePagination="true" 
+		      :height="contentHeight"
+		      border
+		      stripe>
+
+		  <el-table-column prop="msg" label="msg" width="800" />
+		  <el-table-column prop="id" label="Name" width="180" />
+		  <el-table-column prop="address" label="Address" width="500" />
+
+
+		    </xTable>
+		    </div>
+		    <template #footer>
+		      <el-pagination 
+		        style="float: right;" 
+		        background 
+		        layout="consists,prev,pager,next" 
+		        :total="1000" 
+		        :page-size="100" 
+		        :page-sizes="100" />
+		    </template>
+		</component>
+	</div>
+</template>
+<style scoped>
+	.x-tabledialog /deep/ .el-table th.el-table__cell{
+	  background-color: #f6f8fa;
+	  border-bottom: 1px solid #ebeef5;
+	  color: #333;
+	}
+</style>
+
+<script>
+	export default {
+		emits: ['success', 'closed'],
+		props: {
+			column: { type: Array, default: () => [] },
+			name: { type: String, default: "id" },
+		},
+		data() {
+			return {
+				loading: false,
+				mode: "plus",
+				token: '',
+				key: this.name,
+				titleMap: {
+					plus: '新增',
+					edit: '编辑'
+				},
+				data: {},
+				style: {},
+				config: {
+					column : this.column,
+					labelPosition : "right",
+					labelWidth : "120px",
+					size : "medium",
+					url:'',
+					submitname:'保存'
+				},
+				size:900,
+				visible: true,
+				isSaveing: false,
+				type:'drawer',
+			}
+		},
+		watch: {
+			column(){
+				this.config.column = this.column;
+			}
+		},
+		computed: {
+		    componentType() {
+		      	return this.type == 'drawer' ? 'el-drawer' : 'x-dialog';
+		    },
+		    contentHeight(){
+				return document.documentElement.clientHeight - (this.type == 'drawer' ? '124' : 230);		    	
+		    }
+		},
+		mounted() {
+
+		},
+		methods: {
+			getComponentType(type) {
+			   	this.type = type;
+			   	return this;
+			},
+			// 显示
+			open(mode='plus'){
+				this.mode = mode;
+				this.visible = true;
+				return this;
+			},
+			// 配置
+			setConfig(o){
+				Object.assign(this.config, o);
+				// 远程读取数据
+				if (this.config.remoteurl) {
+					this.loading = true;
+					setTimeout(async ()=>{
+						var res = await this.$http.get(this.config.remoteurl,  {[this.key]: this.data[this.key]})
+						if (res.code == 200 ) {
+
+							this.loading = false;
+							if (res.data.config) {
+								Object.assign(this.config, res.data.config);
+							}
+
+							if (res.data.data) {
+								this.setData(res.data.data);
+							}
+
+							if (res.data.token) {
+								this.token = res.data.token
+							}
+
+							if (res.data.size) {
+								this.size = res.data.size
+							}
+
+							if (res.data.type && res.data.type !== this.type) {
+								this.getComponentType(res.data.type)
+							}
+
+							if (res.data.style) {
+								this.style = res.data.style;
+							}
+							return;
+						}
+						this.$alert(res.message, "提示", {type: 'error'});
+					}, 100)
+					return false;
+				}
+			},
+			// 表单注入数据
+			setData(data){
+				this.data = data;
+				return this;
+			},
+		}
+	}
+</script>

src/views/system/setting/index.vue

@@ -31,13 +31,9 @@
 				</el-tabs>
 			</el-card>
 		</el-main>
-
 		<el-footer>
 			<el-button type="primary" @click="submit" style="max-width: 500px; width: 100%;" :loading="submitloading">保存</el-button>
 		</el-footer>
-
-
-
 	</el-container>
 </template>
 
@@ -65,6 +61,8 @@
 	
 	.setting /deep/ .el-tabs__content{
 		padding: 20px;
+		overflow-y: scroll;
+		height: 100%;
 	}
 
 	.setting /deep/ .el-tabs {

src/views/user/trajectory/index.vue

@@ -50,50 +50,8 @@
     </div>
   </div>
 
-  <x-dialog v-model="dialogVisible" width="80%" title="fdsafa">
+  <xTabledialog v-model="dialogVisible"></xTabledialog>
-    <div style="padding:0 6px 6px 6px" class="pagetable">
-      <xTable 
-        ref="table" 
-        :tableColumn="column" 
-        :name="tablename" 
-        :params="search" 
-        api="app/url/lists" 
-        :row-key="key" 
-        :remoteSort="true" 
-        :remoteFilter="true" 
-        :hideDo="true" 
-        :hideRefresh="true" 
-        :hideSetting="true" 
-        :hidePagination="true" 
-        :height="contentHeight"
-        border
-        stripe>
-
-    <el-table-column prop="msg" label="msg" width="800" />
-    <el-table-column prop="id" label="Name" width="180" />
-    <el-table-column prop="address" label="Address" width="500" />
-
-
-      </xTable>
-      </div>
-      <template #footer>
-        <el-pagination 
-          style="float: right;" 
-          background 
-          layout="consists,prev,pager,next" 
-          :total="1000" 
-          :page-size="100" 
-          :page-sizes="100" />
-      </template>
-  </x-dialog>
 </template>
-<style scoped>
-  .pagetable /deep/ .el-table th.el-table__cell{
-    background-color: #f6f8fa;
-    border-bottom: 1px solid #ebeef5;
-    color: #333;
-  }
-</style>
 
 <script>
 import xMenuItem from '@/components/xMenu/item'
@@ -114,8 +72,8 @@ export default {
       loading: false,
       dialogVisible: true,
       leftType: '',
-      // contentHeight: document.documentElement.clientHeight - 124,
+      contentHeight: document.documentElement.clientHeight - 124,
-      contentHeight: document.documentElement.clientHeight - 230,
+      // contentHeight: document.documentElement.clientHeight - 230,
       info: {},
       leftSides: [
         {

src/x.js

@@ -18,6 +18,7 @@ import xUser from './components/xUser'
 import xAvatar from './components/xAvatar'
 import xUpdate from './components/xUpdate'
 import xTitle from './components/xTitle'
+import xTabledialog from './components/xTabledialog'
 import xForm from './components/xForm'
 import xFormTable from './components/xFormTable'
 import xFilterBar from './components/xFilterBar'
@@ -69,6 +70,7 @@ export default {
         app.component('xSelect', xSelect);
         app.component('xDialog', xDialog);
         app.component('xTitle', xTitle);
+        app.component('xTabledialog', xTabledialog);
         app.component('xWaterMark', xWaterMark);
         app.component('xQrCode', xQrCode);
         app.component('xStatusIndicator', xStatusIndicator);