| | |
| | | <template> |
| | | <basic-container> |
| | | <avue-crud |
| | | ref="userCrud" |
| | | :data="tableData" |
| | | :option="option" |
| | | :table-loading="tableLoading" |
| | | @on-load="getTableList" |
| | | @refresh-change="handleRefresh" |
| | | @search-change="handleSearch" |
| | | @search-reset="handleReset" |
| | | @selection-change="selectChange" |
| | | @row-click="rowClickHandler" |
| | | > |
| | | <el-container> |
| | | <el-main> |
| | | <basic-container> |
| | | <avue-crud |
| | | ref="userCrud" |
| | | :data="tableData" |
| | | :option="option" |
| | | :table-loading="tableLoading" |
| | | @on-load="getTableList" |
| | | @refresh-change="handleRefresh" |
| | | @search-change="handleSearch" |
| | | @search-reset="handleReset" |
| | | @selection-change="selectChange" |
| | | @row-click="rowClickHandler" |
| | | > |
| | | |
| | | <template slot="menuLeft" slot-scope="scope"> |
| | | <el-button icon="el-icon-plus" size="small" type="primary" @click="rowSaveHandlerClick">å建</el-button> |
| | | <el-button icon="el-icon-delete" plain size="small" type="danger" @click="allDelHandler">å é¤</el-button> |
| | | <el-button icon="el-icon-view" plain size="small" type="primary" @click="chekView">æ¥ç使ç¨èå´</el-button> |
| | | <el-button icon="el-icon-download" plain size="small" type="primary" @click="downloadTemplateHandler">ä¸è½½å¯¼å
¥æ¨¡æ¿ |
| | | </el-button> |
| | | <el-button icon="el-icon-download" plain size="small" type="primary" @click="downloadHandler">导åº</el-button> |
| | | <el-button icon="el-icon-upload2" plain size="small" type="primary" @click="uploadUser">导å
¥</el-button> |
| | | </template> |
| | | <template slot="menuLeft" slot-scope="scope"> |
| | | <el-button icon="el-icon-plus" size="small" type="primary" @click="rowSaveHandlerClick">å建</el-button> |
| | | <el-button icon="el-icon-delete" plain size="small" type="danger" @click="allDelHandler">å é¤</el-button> |
| | | <el-button icon="el-icon-view" plain size="small" type="primary" @click="chekView">æ¥ç使ç¨èå´</el-button> |
| | | <el-button icon="el-icon-download" plain size="small" type="primary" @click="downloadTemplateHandler">ä¸è½½å¯¼å
¥æ¨¡æ¿ |
| | | </el-button> |
| | | <el-button icon="el-icon-download" plain size="small" type="primary" @click="downloadHandler">导åº</el-button> |
| | | <el-button icon="el-icon-upload2" plain size="small" type="primary" @click="uploadUser">导å
¥</el-button> |
| | | </template> |
| | | |
| | | <template slot="menu" slot-scope="scope"> |
| | | <el-button icon="el-icon-edit" size="small" type="text" @click="editBtnClick(scope.row)">ç¼è¾ |
| | | </el-button> |
| | | <el-button icon="el-icon-delete" size="small" type="text" @click="rowDeleteHandler(scope.row)">å é¤ |
| | | </el-button> |
| | | </template> |
| | | <template slot="menu" slot-scope="scope"> |
| | | <el-button icon="el-icon-edit" size="small" type="text" @click="editBtnClick(scope.row)">ç¼è¾ |
| | | </el-button> |
| | | <el-button icon="el-icon-delete" size="small" type="text" @click="rowDeleteHandler(scope.row)">å é¤ |
| | | </el-button> |
| | | </template> |
| | | |
| | | </avue-crud> |
| | | <!-- å建ç¼è¾èªå®ä¹å¯¹è¯æ¡ --> |
| | | <el-dialog |
| | | v-dialogDrag |
| | | v-loading="dialogLoading" |
| | | :title="dialogType === 'add' ? ' å建' : 'ç¼è¾'" |
| | | :visible.sync="dialogVisible" |
| | | append-to-body="true" |
| | | class="avue-dialog" |
| | | width="70%" |
| | | @close="dialogClose" |
| | | > |
| | | <el-form ref="form" :model="form" :rules="rules" label-width="80px"> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="åç§°ï¼" prop="id"> |
| | | <el-input v-model="form.id"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="æ ç¾ï¼"> |
| | | <el-input v-model="form.name"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="ç±»åï¼"> |
| | | <el-select v-model="form.enumValueDataType" placeholder="è¯·éæ©ç±»å"> |
| | | <el-option label="String" value="String"></el-option> |
| | | <el-option label="Integer" value="Integer"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="é¿åº¦ï¼"> |
| | | <el-input-number v-model="form.length" :max="999" :min="1" label="æè¿°æå"></el-input-number> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <avue-crud |
| | | ref="dialogCrud" |
| | | :data="dialogData" |
| | | :option="dialogOption" |
| | | @row-save="rowSaveDialogHandler" |
| | | @row-update="rowUpdateDialogHandler" |
| | | @row-del="rowDeleteDialogHandler" |
| | | > |
| | | </avue-crud> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | </avue-crud> |
| | | <!-- å建ç¼è¾èªå®ä¹å¯¹è¯æ¡ --> |
| | | <el-dialog |
| | | v-dialogDrag |
| | | v-loading="dialogLoading" |
| | | :title="dialogType === 'add' ? ' å建' : 'ç¼è¾'" |
| | | :visible.sync="dialogVisible" |
| | | append-to-body="true" |
| | | class="avue-dialog" |
| | | width="70%" |
| | | @close="dialogClose" |
| | | > |
| | | <el-form ref="form" :model="form" :rules="rules" label-width="80px"> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="åç§°ï¼" prop="id"> |
| | | <el-input v-model="form.id"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="æ ç¾ï¼"> |
| | | <el-input v-model="form.name"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="ç±»åï¼"> |
| | | <el-select v-model="form.enumValueDataType" placeholder="è¯·éæ©ç±»å"> |
| | | <el-option label="String" value="String"></el-option> |
| | | <el-option label="Integer" value="Integer"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="é¿åº¦ï¼"> |
| | | <el-input-number v-model="form.length" :max="999" :min="1" label="æè¿°æå"></el-input-number> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <avue-crud |
| | | ref="dialogCrud" |
| | | :data="dialogData" |
| | | :option="dialogOption" |
| | | @row-save="rowSaveDialogHandler" |
| | | @row-update="rowUpdateDialogHandler" |
| | | @row-del="rowDeleteDialogHandler" |
| | | > |
| | | </avue-crud> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | |
| | | <span slot="footer" class="dialog-footer"> |
| | | <span slot="footer" class="dialog-footer"> |
| | | <el-button type="primary" @click="rowSaveHandler">ç¡® å®</el-button> |
| | | <el-button @click="dialogVisible = false">å æ¶</el-button> |
| | | </span> |
| | | </el-dialog> |
| | | </el-dialog> |
| | | |
| | | <!-- æ¥ç使ç¨èå´ --> |
| | | <el-dialog |
| | | v-dialogDrag |
| | | v-loading="checkViewLoading" |
| | | :visible.sync="checkViewVisible" |
| | | append-to-body="true" |
| | | class="avue-dialog" |
| | | title="æ¥ç使ç¨èå´" |
| | | width="70%" |
| | | > |
| | | <avue-crud |
| | | ref="checkViewCrud" |
| | | :data="checkViewData" |
| | | :option="checkViewOption" |
| | | @search-change="checkHandleSearch" |
| | | @search-reset="checkHandleReset" |
| | | > |
| | | <!-- æ¥ç使ç¨èå´ --> |
| | | <el-dialog |
| | | v-dialogDrag |
| | | v-loading="checkViewLoading" |
| | | :visible.sync="checkViewVisible" |
| | | append-to-body="true" |
| | | class="avue-dialog" |
| | | title="æ¥ç使ç¨èå´" |
| | | width="70%" |
| | | > |
| | | <avue-crud |
| | | ref="checkViewCrud" |
| | | :data="checkViewData" |
| | | :option="checkViewOption" |
| | | @search-change="checkHandleSearch" |
| | | @search-reset="checkHandleReset" |
| | | > |
| | | |
| | | </avue-crud> |
| | | </el-dialog> |
| | | </avue-crud> |
| | | </el-dialog> |
| | | |
| | | <!--导å
¥ --> |
| | | <upload-file ref="upload" :fileType="upFileType" :fileUrl="fileUrl" :tipList="tipList" title="导å
¥" |
| | | @updata="getTableList"></upload-file> |
| | | </basic-container> |
| | | <!--导å
¥ --> |
| | | <upload-file ref="upload" :fileType="upFileType" :fileUrl="fileUrl" :tipList="tipList" title="导å
¥" |
| | | @updata="getTableList"></upload-file> |
| | | </basic-container> |
| | | </el-main> |
| | | |
| | | <el-aside width="30%"> |
| | | <basic-container> |
| | | <el-descriptions :column="1" border size="medium" style="margin-bottom: 20px" title="æä¸¾ä¿¡æ¯"> |
| | | <el-descriptions-item> |
| | | <template slot="label"> |
| | | åç§° |
| | | </template> |
| | | {{ this.lastItem.id }} |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template slot="label"> |
| | | æ ç¾ |
| | | </template> |
| | | {{ this.lastItem.name }} |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template slot="label"> |
| | | ç±»å |
| | | </template> |
| | | {{ this.lastItem.enumValueDataType || 'String' }} |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template slot="label"> |
| | | é¿åº¦ |
| | | </template> |
| | | <el-tag> {{ this.lastItem.length || 50 }}</el-tag> |
| | | </el-descriptions-item> |
| | | |
| | | </el-descriptions> |
| | | |
| | | <p style="font-weight: bold">æä¸¾é¡¹</p> |
| | | <avue-crud |
| | | :data="asideData" |
| | | :option="asideOption" |
| | | > |
| | | </avue-crud> |
| | | </basic-container> |
| | | </el-aside> |
| | | </el-container> |
| | | </template> |
| | | |
| | | <script> |
| | |
| | | name: "index", |
| | | data() { |
| | | return { |
| | | asideOption: { |
| | | ...basicOption, |
| | | addBtn: false, |
| | | editBtn: false, |
| | | menu: false, |
| | | refreshBtn: false, |
| | | selection: false, |
| | | index: false, |
| | | column: [ |
| | | { |
| | | label: 'æä¸¾é¡¹åç§°', |
| | | prop: 'name', |
| | | sortable: true, |
| | | }, |
| | | { |
| | | label: 'æä¸¾å¼', |
| | | prop: 'value', |
| | | sortable: true, |
| | | }, |
| | | { |
| | | label: 'æè¿°', |
| | | prop: 'description', |
| | | }, |
| | | ] |
| | | }, |
| | | tipList: [ |
| | | "导å
¥æ¨¡æ¿ä¸æ æçº¢è²åä½ç为å¿
è¾é¡¹", |
| | | "*注æ*:第äºè¡å¼å§çæ°æ®ä¸ºç¤ºä¾æ°æ®ï¼å¯¼å
¥å请å°å
¶å é¤ï¼å½å¯¼å
¥çæä¸¾ä¸å
·å¤å¤ä¸ªæä¸¾é¡¹æ¶ï¼åºæç
§ç¤ºä¾enum2çåæ³", |
| | |
| | | searchParams: {} |
| | | } |
| | | }, |
| | | computed: { |
| | | lastItem() { |
| | | return this.selectList.length > 0 ? this.selectList[this.selectList.length - 1] : {}; |
| | | }, |
| | | asideData() { |
| | | return this.selectList.length > 0 ? this.selectList[this.selectList.length - 1].items : []; |
| | | } |
| | | }, |
| | | methods: { |
| | | //è¡¨æ ¼æ¥è¯¢è¯·æ± |
| | | getTableList() { |
| | |
| | | |
| | | // éæ©æ¡ |
| | | selectChange(row) { |
| | | console.log(row) |
| | | this.selectList = row; |
| | | }, |
| | | |