|
|
@@ -216,6 +216,15 @@
|
|
|
</div>
|
|
|
</template>
|
|
|
</el-table-column> -->
|
|
|
+ <!-- <el-table-column label="预览"
|
|
|
+ align="center"
|
|
|
+ prop="sound">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>
|
|
|
+ <el-button type="text">预览</el-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column> -->
|
|
|
</el-table>
|
|
|
<div class="floor">
|
|
|
<div class="remove"
|
|
|
@@ -279,6 +288,53 @@
|
|
|
v-if="teamStatus != 'teamAudit'"
|
|
|
@click="submitInfo(2)">提交</div>
|
|
|
</div>
|
|
|
+ <el-dialog title="乐团预览"
|
|
|
+ :visible.sync="previewVisible">
|
|
|
+ <div class="baseRight">
|
|
|
+ <header>乐团注册</header>
|
|
|
+ <div class="section">
|
|
|
+ <h2 class="title line_bottom">课程</h2>
|
|
|
+ <p class="indate line_bottom"
|
|
|
+ key="indate-price">有效期至：2019年9月1号 <span>现价:￥580</span></p>
|
|
|
+
|
|
|
+ <div class="options"
|
|
|
+ key="class-list">
|
|
|
+ <div class="option">
|
|
|
+ <div class="0_hd"><i class="check_default check_active"></i></div>
|
|
|
+ <div class="o_bd">乐团声部训练</div>
|
|
|
+ </div>
|
|
|
+ <div class="option">
|
|
|
+ <div class="0_hd"><i class="check_default check_active"></i></div>
|
|
|
+ <div class="o_bd">乐团合奏训练</div>
|
|
|
+ </div>
|
|
|
+ <div class="option">
|
|
|
+ <div class="0_hd"><i class="check_default check_active"></i></div>
|
|
|
+ <div class="o_bd">基础技能训练</div>
|
|
|
+ </div>
|
|
|
+ <div class="option">
|
|
|
+ <div class="0_hd"><i class="check_default check_active"></i></div>
|
|
|
+ <div class="o_bd">假期集中训练</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="coutInfo">
|
|
|
+ <i class="trumpet_icon"></i>年度安排十个月训练，共计168课时，120元/课时，原价20160元，现仅支付560元/月（约合34.5元/课时）
|
|
|
+ </div>
|
|
|
+ <div class="buy">
|
|
|
+ <div class="price">
|
|
|
+ <p class="oldprice">
|
|
|
+ <del class="text">原价</del>
|
|
|
+ <del>{{ }}￥</del>
|
|
|
+ </p>
|
|
|
+ <p class="now_price">
|
|
|
+ <span class="text">仅需支付</span>
|
|
|
+ <span>{{}}￥</span>
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ <a>购买</a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
@@ -288,6 +344,7 @@ export default {
|
|
|
name: 'teamSoundMoney',
|
|
|
data () {
|
|
|
return {
|
|
|
+ previewVisible: false, // 乐团预览
|
|
|
dialogTableVisible: false,
|
|
|
soundList: [],
|
|
|
soundLists: [], // 存储选中项的声部id 记录变量
|
|
|
@@ -307,14 +364,129 @@ export default {
|
|
|
},
|
|
|
created () {
|
|
|
// 判断是否带缓存参数
|
|
|
- if (this.$route.query.search) {
|
|
|
- this.Fsearch = this.$route.query.search;
|
|
|
- }
|
|
|
- if (this.$route.query.rules) {
|
|
|
- this.Frules = this.$route.query.rules
|
|
|
- }
|
|
|
+
|
|
|
+ },
|
|
|
+ activated () {
|
|
|
+ // 判断是否带缓存参
|
|
|
+ this.init();
|
|
|
},
|
|
|
methods: {
|
|
|
+ init () {
|
|
|
+ if (this.$route.query.search) {
|
|
|
+ this.Fsearch = this.$route.query.search;
|
|
|
+ }
|
|
|
+ if (this.$route.query.rules) {
|
|
|
+ this.Frules = this.$route.query.rules
|
|
|
+ }
|
|
|
+ getSoundTree().then(res => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.soundList = res.data.rows;
|
|
|
+ // // 生成动态的checkList
|
|
|
+ for (let key in this.soundList) {
|
|
|
+ this.$set(this.soundLists, key, [])
|
|
|
+ }
|
|
|
+ // 新建团带默认的数据 this.topfor.section
|
|
|
+ if (this.teamStatus == 'newTeam') {
|
|
|
+ getDefaultSubject({ chargeTypeId: type, organId: this.topfor.section, number: 1 }).then(res => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.activeSoundList = res.data.map(item => {
|
|
|
+ // this.soundLists[0].push(item.subjectId)
|
|
|
+ let obj = { 'id': item.id, 'sound': item.name, 'jihua': item.expectedStudentNum, 'yuji': item.fee, 'zhonglei': [], 'fangshi': item.kitGroupPurchaseType, 'fangshiprice': item.depositFee, 'jiaopu': '', 'type': 1, 'typeVisible': false, 'provideVisible': false, 'markVisible': false, 'goodsList': [], 'markList': [], 'markChioseList': [] }
|
|
|
+ // this.checkinlist(obj);
|
|
|
+ return obj;
|
|
|
+ })
|
|
|
+ // = arr;
|
|
|
+ this.soundList.forEach((item, i) => {
|
|
|
+ item.subjects.forEach((some, j) => {
|
|
|
+ res.data.forEach((sub, x) => {
|
|
|
+ if (sub.id == some.id) {
|
|
|
+ this.soundLists[i].push(some.id)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+ // 并且把所有soundLists 里面
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ // 修改带原有团的数据
|
|
|
+ if (this.teamStatus == 'teamDraft' || this.teamStatus == 'teamAudit') {
|
|
|
+ // 获取第二页的数据
|
|
|
+ this.teamid = this.$route.query.id;
|
|
|
+ findMusicGroupSubjectInfo({ musicGroupId: this.teamid }).then(res => {
|
|
|
+ if (res.code == 200) {
|
|
|
+
|
|
|
+ this.activeSoundList = res.data.musicGroupSubjectPlans.map(item => {
|
|
|
+ // this.soundLists[0].push(item.subjectId)
|
|
|
+ let obj = { 'id': item.subjectId, 'sound': item.subName, 'jihua': item.expectedStudentNum, 'yuji': item.fee, 'zhonglei': [], 'fangshi': item.kitGroupPurchaseType, 'fangshiprice': item.depositFee, 'jiaopu': '', 'type': 1, 'typeVisible': false, 'provideVisible': false, 'markVisible': false, 'goodsList': [], 'markList': [], 'markChioseList': [] }
|
|
|
+ this.checkinlist(obj)
|
|
|
+ return obj;
|
|
|
+ })
|
|
|
+ // this.activeSoundList = arr;
|
|
|
+ // 这里.....
|
|
|
+ this.soundList.forEach((item, i) => {
|
|
|
+ item.subjects.forEach((some, j) => {
|
|
|
+ this.activeSoundList.forEach((sub, x) => {
|
|
|
+ if (sub.id == some.id) {
|
|
|
+ this.soundLists[i].push(some.id)
|
|
|
+ // this.checkinlist(some)
|
|
|
+ // this.activeSoundList.push(some)
|
|
|
+ // 这里点击勾选
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+ // 循环列表里的声部 拿取商品
|
|
|
+ for (let i in this.activeSoundList) {
|
|
|
+ for (let j in res.data.musicGroupSubjectGoodsGroups) {
|
|
|
+ if (this.activeSoundList[i].id == res.data.musicGroupSubjectGoodsGroups[j].subjectId) {
|
|
|
+ //
|
|
|
+ if (res.data.musicGroupSubjectGoodsGroups[j].type == 'INSTRUMENT') {
|
|
|
+ this.activeSoundList[i].zhonglei = this.activeSoundList[i].zhonglei.concat(res.data.musicGroupSubjectGoodsGroups[j].goodsIdList)
|
|
|
+ this.activeSoundList[i].zhonglei = this.activeSoundList[i].zhonglei.map(item => {
|
|
|
+ return parseInt(item);
|
|
|
+ })
|
|
|
+
|
|
|
+ this.activeSoundList[i].goodsList = this.activeSoundList[i].goodsList.concat(res.data.musicGroupSubjectGoodsGroups[j].goodsList);
|
|
|
+
|
|
|
+ // goodsList
|
|
|
+
|
|
|
+ }
|
|
|
+ // 拿辅件
|
|
|
+ if (res.data.musicGroupSubjectGoodsGroups[j].type == 'ACCESSORIES') {
|
|
|
+ if (res.data.musicGroupSubjectGoodsGroups[j].goodsList.length >= 0) {
|
|
|
+ this.activeSoundList[i].markList ? this.activeSoundList[i].markList : this.activeSoundList[i].markList = []
|
|
|
+ let obj = {};
|
|
|
+ obj.goods = res.data.musicGroupSubjectGoodsGroups[j].goodsIdList.split(',');
|
|
|
+ obj.goods = obj.goods.map(item => {
|
|
|
+ return parseInt(item);
|
|
|
+ })
|
|
|
+ obj.name = res.data.musicGroupSubjectGoodsGroups[j].name
|
|
|
+ obj.price = res.data.musicGroupSubjectGoodsGroups[j].price;
|
|
|
+ this.activeSoundList[i].markList.push(obj);
|
|
|
+ // this.activeSoundList[i].markList.goodsList.goods = JSON.parse(res.data.musicGroupSubjectGoodsGroups[j].goodsIdList)
|
|
|
+ this.activeSoundList[i].markChioseList = this.activeSoundList[i].markChioseList.concat(res.data.musicGroupSubjectGoodsGroups[j].goodsList);
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ })
|
|
|
+ // 拿到刚才的存储的信息
|
|
|
+ this.payfor = this.$store.getters.payList;
|
|
|
+ this.topfor = this.$store.getters.topinfo;
|
|
|
+ this.checkfor = this.$store.getters.checkinfo;
|
|
|
+ let type = this.topfor.type;
|
|
|
+ // 判断进来的乐团状态
|
|
|
+ this.teamStatus = this.$route.query.type;
|
|
|
+ },
|
|
|
// 改变checkbox
|
|
|
changeList (e) {
|
|
|
// console.log(e)
|
|
|
@@ -728,115 +900,7 @@ export default {
|
|
|
// }
|
|
|
},
|
|
|
mounted () {
|
|
|
- getSoundTree().then(res => {
|
|
|
- if (res.code == 200) {
|
|
|
- this.soundList = res.data.rows;
|
|
|
- // // 生成动态的checkList
|
|
|
- for (let key in this.soundList) {
|
|
|
- this.$set(this.soundLists, key, [])
|
|
|
- }
|
|
|
- // 新建团带默认的数据 this.topfor.section
|
|
|
- if (this.teamStatus == 'newTeam') {
|
|
|
- getDefaultSubject({ chargeTypeId: type, organId: this.topfor.section, number: 1 }).then(res => {
|
|
|
- if (res.code == 200) {
|
|
|
- this.activeSoundList = res.data.map(item => {
|
|
|
- // this.soundLists[0].push(item.subjectId)
|
|
|
- let obj = { 'id': item.id, 'sound': item.name, 'jihua': item.expectedStudentNum, 'yuji': item.fee, 'zhonglei': [], 'fangshi': item.kitGroupPurchaseType, 'fangshiprice': item.depositFee, 'jiaopu': '', 'type': 1, 'typeVisible': false, 'provideVisible': false, 'markVisible': false, 'goodsList': [], 'markList': [], 'markChioseList': [] }
|
|
|
- // this.checkinlist(obj);
|
|
|
- return obj;
|
|
|
- })
|
|
|
- // = arr;
|
|
|
- this.soundList.forEach((item, i) => {
|
|
|
- item.subjects.forEach((some, j) => {
|
|
|
- res.data.forEach((sub, x) => {
|
|
|
- if (sub.id == some.id) {
|
|
|
- this.soundLists[i].push(some.id)
|
|
|
- }
|
|
|
- })
|
|
|
- })
|
|
|
- })
|
|
|
- // 并且把所有soundLists 里面
|
|
|
- }
|
|
|
- });
|
|
|
- }
|
|
|
- // 修改带原有团的数据
|
|
|
- if (this.teamStatus == 'teamDraft' || this.teamStatus == 'teamAudit') {
|
|
|
- // 获取第二页的数据
|
|
|
- this.teamid = this.$route.query.id;
|
|
|
- findMusicGroupSubjectInfo({ musicGroupId: this.teamid }).then(res => {
|
|
|
- if (res.code == 200) {
|
|
|
-
|
|
|
- this.activeSoundList = res.data.musicGroupSubjectPlans.map(item => {
|
|
|
- // this.soundLists[0].push(item.subjectId)
|
|
|
- let obj = { 'id': item.subjectId, 'sound': item.subName, 'jihua': item.expectedStudentNum, 'yuji': item.fee, 'zhonglei': [], 'fangshi': item.kitGroupPurchaseType, 'fangshiprice': item.depositFee, 'jiaopu': '', 'type': 1, 'typeVisible': false, 'provideVisible': false, 'markVisible': false, 'goodsList': [], 'markList': [], 'markChioseList': [] }
|
|
|
- this.checkinlist(obj)
|
|
|
- return obj;
|
|
|
- })
|
|
|
- // this.activeSoundList = arr;
|
|
|
- // 这里.....
|
|
|
- this.soundList.forEach((item, i) => {
|
|
|
- item.subjects.forEach((some, j) => {
|
|
|
- this.activeSoundList.forEach((sub, x) => {
|
|
|
- if (sub.id == some.id) {
|
|
|
- this.soundLists[i].push(some.id)
|
|
|
- // this.checkinlist(some)
|
|
|
- // this.activeSoundList.push(some)
|
|
|
- // 这里点击勾选
|
|
|
- }
|
|
|
- })
|
|
|
- })
|
|
|
- })
|
|
|
- // 循环列表里的声部 拿取商品
|
|
|
- for (let i in this.activeSoundList) {
|
|
|
- for (let j in res.data.musicGroupSubjectGoodsGroups) {
|
|
|
- if (this.activeSoundList[i].id == res.data.musicGroupSubjectGoodsGroups[j].subjectId) {
|
|
|
- //
|
|
|
- if (res.data.musicGroupSubjectGoodsGroups[j].type == 'INSTRUMENT') {
|
|
|
- this.activeSoundList[i].zhonglei = this.activeSoundList[i].zhonglei.concat(res.data.musicGroupSubjectGoodsGroups[j].goodsIdList)
|
|
|
- this.activeSoundList[i].zhonglei = this.activeSoundList[i].zhonglei.map(item => {
|
|
|
- return parseInt(item);
|
|
|
- })
|
|
|
-
|
|
|
- this.activeSoundList[i].goodsList = this.activeSoundList[i].goodsList.concat(res.data.musicGroupSubjectGoodsGroups[j].goodsList);
|
|
|
-
|
|
|
- // goodsList
|
|
|
-
|
|
|
- }
|
|
|
- // 拿辅件
|
|
|
- if (res.data.musicGroupSubjectGoodsGroups[j].type == 'ACCESSORIES') {
|
|
|
- if (res.data.musicGroupSubjectGoodsGroups[j].goodsList.length >= 0) {
|
|
|
- this.activeSoundList[i].markList ? this.activeSoundList[i].markList : this.activeSoundList[i].markList = []
|
|
|
- let obj = {};
|
|
|
- obj.goods = res.data.musicGroupSubjectGoodsGroups[j].goodsIdList.split(',');
|
|
|
- obj.goods = obj.goods.map(item => {
|
|
|
- return parseInt(item);
|
|
|
- })
|
|
|
- obj.name = res.data.musicGroupSubjectGoodsGroups[j].name
|
|
|
- obj.price = res.data.musicGroupSubjectGoodsGroups[j].price;
|
|
|
- this.activeSoundList[i].markList.push(obj);
|
|
|
- // this.activeSoundList[i].markList.goodsList.goods = JSON.parse(res.data.musicGroupSubjectGoodsGroups[j].goodsIdList)
|
|
|
- this.activeSoundList[i].markChioseList = this.activeSoundList[i].markChioseList.concat(res.data.musicGroupSubjectGoodsGroups[j].goodsList);
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- })
|
|
|
- // 拿到刚才的存储的信息
|
|
|
- this.payfor = this.$store.getters.payList;
|
|
|
- this.topfor = this.$store.getters.topinfo;
|
|
|
- this.checkfor = this.$store.getters.checkinfo;
|
|
|
- let type = this.topfor.type;
|
|
|
- // 判断进来的乐团状态
|
|
|
- this.teamStatus = this.$route.query.type;
|
|
|
-
|
|
|
+ this.init();
|
|
|
},
|
|
|
watch: {
|
|
|
|
|
|
@@ -862,7 +926,7 @@ export default {
|
|
|
},
|
|
|
}
|
|
|
</script>
|
|
|
-<style lang="scss" >
|
|
|
+<style lang="scss" scoped>
|
|
|
// .el-table__body tr.current-row > td {
|
|
|
// background-color: #c6cbd4 !important;
|
|
|
// }
|
|
|
@@ -1035,4 +1099,194 @@ export default {
|
|
|
.el-icon-plus {
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
+.baseRight {
|
|
|
+ width: 375px;
|
|
|
+ margin-left: 25px;
|
|
|
+ header {
|
|
|
+ width: 375px;
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ color: #000;
|
|
|
+ font-size: 14px;
|
|
|
+ background: #fff;
|
|
|
+ box-shadow: 0px 1px 8px 0px rgba(0, 0, 0, 0.07);
|
|
|
+ text-align: center;
|
|
|
+ margin-bottom: 6px;
|
|
|
+ }
|
|
|
+ .section {
|
|
|
+ width: 375px;
|
|
|
+ padding: 16px 22px 10px;
|
|
|
+ background: #fff;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ .line_bottom {
|
|
|
+ border-bottom: 1px solid #ededed;
|
|
|
+ }
|
|
|
+ > .title {
|
|
|
+ font-size: 20px;
|
|
|
+ line-height: 28px;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ .indate {
|
|
|
+ font-size: 12px;
|
|
|
+ padding: 5px 0;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ span {
|
|
|
+ color: #fa101d;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .coutInfo {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #f85043;
|
|
|
+ text-align: left;
|
|
|
+ border-top: 1px solid #ededed;
|
|
|
+ padding: 12px 0 0 25px;
|
|
|
+ margin-top: 10px;
|
|
|
+ position: relative;
|
|
|
+ .trumpet_icon {
|
|
|
+ width: 14px;
|
|
|
+ height: 12px;
|
|
|
+ background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAYCAYAAADpnJ2CAAAAAXNSR0IArs4c6QAAAyZJREFUSA21Vk1IVFEUPufOezNilJXQD2UQRERamWhBaUWOSS3U0SawdgZai2gR0aoQXPSDm3JRCbm0xZBjbkQZS0KDjKywDCIIkoKKEIkm35uZezr32X0jQ+bY2IU359xzzj3fPXe++4PwDy0W8JdKgjYCWOkzzWIM9X5NN42RbqCKoxOHl1nR2FVJ1MRgqGzxhCxg8VDp6TSRTpCKsQL+aitqjwPRKQ3mjCVygFPz2MGKQqvG/zxW56+c7ZsXkIJH1liB8hARdQPButmD59WR8mUCuqy6ynwd686OmpsN++XjLUiYrZ0g5E6SdJmAVri2FMWDnnIz3P8gxex07Rp/owS6jQij3h1lu7G5Oe5UOF1bcc5+MTRFlBiTEH/iflLe+htYKsh0oHwzBcpztd3bHWlHxPtEUMTFHFV2YdceOglStnLiZGV6xEIlwbBF+JQaqpa6Qw246OiUOKOkICnPus4MFYGik7m80Z6MXtCpfKHIGBN6kIm2x66tLBJM7q3amak0DbqEgD84eQNzwiUkE+Wmk1vGjwtmnydTID0eQ5EpLoDZTGvjr4b2absXzGdKlwC73FloZ6aSSTKocjC7kyu3Ku8D2xOAuOk/ANKEAwhivZKqYXt7jFdyAnl7LTrgDMTcv4sOyCddnlOVnKlU6dTYaPKS5hHg5IIO77nnnfTw0h1QPTTgjWv9MrGB97ki5zvh/JmuJzOFgv4cPm9rGO6TUVD6SGezhV2sdF7OEcEB49qRqbRi0MKVLEEBHXxu8i6YabzMpx1NGJ18OIjr2pG5pHqu7r13efY1ncsK+rfxvtzPW2LY29U3Krxd/Xe4c55PiKgO+meJsNeHVIIdPd/dHHFoUToitSnpsDQrHGn1FpbmoMcoEIJPA/0BNvFEJlVgOi0rPPAWwwPfdKy6nphE1c71tL3snrK796EOSpVUX7Xano628cBgqk/157oP1Y1PcTkChDEwzRJfqNfhyrz7EO/2fPaFI8dAiGqe3sc/gc5pI3wtPFCrwVTcvBXOTuY8on7GrqBMvms8wjhodvWl/YhaEKAG//1MvMHXUO5Cn4m/ACXBMJBwQaFpAAAAAElFTkSuQmCC)
|
|
|
+ no-repeat center;
|
|
|
+ background-size: contain;
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 14px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .options {
|
|
|
+ padding-top: 8px;
|
|
|
+ .oc {
|
|
|
+ &:last-child {
|
|
|
+ border-top: 1px solid #ededed;
|
|
|
+ margin-top: 8px;
|
|
|
+ padding-top: 9px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .protocol {
|
|
|
+ padding-left: 20px;
|
|
|
+ font-size: 10px;
|
|
|
+ line-height: 14px;
|
|
|
+ }
|
|
|
+ .option {
|
|
|
+ line-height: 26px;
|
|
|
+ font-size: 15px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ position: relative;
|
|
|
+ .o_bd {
|
|
|
+ flex: 1;
|
|
|
+ .c {
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .o_ft {
|
|
|
+ font-size: 12px;
|
|
|
+ color: #fa101d;
|
|
|
+ del {
|
|
|
+ color: #aaaaaa;
|
|
|
+ font-size: 11px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .check_default {
|
|
|
+ margin-right: 8px;
|
|
|
+ display: block;
|
|
|
+ width: 14px;
|
|
|
+ height: 14px;
|
|
|
+ background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAABK0lEQVQ4T6WSP0vDQBjGn3MIiYX+CbhYG7BR7CL5ANmS2SWQ7H4DZ3ed/QbuOcjinGz5ANGloqmQ2i5CmhZqQgZPLjRQFYS2N9297/t73+fuHoK15bruASHkijF2AeB0lXohhDwwxu4cx/moy0m9oZRaAO5VVW0qioJ2u12lsixDkiSI43gB4NK2bY/HK5BDoihSXdf3Wq0WZrMZPpfLCtxvNNDpdDCfzxGG4VdRFDaHyUreq2maTUmS8DYaoSzL9RtAEAQc9/vI8xy+7y8YYyeEUnqjquq1pml4Hg7/QHUHDp8NBoiiiMu+5RMfDcM45wXv4/GPSb8PR71eFQqC4ImDuWVZ4nQyQZqm/4KyLOOw24XnecVO4HZSd3kc7pbNv2NrA+xkuRrexOTfqpPUy7sW3D4AAAAASUVORK5CYII=)
|
|
|
+ no-repeat center;
|
|
|
+ background-size: contain;
|
|
|
+ &.check_active {
|
|
|
+ background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAABaUlEQVQ4T2NkQAKHPD1F2TmYChgZGHwZGBlUwVL/GW7/Z2DY/PPHvwl227e/hilnhDFOBXoHMbKxzhd18eATtnNg4FJQBEt9e3Cf4e2hAwyv9+z49P/X70Sz9VvXgcTBGkGa2EREVqtU1jFxSUgy/F+1geHf6bNgjUymxgyMYQEM3148Z7jT3vTv15s3oSDNjCDncfKx39Fs7+Xj+vWX4U9YAgPDo8fIPmBgkJNlYFm1gOEbGzPD9criT98//VRhPB3o2yrq5V0lFx3H8MfCBVMTzAiQ5hN7GB4tXcTwctvmNsZTgd6XNDt6dbmOn2X4W1CBahMaj3lCB8M3S2OG6xXFlxlPBXl/N16+juNfURXD/6Wr8GpkjA5jYOprYzgbGfSDAo1wp55j+FtQTsCpnQzfLI0gTiU7cMiODuwJYD3Dv9PnoAnAiIExLBAzAVCU5GCawc7mYCn4z/APJZEzMjBt/v7jD0oiBwAFDdbhAm8qEQAAAABJRU5ErkJggg==)
|
|
|
+ no-repeat center;
|
|
|
+ background-size: contain;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .configuration {
|
|
|
+ padding-right: 5px;
|
|
|
+ padding-bottom: 9px;
|
|
|
+ .title {
|
|
|
+ background: rgba(246, 246, 246, 1);
|
|
|
+ height: 1px;
|
|
|
+ position: relative;
|
|
|
+ margin: 15px 0;
|
|
|
+ span {
|
|
|
+ position: absolute;
|
|
|
+ left: 12px;
|
|
|
+ top: -9px;
|
|
|
+ display: inline-block;
|
|
|
+ background-color: #fff;
|
|
|
+ font-size: 10px;
|
|
|
+ padding: 0 4px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .content {
|
|
|
+ font-size: 12px;
|
|
|
+ padding-left: 16px;
|
|
|
+ line-height: 22px;
|
|
|
+ color: #acacac;
|
|
|
+ }
|
|
|
+
|
|
|
+ .options {
|
|
|
+ padding-top: 0;
|
|
|
+ padding-left: 16px;
|
|
|
+ .option {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #6f6f6f;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .buy {
|
|
|
+ margin-top: 200px;
|
|
|
+ bottom: 0;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ height: 60px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ padding: 0 20px;
|
|
|
+ border-top: 1px solid #ffe9e9e9;
|
|
|
+ color: #000000;
|
|
|
+ font-size: 12px;
|
|
|
+ background: #fff;
|
|
|
+ .price {
|
|
|
+ flex: 1;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ font-size: 14px;
|
|
|
+ span {
|
|
|
+ color: #fa101d;
|
|
|
+ }
|
|
|
+ .text {
|
|
|
+ font-size: 12px;
|
|
|
+ width: 60px;
|
|
|
+ display: inline-block;
|
|
|
+ color: #000;
|
|
|
+ }
|
|
|
+ del {
|
|
|
+ color: #b5b5b5;
|
|
|
+ &.text {
|
|
|
+ color: #b5b5b5;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ a {
|
|
|
+ display: inline-block;
|
|
|
+ font-size: 18px;
|
|
|
+ color: #fff;
|
|
|
+ background: #f1111b;
|
|
|
+ border-radius: 4px;
|
|
|
+ box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.19);
|
|
|
+ padding: 8px 28px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
