From 15c2636bb7cd4ae729c1cfd4c11f1324a9cd04f1 Mon Sep 17 00:00:00 2001 From: yangfeng <wanwan926_4@163.com> Date: 星期五, 01 三月 2024 18:21:09 +0800 Subject: [PATCH] 生丝定级标准列表组件开发、router配置、menu修改 --- src/views/systemSetting/silkStandardSetting/index.vue | 130 +++++++++++++++++++++++++++++++++++++++++-- 1 files changed, 124 insertions(+), 6 deletions(-) diff --git a/src/views/systemSetting/silkStandardSetting/index.vue b/src/views/systemSetting/silkStandardSetting/index.vue index 7584acc..43fb89c 100644 --- a/src/views/systemSetting/silkStandardSetting/index.vue +++ b/src/views/systemSetting/silkStandardSetting/index.vue @@ -1,21 +1,139 @@ <template> - <div class="container"></div> + <div class="silkStandardSetting-container"> + <div class="filter-card"> + <CommonSearch :show-add="false" :amount-view="false" placeholder="璇疯緭鍏ュ叧閿瘝" @searchClick="onFilterSearch"> + <template slot="leftButton"> + <el-button size="small" type="primary" @click="addBtnClick">鏂板</el-button> + <el-button size="small" type="primary" @click="refreshClick">鍒锋柊</el-button> + <el-button size="small" type="primary" @click="printClick">鎵撳嵃</el-button> + </template> + </CommonSearch> + </div> + <div class="body-card"> + <div class="edit-save"> + <div class="edit-save-icon" @click="editSaveClick"> + <i :class="isEdit ? 'el-icon-unlock' : 'el-icon-lock'"></i> + </div> + <div class="edit-sace-label">{{ isEdit ? "閿佸畾淇濆瓨" : "鐣岄潰璁捐" }}</div> + </div> + <div> + <SilkTableList + :detail-enter="isEdit" + :silk-table-list="silkTableList" + @inputContent="inputContent" + @addProjectClick="addBtnClick" + @clearupProject="clearupProject" + @deleteClick="clearupProject" + > + </SilkTableList> + </div> + </div> + </div> </template> <script> +import SilkTableList from "@/views/systemSetting/silkStandardSetting/components/silkTableList" export default { name: "silkStandardSetting", props: {}, - components: {}, + components: { SilkTableList }, mixins: [], computed: {}, data() { - return {} + return { + isEdit: false, + silkTableList: {}, + tableData: [] + } }, - created() {}, - methods: {} + created() { + this.setTableForm() + }, + methods: { + setTableForm() { + this.silkTableList = { + tableData: this.tableData, + isReturn: false, + tableColumn: [ + { label: "妫�鏌ラ」鐩悕绉�", prop: "projectName", projectName: true }, + { label: "寮�濮嬬氦搴�", prop: "start", inputFloat: true }, + { label: "缁撴潫绾ゅ害", prop: "end", inputFloat: true }, + { label: "閲庣氦", prop: "price1", inputFloat: true }, + { label: "澶ч噹", prop: "price2", inputFloat: true }, + { label: "鐗归噹", prop: "price3", inputFloat: true } + ] + } + }, + // 鎼滅储 + onFilterSearch(searchText) { + console.log(searchText) + }, + // 鏂板 + addBtnClick() { + this.tableData.push({ + projectName: "", + start: 0, + end: 0, + price1: 0, + price2: 0, + price3: 0 + }) + }, + // 鍒锋柊 + refreshClick() {}, + // 鎵撳嵃 + printClick() {}, + // 鍒楄〃杈撳叆鍥炶皟 + inputContent(val, prop, row) { + console.log(val, prop, row) + }, + // 鍒犻櫎 + clearupProject(data, index) { + console.log(data) + this.tableData.splice(index, 1) + }, + // 淇濆瓨缂栬緫鎸夐挳鍒囨崲 + editSaveClick() { + this.isEdit = !this.isEdit + } + } } </script> <!-- Add "scoped" attribute to limit CSS to this component only --> -<style lang="scss" scoped></style> +<style lang="scss" scoped> +.silkStandardSetting-container { + height: 100%; + .filter-card { + margin: 20px 30px; + height: 80px; + display: flex; + align-items: center; + padding: 0 20px 0 20px; + border-radius: 4px; + background-color: #fff; + } + .body-card { + margin: 0 30px; + background-color: #fff; + padding: 10px 15px; + height: calc(100% - 180px); + border-radius: 4px; + .edit-save { + display: flex; + align-items: center; + margin-bottom: 10px; + .edit-save-icon { + font-size: 24px; + color: #5582f3; + cursor: pointer; + } + .edit-sace-label { + margin-left: 10px; + font-size: 14px; + color: #000000d8; + } + } + } +} +</style> -- Gitblit v1.8.0