Merge remote-tracking branch 'origin/master'

zhc4dev
wangjiadong 2 years ago
commit 08133e7153
  1. 3
      ant-design-vue-jeecg/src/views/shopping/assets/common.css
  2. 171
      ant-design-vue-jeecg/src/views/shopping/components/Order/placeOrder.vue
  3. 150
      ant-design-vue-jeecg/src/views/shopping/pages/chengyi.vue
  4. 4
      ant-design-vue-jeecg/src/views/shopping/pages/sirendingzhi.vue

@ -94,4 +94,7 @@ a {
.c_1B {
color: #1B1B1B;
}
.c_31 {
color: #313131;
}
.textfield {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}

@ -25,22 +25,131 @@
</a-radio-group>
</a-form-item>
<a-form-item
label="Field A"
label="称呼"
>
<a-input placeholder="input placeholder" />
<a-select placeholder="请选择称呼" :value="userSex" style="width: 120px;margin-right:10px" @change="handleChange">
<a-select-option value="1">
先生
</a-select-option>
<a-select-option value="0">
女士
</a-select-option>
</a-select>
<a-input style="width:300px" placeholder="请输入姓名" :value="userName"/>
</a-form-item>
<a-form-item
label="Field B"
label="选择地址"
>
<a-input placeholder="input placeholder" />
</a-form-item>
<a-form-item
label="详细地址"
>
<a-textarea placeholder="请输入街道、门牌号码等详细地址" auto-size />
</a-form-item>
<a-form-item
label="手机号码"
>
<a-input style="width:150px;margin-right:10px" placeholder="+86 中国大陆地区" disabled/>
<a-input style="width:300px" placeholder="请输入手机号码" :value="userName"/>
</a-form-item>
<a-form-item>
<a-checkbox @change="onChange">
保存该地址至地址簿
</a-checkbox>
</a-form-item>
<!-- <a-form-item v-bind="formItemLayout" label="手机号码">-->
<!-- <a-input-->
<!-- v-decorator="[-->
<!-- 'phone',-->
<!-- {-->
<!-- rules: [{ required: true, message: 'Please input your phone number!' }],-->
<!-- },-->
<!-- ]"-->
<!-- >-->
<!-- <a-select-->
<!-- slot="addonBefore"-->
<!-- v-decorator="['prefix', { initialValue: '86' }]"-->
<!-- style="width: 70px"-->
<!-- default-value="86"-->
<!-- >-->
<!-- <a-select-option value="86">-->
<!-- +86 中国大陆地区-->
<!-- </a-select-option>-->
<!-- <a-select-option value="87">-->
<!-- +87 中国大陆地区-->
<!-- </a-select-option>-->
<!-- </a-select>-->
<!-- </a-input>-->
<!-- </a-form-item>-->
</a-form>
</div>
</div>
<div class="addr"></div>
<div class="addr"></div>
<div class="addr">
<div class="title">
<span class="icon">2</span>
<span class="text f_18">支付方式</span></div>
<div class="pay">
<p class="f_12 c_1B">在线支付</p>
<a-radio-group v-model="paymentMode" @change="onChange1">
<a-radio :value="1">
<a-icon type="alipay" style="background:#08AAFF;color:#fff;border-radius: 2px;padding:1px;margin-right:3px"/>
<span>支付宝</span>
</a-radio>
<a-radio :value="2">
<a-icon type="wechat" style="background:#00B40C;color:#fff;border-radius: 2px;padding:1px;margin-right:3px"/>
<span>微信支付</span>
</a-radio>
</a-radio-group>
</div>
<a-checkbox @change="onChange">
需要电子发票
</a-checkbox>
</div>
<!-- <div class="addr"></div>-->
</div>
<div class="rightDiv">
<div class="order">
<p class="d-flex title">
<span class="f_14 c_999">订单小计</span>
<span class="f_14 c_31">已选 1 件商品</span>
</p>
<div class="table d-flex">
<div class="left">
<!-- <img src="">-->
<div class="img"></div>
</div>
<div class="right">
<p class="d-flex">
<span class="f_12 c_1B">关键词12定制款立领衬</span>
<span class="f_12 c_999">数量1</span>
</p>
<p class="f_12 c_999">款式立领标签2</p>
<p class="d-flex">
<span class="f_12 c_999">主辅料主料1辅料1叮叮叮辅料n</span>
<span class="f_12 c_999">数量1</span>
</p>
<p class="f_12 c_999">尺码 XXS</p>
<p class="d-flex">
<span class="f_12 c_999">定制</span>
<span class="f_12 c_999">35,500</span>
</p>
</div>
</div>
<p class="d-flex">
<span class="f_14 c_31">商品总计</span>
<span class="f_14 c_666">35,500</span>
</p>
<p class="d-flex">
<span class="f_14 c_31">运费</span>
<span class="f_14 c_999">免费</span>
</p>
<p class="d-flex title">
<span class="f_14 c_31">总计</span>
<span class="f_20 c_31">35,500</span>
</p>
</div>
</div>
<div class="rightDiv">1</div>
</div>
</div>
@ -50,6 +159,10 @@
data() {
return {
formLayout: 'horizontal',
userSex:'',//
userName:'',//
value: 1,
paymentMode:'',//
};
},
computed: {
@ -75,12 +188,22 @@
handleFormLayoutChange(e) {
this.formLayout = e.target.value;
},
handleChange(value) {
this.userSex = value
},
onChange(e) {
console.log(`checked = ${e.target.checked}`);
},
onChange1(e) {
console.log('radio checked', e.target.value);
},
},
};
</script>
<style lang="less" scoped>
.placeOrder{
padding-top: 54px;
padding-bottom: 80px;
background-color: #F6F6F6;
& >.jz{
justify-content: space-around;
@ -123,6 +246,15 @@
.addr{
background-color: #fff;
padding:0 30px 30px 30px;
margin-bottom: 25px;
.pay{
padding: 47px 20px;
border-bottom: 1px solid #EAEAEA;
margin-bottom: 20px;
.ant-radio-wrapper{
margin-right: 20px;
}
}
}
.form{
background-color: #fff;
@ -131,6 +263,33 @@
}
.rightDiv{
width: 410px;
.order{
background: #FFFFFF;
padding: 24px 43px;
.d-flex{
justify-content: space-between;
.left{
width: 60px;
}
.right{
width: 250px;
}
}
&>.d-flex{
padding: 10px 0;
}
&>.title.d-flex{
border-bottom: 1px solid #E7E7E7;
padding: 20px 0;
}
.left{
.img{
background: #D9D9D9;
width: 60px;
height: 77px;
}
}
}
}
}
}

