|
|
@@ -0,0 +1,281 @@
|
|
|
+<template>
|
|
|
+ <div class="container" style="min-height: 100%; padding-bottom: 100px">
|
|
|
+ <el-descriptions title="同步信息">
|
|
|
+ <el-descriptions-item label="机构名称">kooriookami</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="机构简称">18100000000</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="机构组织类型">苏州市</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="部门机构电话">苏州市</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="部门机构地址">
|
|
|
+ <el-tag size="small">学校</el-tag>
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item label="排序号">苏州市</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="是否可用"
|
|
|
+ >江苏省苏州市吴中区吴中大道 1188 号</el-descriptions-item
|
|
|
+ >
|
|
|
+ <el-descriptions-item label="更新时间">苏州市</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="同步时间">苏州市</el-descriptions-item>
|
|
|
+ </el-descriptions>
|
|
|
+ <el-dropdown>
|
|
|
+ <template #dropdown>
|
|
|
+ <el-dropdown-menu>
|
|
|
+ <el-dropdown-item>黄金糕</el-dropdown-item>
|
|
|
+ <el-dropdown-item>狮子头</el-dropdown-item>
|
|
|
+ <el-dropdown-item>螺蛳粉</el-dropdown-item>
|
|
|
+ <el-dropdown-item disabled>双皮奶</el-dropdown-item>
|
|
|
+ <el-dropdown-item divided>蚵仔煎</el-dropdown-item>
|
|
|
+ </el-dropdown-menu>
|
|
|
+ </template>
|
|
|
+ </el-dropdown>
|
|
|
+ <el-descriptions title="补充基础信息"></el-descriptions>
|
|
|
+ <div div-lc-mark>
|
|
|
+ <el-form inline :model="formInline" class="demo-form-inline">
|
|
|
+ <el-form-item label="活动区域">
|
|
|
+ <el-select v-model="formInline.region" placeholder="活动区域">
|
|
|
+ <el-option label="区域一" value="shanghai"></el-option>
|
|
|
+ <el-option label="区域二" value="beijing"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="审批人">
|
|
|
+ <el-input v-model="formInline.user" placeholder="审批人"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <div div-lc-mark>
|
|
|
+ <el-switch
|
|
|
+ v-model="value3"
|
|
|
+ active-text
|
|
|
+ inactive-text="是否自有产权"
|
|
|
+ ></el-switch>
|
|
|
+ <el-switch
|
|
|
+ v-model="value3"
|
|
|
+ active-text
|
|
|
+ inactive-text="是否区域外"
|
|
|
+ ></el-switch>
|
|
|
+ </div>
|
|
|
+ <div div-lc-mark>
|
|
|
+ <el-table :data="tableData" style="width: 100%">
|
|
|
+ <span>Span Element</span>
|
|
|
+ <el-table-column
|
|
|
+ :prop="propItem.prop"
|
|
|
+ :label="propItem.label"
|
|
|
+ v-for="propItem in propList"
|
|
|
+ :key="propItem.prop"
|
|
|
+ >
|
|
|
+ <template v-slot="{ row }">
|
|
|
+ <span v-if="!propItem.component">{{ row[propItem.prop] }}</span>
|
|
|
+ <component
|
|
|
+ v-else
|
|
|
+ v-bind:is="propItem.component"
|
|
|
+ :rowinfo="row"
|
|
|
+ ></component>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ <el-descriptions title="保安"></el-descriptions>
|
|
|
+ <div div-lc-mark>
|
|
|
+ <el-switch
|
|
|
+ v-model="value3"
|
|
|
+ active-text
|
|
|
+ inactive-text="是否有保安"
|
|
|
+ ></el-switch>
|
|
|
+ <span>上传保安证</span>
|
|
|
+ <el-avatar shape="square" :size="50" :src="squareUrl"></el-avatar>
|
|
|
+ <div style="display: inline-block">
|
|
|
+ <el-image
|
|
|
+ style="width: 100px; height: 100px"
|
|
|
+ :src="url4"
|
|
|
+ fit="contain"
|
|
|
+ ></el-image>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div div-lc-mark>
|
|
|
+ <el-descriptions title="业务库设置"></el-descriptions>
|
|
|
+ </div>
|
|
|
+ <div div-lc-mark>
|
|
|
+ <el-form-item label="业务库类型">
|
|
|
+ <el-select v-model="formInline.region" placeholder="活动区域">
|
|
|
+ <el-option label="区域一" value="shanghai"></el-option>
|
|
|
+ <el-option label="区域二" value="beijing"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <span>值守方式</span>
|
|
|
+ <el-radio-group v-model="radio">
|
|
|
+ <el-radio :label="3">同楼异地值守</el-radio>
|
|
|
+ <el-radio :label="6">远程值守</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ <el-switch
|
|
|
+ v-model="value3"
|
|
|
+ active-text
|
|
|
+ inactive-text="业务库出入口远程控制"
|
|
|
+ ></el-switch>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <el-dialog
|
|
|
+ title="提示"
|
|
|
+ v-model="dialogVisible"
|
|
|
+ width="30%"
|
|
|
+ :before-close="handleClose"
|
|
|
+ >
|
|
|
+ <span>这是一段信息</span>
|
|
|
+ <span footer class="dialog-footer">
|
|
|
+ <el-button @click="dialogVisible = false">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="dialogVisible = false"
|
|
|
+ >确 定</el-button
|
|
|
+ >
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+ <div div-lc-mark>
|
|
|
+ <el-descriptions title="在行自助银行设置"></el-descriptions>
|
|
|
+ </div>
|
|
|
+ <div div-lc-mark>
|
|
|
+ <el-switch
|
|
|
+ v-model="value3"
|
|
|
+ active-text
|
|
|
+ inactive-text="是否有在行自助银行"
|
|
|
+ ></el-switch>
|
|
|
+ <span>在行式大堂设备</span>
|
|
|
+ <div style="display: inline-block; width: 200px">
|
|
|
+ <el-input-number
|
|
|
+ v-model="num"
|
|
|
+ controls-position="right"
|
|
|
+ @change="handleChange"
|
|
|
+ :min="1"
|
|
|
+ :max="10"
|
|
|
+ ></el-input-number>
|
|
|
+ </div>
|
|
|
+ <span>在行式穿墙设备</span>
|
|
|
+ <div style="display: inline-block; width: 200px">
|
|
|
+ <el-input-number
|
|
|
+ v-model="num"
|
|
|
+ controls-position="right"
|
|
|
+ @change="handleChange"
|
|
|
+ :min="1"
|
|
|
+ :max="10"
|
|
|
+ ></el-input-number>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div div-lc-mark>
|
|
|
+ <el-table :data="tableData" style="width: 100%">
|
|
|
+ <el-table-column
|
|
|
+ :prop="propItem.prop"
|
|
|
+ :label="propItem.label"
|
|
|
+ v-for="propItem in propList"
|
|
|
+ :key="propItem.prop"
|
|
|
+ >
|
|
|
+ <template v-slot="{ row }">
|
|
|
+ <span v-if="!propItem.component">{{ row[propItem.prop] }}</span>
|
|
|
+ <component
|
|
|
+ v-else
|
|
|
+ v-bind:is="propItem.component"
|
|
|
+ :rowinfo="row"
|
|
|
+ ></component>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ props: [],
|
|
|
+ components: {},
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ dialogVisible: false,
|
|
|
+ formInline: {
|
|
|
+ user: "",
|
|
|
+ region: "",
|
|
|
+ },
|
|
|
+ num: 1,
|
|
|
+ prop: "",
|
|
|
+ propItem: "",
|
|
|
+ propList: [
|
|
|
+ {
|
|
|
+ label: "序号",
|
|
|
+ prop: "name",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "标准",
|
|
|
+ prop: "date",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "达标日期",
|
|
|
+ prop: "address",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "操作",
|
|
|
+ prop: "lc-component",
|
|
|
+ component: "el-button",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ radio: 3,
|
|
|
+ row: "",
|
|
|
+ squareUrl:
|
|
|
+ "https://cube.elemecdn.com/9/c2/f0ee8a3c7c9638a54940382568c9dpng.png",
|
|
|
+ tableData: [
|
|
|
+ {
|
|
|
+ date: "2016-05-02",
|
|
|
+ name: "王小虎",
|
|
|
+ address: "上海市普陀区金沙江路 1518 弄",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ date: "2016-05-04",
|
|
|
+ name: "王小虎",
|
|
|
+ address: "上海市普陀区金沙江路 1517 弄",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ date: "2016-05-01",
|
|
|
+ name: "王小虎",
|
|
|
+ address: "上海市普陀区金沙江路 1519 弄",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ date: "2016-05-03",
|
|
|
+ name: "王小虎",
|
|
|
+ address: "上海市普陀区金沙江路 1516 弄",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ url4: "https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg",
|
|
|
+ value3: true,
|
|
|
+ showValue: "开启预览模式后,点击我显示预设逻辑",
|
|
|
+ showText: "这里的值声明于预设JS代码",
|
|
|
+ };
|
|
|
+ },
|
|
|
+ watch: {},
|
|
|
+ computed: {},
|
|
|
+ beforeCreate() {},
|
|
|
+ created() {},
|
|
|
+ beforeMount() {},
|
|
|
+ mounted() {},
|
|
|
+ beforeUpdate() {},
|
|
|
+ updated() {},
|
|
|
+ destroyed() {},
|
|
|
+ methods: {
|
|
|
+ request() {},
|
|
|
+ handleChange(value) {},
|
|
|
+ handleClose(done) {
|
|
|
+ this.$confirm("确认关闭\uFF1F")
|
|
|
+ .then((_) => {
|
|
|
+ done();
|
|
|
+ })
|
|
|
+ .catch((_) => {});
|
|
|
+ },
|
|
|
+ hello() {
|
|
|
+ alert("来自预设逻辑代码的问候");
|
|
|
+ },
|
|
|
+ },
|
|
|
+ fillter: {},
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+.demo-form-inline {
|
|
|
+}
|
|
|
+.dialog-footer {
|
|
|
+}
|
|
|
+.container {
|
|
|
+}
|
|
|
+</style>
|