| | |
| | | |
| | | <el-row :gutter="20"> |
| | | <el-col :span="11" :xs="24"> |
| | | <el-table border v-loading="loading" :data="groupingList" height="350" @selection-change="handleChange"> |
| | | <el-table :data="groupingList" border height="484" v-loading="loading" @row-click="handleChange"> |
| | | <el-table-column :prop="item" :label="item" v-for="(item, index) in table" :key="index" |
| | | :width="columnWidth(item)" align="center"> |
| | | </el-table-column> |
| | | </el-table> |
| | | <!-- <el-table border v-loading="loading" :data="groupingList" height="350" @selection-change="handleChange"> |
| | | <el-table-column type="selection" width="40px" align="center" /> |
| | | <el-table-column label="序号" align="center" prop="newID" width="50px" /> |
| | | <el-table-column label="分组名称" align="center" prop="groupingName" /> |
| | |
| | | <template slot-scope="scope"> |
| | | <dict-tag :options="dict.type.sys_user_sex" :value="scope.row.sex" /> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="套餐名称" align="center" prop="pacName" /> |
| | | <el-table-column label="结算方式" align="center" prop="payType"> |
| | | <template slot-scope="scope"> |
| | | </el-table-column> |
| | | <el-table-column label="套餐名称" align="center" prop="pacName" /> |
| | | <el-table-column label="结算方式" align="center" prop="payType"> |
| | | <template slot-scope="scope"> |
| | | <dict-tag :options="dict.type.reservation_pay_type" :value="scope.row.payType" /> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="折扣" align="center" prop="limits" /> |
| | | <el-table-column label="原价" align="center" prop="price" /> |
| | | <el-table-column label="应收" align="center" prop="ysPrice" /> |
| | | </el-table> |
| | | </el-table-column> |
| | | <el-table-column label="折扣" align="center" prop="limits" /> |
| | | <el-table-column label="原价" align="center" prop="price" /> |
| | | <el-table-column label="应收" align="center" prop="ysPrice" /> |
| | | </el-table> --> |
| | | </el-col> |
| | | <el-col :span="11" :xs="24"> |
| | | <el-table border v-loading="loading" :data="groupingList" height="350"> |
| | | <el-table-column type="selection" width="40px" align="center" /> |
| | | <el-table-column label="序号" align="center" prop="newID" width="50px" /> |
| | | <el-table-column label="分组名称" align="center" prop="groupingName" /> |
| | | <el-table-column label="性别" align="center" prop="sex"> |
| | | <template slot-scope="scope"> |
| | | <dict-tag :options="dict.type.sys_user_sex" :value="scope.row.sex" /> |
| | | </template> |
| | | <el-table :data="xxList" border height="484" v-loading="loading" @row-click="handleChange"> |
| | | <el-table-column :prop="item" :label="item" v-for="(item, index) in xxtable" :key="index" |
| | | :width="columnWidths(item)" align="center"> |
| | | </el-table-column> |
| | | <el-table-column label="套餐名称" align="center" prop="pacName" /> |
| | | <el-table-column label="结算方式" align="center" prop="payType"> |
| | | <template slot-scope="scope"> |
| | | <dict-tag :options="dict.type.reservation_pay_type" :value="scope.row.payType" /> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="折扣" align="center" prop="limits" /> |
| | | <el-table-column label="原价" align="center" prop="price" /> |
| | | <el-table-column label="应收" align="center" prop="ysPrice" /> |
| | | </el-table> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | <el-table border v-loading="loading" :data="groupingList" height="350"> |
| | | <el-table-column type="selection" width="40px" align="center" /> |
| | | <el-table-column label="序号" align="center" prop="newID" width="50px" /> |
| | | <el-table-column label="分组名称" align="center" prop="groupingName" /> |
| | | <el-table-column label="性别" align="center" prop="sex"> |
| | | <template slot-scope="scope"> |
| | | <dict-tag :options="dict.type.sys_user_sex" :value="scope.row.sex" /> |
| | | </template> |
| | | <el-table :data="groupingList" border height="484" v-loading="loading"> |
| | | <el-table-column :prop="item" :label="item" v-for="(item, index) in table" :key="index" |
| | | :width="columnWidth(item)" align="center"> |
| | | </el-table-column> |
| | | <el-table-column label="套餐名称" align="center" prop="pacName" /> |
| | | <el-table-column label="结算方式" align="center" prop="payType"> |
| | | <template slot-scope="scope"> |
| | | <dict-tag :options="dict.type.reservation_pay_type" :value="scope.row.payType" /> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="折扣" align="center" prop="limits" /> |
| | | <el-table-column label="原价" align="center" prop="price" /> |
| | | <el-table-column label="应收" align="center" prop="ysPrice" /> |
| | | </el-table> |
| | | </div> |
| | | |
| | |
| | | return { |
| | | loading: false, |
| | | tjStatus: 0, |
| | | groupingList: [ |
| | | { |
| | | price: 10 |
| | | } |
| | | ], |
| | | groupingList: [], |
| | | xxList: [], |
| | | table: [], |
| | | xxtable: [], |
| | | queryParams: { |
| | | tjh: null, |
| | | tblx: "jy", |
| | | tblx: "", |
| | | }, |
| | | forms: { |
| | | tjNum: null, |
| | |
| | | }, |
| | | created() { |
| | | // this.handleManual(); |
| | | if(this.tjStatus == 0){ |
| | | this.queryParams.tblx = "jy" |
| | | } |
| | | }, |
| | | methods: { |
| | | radioChange(value) { |
| | |
| | | } else if (value == 1) { |
| | | this.queryParams.tblx = "jc" |
| | | } |
| | | |
| | | this.resetQuery() |
| | | }, |
| | | handleManual() { |
| | | shoudongtbjyjcwsxmjg(this.queryParams).then(res => { |
| | |
| | | }) |
| | | }, |
| | | resetQuery() { |
| | | this.resetForm("queryForm"); |
| | | this.queryParams.tjh = null |
| | | this.groupingList = []; |
| | | this.table = []; |
| | | this.xxList = []; |
| | | this.xxtable = []; |
| | | }, |
| | | |
| | | idFn1(value) { |
| | |
| | | console.log(value) |
| | | } |
| | | }, |
| | | |
| | | |
| | | handleQuery() { |
| | | this.loading = true |
| | | chaxunjyjcwsxmjg(this.queryParams).then(res => { |
| | | this.groupingList = res.data |
| | | this.loading = false |
| | | var array = [] |
| | | for (var i = 0; i < this.groupingList.length; i++) { |
| | | array = Object.keys(this.groupingList[i]); |
| | | let reg = /[\u4E00-\u9FA5\uF900-\uFA2D]/ |
| | | |
| | | array.forEach((element, index) => { |
| | | if (reg.test(element)) { |
| | | this.table.push(element) |
| | | } |
| | | }); |
| | | |
| | | this.table.sort(function (a, b) { |
| | | const numA = parseInt(a.match(/\d+/)[0], 10); |
| | | const numB = parseInt(b.match(/\d+/)[0], 10); |
| | | return numA - numB; |
| | | }); |
| | | return i + 1; |
| | | } |
| | | }) |
| | | }, |
| | | handleChange(selection) { |
| | | |
| | | columnWidth(item) { |
| | | const arr = this.groupingList.map((x) => x[item]); |
| | | if (arr.length > 0) { |
| | | arr.push(item); |
| | | return this.getMaxLength(arr) + 20 + "px"; |
| | | } |
| | | return 20 + "px"; |
| | | }, |
| | | |
| | | columnWidths(item) { |
| | | const arr = this.groupingList.map((x) => x[item]); |
| | | if (arr.length > 0) { |
| | | arr.push(item); |
| | | return this.getMaxLength(arr) + 100 + "px"; |
| | | } |
| | | return 100 + "px"; |
| | | }, |
| | | getMaxLength(arr) { |
| | | return arr.reduce((acc, item) => { |
| | | if (item) { |
| | | const calcLen = this.getTextWidth(item); |
| | | if (acc < calcLen) { |
| | | acc = calcLen; |
| | | } |
| | | } |
| | | return acc; |
| | | }, 0); |
| | | }, |
| | | getTextWidth(str) { |
| | | let width = 0; |
| | | const html = document.createElement("span"); |
| | | html.innerText = str; |
| | | html.className = "getTextWidth"; |
| | | document.querySelector("body").appendChild(html); |
| | | width = document.querySelector(".getTextWidth").offsetWidth; |
| | | document.querySelector(".getTextWidth").remove(); |
| | | return width; |
| | | }, |
| | | handleChange(rowData, columnName) { |
| | | this.xxList = rowData.jybgd |
| | | var array = [] |
| | | for (var i = 0; i < this.xxList.length; i++) { |
| | | array = Object.keys(this.xxList[i]); |
| | | let reg = /[\u4E00-\u9FA5\uF900-\uFA2D]/ |
| | | array.forEach((element, index) => { |
| | | if (reg.test(element)) { |
| | | this.xxtable.push(element) |
| | | } |
| | | }); |
| | | this.xxtable.sort(function (a, b) { |
| | | const numA = parseInt(a.match(/\d+/)[0], 10); |
| | | const numB = parseInt(b.match(/\d+/)[0], 10); |
| | | return numA - numB; |
| | | }); |
| | | return i + 1; |
| | | } |
| | | } |
| | | |
| | | } |
| | | }; |
| | | </script> |