@ -1,5 +1,5 @@
<template>
<!-- 服装类型-->
<!-- 成衣推荐-->
<div class="chengyi">
<Header fontColor="#000"></Header>
@ -16,10 +16,11 @@
<i class="el-icon-male"></i>
<span>{{ item.name }}</span>
</template>
<el-submenu v-for="(j, i2) in item.childrens" :key="i2" :index="j.id">
<template slot="title">{{ j.name }}</template>
<el-menu-item v-for="(k, i3) in j.childrens" :key="i3" :index="k.id">{{ k.name }}</el-menu-item>
</el-submenu>
<el-menu-item v-for="(j, i2) in item.childrens" :key="i2" :index="j.id">{{ j.name }}</el-menu-item>
<!-- <el-submenu v-for="(j, i2) in item.childrens" :key="i2" :index="j.id">-->
<!-- <template slot="title">{{ j.name }}</template>-->
<!-- <el-menu-item v-for="(k, i3) in j.childrens" :key="i3" :index="k.id">{{ k.name }}</el-menu-item>-->
<!-- </el-submenu>-->
</el-submenu>
</el-menu>
<div class="right">
@ -32,18 +33,18 @@
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="heat">热度</el-dropdown-item>
<!-- <el-dropdown-item command="esteem">评分</el-dropdown-item>-->
<!-- <el-dropdown-item command="esteem">评分</el-dropdown-item>-->
<el-dropdown-item command="high">价格降序</el-dropdown-item>
<el-dropdown-item command="low">价格升序</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<!-- <div class="iconDiv d-flex">-->
<!-- <span>价格</span>-->
<!-- <div class="icon d-flex">-->
<!-- <i class="el-icon-arrow-up"></i>-->
<!-- <i class="el-icon-arrow-down"></i>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="iconDiv d-flex">-->
<!-- <span>价格</span>-->
<!-- <div class="icon d-flex">-->
<!-- <i class="el-icon-arrow-up"></i>-->
<!-- <i class="el-icon-arrow-down"></i>-->
<!-- </div>-->
<!-- </div>-->
</div>
</div>
<div class="clothDiv d-flex">
@ -193,10 +194,6 @@
{
id: '1',
name: "男装",
childrens: [
{
id: '11',
name: "上衣",
childrens: [
{
id: '111',
@ -214,12 +211,6 @@
id: '114',
name: "针织衫",
},
],
},
{
id: '12',
name: "外套",
childrens: [
{
id: '121',
name: "夹克",
@ -232,12 +223,6 @@
id: '123',
name: "风衣",
},
],
},
{
id: '13',
name: "裤子",
childrens: [
{
id: '131',
name: "休闲裤",
@ -272,15 +257,9 @@
},
],
},
],
},
{
id: '2',
name: "女装",
childrens: [
{
id: '21',
name: "上衣",
childrens: [
{
id: '211',
@ -298,12 +277,6 @@
id: '214',
name: "针织衫",
},
],
},
{
id: '22',
name: "外套",
childrens: [
{
id: '221',
name: "夹克",
@ -316,12 +289,6 @@
id: '223',
name: "风衣",
},
],
},
{
id: '23',
name: "裤子",
childrens: [
{
id: '231',
name: "休闲裤",
@ -356,13 +323,78 @@
},
],
},
{
id: '3',
name: "童装",
childrens: [
{
id: '311',
name: "衬衫",
},
{
id: '312',
name: "卫衣",
},
{
id: '313',
name: "Polo衫",
},
{
id: '314',
name: "针织衫",
},
{
id: '321',
name: "夹克",
},
{
id: '322',
name: "羽绒服",
},
{
id: '323',
name: "风衣",
},
{
id: '331',
name: "休闲裤",
},
{
id: '332',
name: "西裤",
},
{
id: '333',
name: "工装裤",
},
{
id: '334',
name: "运动裤",
},
{
id: '335',
name: "卫裤",
},
{
id: '336',
name: "九分裤",
},
{
id: '337',
name: "短裤",
},
{
id: '338',
name: "哈伦裤",
},
],
},
],
//
current:{
id:'',
name:''
name:'',
parrentName:''
}
};
},
@ -374,19 +406,24 @@
const indexb = this.typeData[indexa].childrens.findIndex((value, keys, arr) => {
return value.id == indexPath[1]
})
const indexc = this.typeData[indexa].childrens[indexb].childrens.findIndex((value, keys, arr) => {
return value.id == indexPath[2]
})
this.current.name = this.typeData[indexa].childrens[indexb].childrens[indexc].name
this.current.id = this.typeData[indexa].childrens[indexb].childrens[indexc].id
// const indexc = this.typeData[indexa].childrens[indexb].childrens.findIndex((value, keys, arr) => {
// return value.id == indexPath[2]
// })
// this.current.name = this.typeData[indexa].childrens[indexb].childrens[indexc].name
// this.current.id = this.typeData[indexa].childrens[indexb].childrens[indexc].id
this.current.name = this.typeData[indexa].childrens[indexb].name
this.current.id = this.typeData[indexa].childrens[indexb].id
this.current.parrentName = this.typeData[indexa].name
},
handleSelet(index,indexPath){
this.findIndex(indexPath)
//,this.current.id
// this.clothsList
},
clothDetails(item) {
this.$router.push({
path: "/shopping/ClothDetail",
query: { id: item.id, title: item.title },
query: { id: item.id, title: item.title ,name:this.current.name,parentName:this.current.parrentName},
});
},
handleCommand(command){
@ -405,6 +442,11 @@
}
}
},
mounted() {
this.current.name = this.typeData[0].childrens[0].name
this.current.id = this.typeData[0].childrens[0].id
this.current.parrentName = this.typeData[0].name
}
}
</script>
<style scoped>

@ -155,14 +155,16 @@
<div v-if="current == 3">
<PlaceOrder></PlaceOrder>
</div>
<Footer></Footer>
</div>
</template>
<script>
import Header from "../components/Header/HeaderView";
import Footer from "../components/Footer/FooterView";
import PlaceOrder from "../components/Order/placeOrder"
export default {
name: "sirendingzhi",
components: { Header ,PlaceOrder},
components: { Header ,PlaceOrder,Footer},
data() {
return {
current: 3,

Loading…
Cancel
Save