|
|
@@ -1,106 +1,277 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
- <div>
|
|
|
- <div class="flex-s" v-for="item in goodsList">
|
|
|
- <div class="goods-name overflow2">{{item.name}}</div>
|
|
|
- <div class="goods-money">{{item.price}}</div>
|
|
|
- <div class="delete" style="margin-left: 100px" @click="addCarts(item)">加入购物车</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- <div style="text-align: center">我的方案页面</div>
|
|
|
- <div class="flex-s" v-for="item in schemeList">
|
|
|
- <div class="goods-name overflow2">{{item.goodsName}}</div>
|
|
|
- <div class="goods-money">{{item.price}}</div>
|
|
|
- <div style="display:flex;">
|
|
|
- <div>采购数量</div>
|
|
|
- <div style="margin-left: 100px" @click="add(item)">+</div>
|
|
|
- <div>{{item.goodsNum}}</div>
|
|
|
- <div style="width: 100px;" @click="deletes(item)">-</div>
|
|
|
+ <el-dialog v-model="schemeFlag" :show-close="true" align-center title="我的方案" style="width: 708px">
|
|
|
+ <div class="scheme">
|
|
|
+ <div class="scheme-tops">
|
|
|
+ <div class="scheme-name" style="flex: 0 0 150px;text-align: center">方案名称</div>
|
|
|
+ <div class="scheme-time" style="margin-left: 60px">
|
|
|
+ <div>创建时间</div>
|
|
|
+ <div class="sort-icon">
|
|
|
+ <img src="http://screen-test.zhousi.hdlkeji.com/aksdbn/img/sort-icon.png">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="scheme-name">操作</div>
|
|
|
+ <div class="scheme-name" style=" text-align: right; flex: 0 0 50px;">分享</div>
|
|
|
</div>
|
|
|
- <div style="display:flex;">
|
|
|
- <div>安装数量</div>
|
|
|
- <div style="margin-left: 100px" @click="addSchemeGoods(item)">+</div>
|
|
|
- <div>{{item.installNum}}</div>
|
|
|
- <div style="width: 100px;" @click="reduceSchemeGoods(item)">-</div>
|
|
|
+ <div class="scheme-content">
|
|
|
+ <div class="scheme-list" v-for="(item,index) in schemeLists.arr">
|
|
|
+ <div class="scheme-text overflow1" style="flex: 0 0 150px;text-align: center">{{ item.name }}</div>
|
|
|
+ <div class="scheme-time">{{ item.createtime }}</div>
|
|
|
+ <div class="scheme-time scheme-flex" style="margin-right: 30px">
|
|
|
+ <div @click.stop="routeTaps('/evaluateDetail',item.id)">查看方案</div>
|
|
|
+ <div class="line"></div>
|
|
|
+ <div @click="schemeShop(item)">使用方案</div>
|
|
|
+ <div class="line"></div>
|
|
|
+ <div @click="deletesTaps(item.id)">删除</div>
|
|
|
+ </div>
|
|
|
+ <div class="scheme-time" @click="shares(item.id,item.name)">
|
|
|
+ <img src="http://screen-test.zhousi.hdlkeji.com/aksdbn/img/goods/evaluate-share.png">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="pages">
|
|
|
+ <el-pagination
|
|
|
+ background
|
|
|
+ layout="prev, pager, next"
|
|
|
+ :total="totalNumber"
|
|
|
+ class="mt-4"
|
|
|
+ :page-size="limit"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- <div class="delete" @click="removeGoods(item)">删除</div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
-import {reactive, ref, inject, computed} from 'vue'
|
|
|
+import {defineExpose} from "@vue/runtime-core";
|
|
|
+
|
|
|
+const feedTip=()=>{
|
|
|
+ schemeFlag.value=true
|
|
|
+}
|
|
|
+defineExpose({
|
|
|
+ feedTip
|
|
|
+})
|
|
|
+import {useRouter} from "vue-router";
|
|
|
+let schemeFlag=ref(false)
|
|
|
+const shares = (id, name) => {
|
|
|
+ console.error(id,name)
|
|
|
+ const windows = window.location
|
|
|
+ const url = windows.protocol + '//' + windows.host +'/evaluateDetail'
|
|
|
+ console.error(url)
|
|
|
+ // 创建input标签
|
|
|
+ const input = document.createElement('input')
|
|
|
+ // 将input的值设置为需要复制的内容
|
|
|
+ input.value = '【屏酷】打开链接查看方案,方案名称'+ ' ' + name + ' ' + url + '?id=' + id+'&share=1'
|
|
|
+ // 添加input标签
|
|
|
+ document.body.appendChild(input)
|
|
|
+ // 选中input标签
|
|
|
+ input.select()
|
|
|
+ // 执行复制
|
|
|
+ document.execCommand('copy')
|
|
|
+ // 移除input标签
|
|
|
+ document.body.removeChild(input)
|
|
|
+ ElMessage.success('复制分享链接成功')
|
|
|
+}
|
|
|
+const deletesTaps = (id) => {
|
|
|
+ ElMessageBox({
|
|
|
+ title: '提示',
|
|
|
+ message: '是否删除该方案?',
|
|
|
+ showCancelButton: true,
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ callback: (action) => {
|
|
|
+ programme_del({ id: id }).then((res) => {
|
|
|
+ if (res.code == 1) {
|
|
|
+ // ElMessage.success('删除方案成功')
|
|
|
+ programme_lists()
|
|
|
+ texts.value = '删除方案成功~'
|
|
|
+ tcFlag.value = true
|
|
|
+ setTimeout(() => {
|
|
|
+ tcFlag.value = false
|
|
|
+ }, 1000)
|
|
|
+ } else {
|
|
|
+ ElMessage.error(res.msg)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+const schemeShop = (item) => {
|
|
|
+ const data = {
|
|
|
+ frm: 1,
|
|
|
+ form: {},
|
|
|
+ flag: false
|
|
|
+ }
|
|
|
+ for (let i = 0; i < item.goods.length; i++) {
|
|
|
+ if (item.goods[i].num > 0) {
|
|
|
+ data.form[item.goods[i].sku_id] = {
|
|
|
+ num: item.goods[i].num,
|
|
|
+ num_install: item.goods[i].num_install ?
|
|
|
+ item.goods[i].num_install : 0
|
|
|
+ }
|
|
|
+ data.flag = true
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (data.flag == true) {
|
|
|
+ localStorage.setItem('order', JSON.stringify(data))
|
|
|
+ router.push('/user/order/submit')
|
|
|
+ }
|
|
|
+}
|
|
|
+const routeTaps=(url,id)=>{
|
|
|
+ const $router=useRouter()
|
|
|
+ router.push({path:url,query:{id:id}})
|
|
|
+}
|
|
|
+import {reactive, ref, inject, computed,onMounted} from 'vue'
|
|
|
import { ElMessage } from 'element-plus'
|
|
|
import { setAuthed, setToken } from '@/utils/auth'
|
|
|
import { useUserStore } from '@/store/modules/user'
|
|
|
import { setStore, getStore } from '@/utils/storage.js'
|
|
|
-const goodsList = [{
|
|
|
- createTime: '2022-04-02 15:05:17',
|
|
|
- creater: '1',
|
|
|
- goodsId: '202202251008107404094360',
|
|
|
- id: '2022040203051668644261758191',
|
|
|
- isCan: '1',
|
|
|
- price: 3000,
|
|
|
- name: '商品1号',
|
|
|
- priceTypeName: '成本',
|
|
|
- skuId: '202202251008110676018361',
|
|
|
- updateTime: '2022-04-02 15:05:17',
|
|
|
- updater: '1'
|
|
|
-}, {
|
|
|
- createTime: '2022-04-02 15:05:17',
|
|
|
- creater: '1',
|
|
|
- goodsId: '202202251008107404094362',
|
|
|
- id: '2022040203051668644261758192',
|
|
|
- isCan: '1',
|
|
|
- price: 3700,
|
|
|
- priceType: 'JGLX_001',
|
|
|
- name: '商品2号',
|
|
|
- priceTypeName: '成本',
|
|
|
- skuId: '202202251008110676018362',
|
|
|
- updateTime: '2022-04-02 15:05:17',
|
|
|
- updater: '1'
|
|
|
-},
|
|
|
-{
|
|
|
- createTime: '2022-04-02 15:05:17',
|
|
|
- creater: '1',
|
|
|
- goodsId: '202202251008107404094363',
|
|
|
- id: '2022040203051668644261758193',
|
|
|
- isCan: '1',
|
|
|
- price: 4400,
|
|
|
- priceType: 'JGLX_001',
|
|
|
- priceTypeName: '成本',
|
|
|
- name: '商品3号',
|
|
|
- skuId: '202202251008110676018363',
|
|
|
- updateTime: '2022-04-02 15:05:17',
|
|
|
- updater: '1'
|
|
|
-}
|
|
|
-]
|
|
|
+import {programme_del, programme_list} from "@/api/menu1";
|
|
|
+import {router} from "@/router";
|
|
|
const userStore = useUserStore()
|
|
|
-const addCarts = (item) => {
|
|
|
- userStore.addCart(item.name, item.goodsId, item.price, 1)
|
|
|
-}
|
|
|
-const deletes = (item) => {
|
|
|
- userStore.removeScheme(item.goodsId)
|
|
|
-}
|
|
|
-const add = (item) => {
|
|
|
- userStore.addScheme(item.goodsId)
|
|
|
+onMounted(()=>{
|
|
|
+ programme_lists();
|
|
|
+})
|
|
|
+const page = ref(1)
|
|
|
+const limit = ref(10)
|
|
|
+const totalNumber = ref(null)
|
|
|
+const schemeLists = reactive({
|
|
|
+ arr: []
|
|
|
+})
|
|
|
+const handleCurrentChange = (size) => {
|
|
|
+ page.value = size
|
|
|
+ programme_lists()
|
|
|
}
|
|
|
-const addSchemeGoods = (item) => {
|
|
|
- userStore.addSchemeGoods(item.goodsId)
|
|
|
-}
|
|
|
-const reduceSchemeGoods = (item) => {
|
|
|
- userStore.reduceSchemeGoods(item.goodsId)
|
|
|
+const programme_lists = () => {
|
|
|
+ const data = {
|
|
|
+ page: page.value,
|
|
|
+ limit: limit.value
|
|
|
+ }
|
|
|
+ programme_list(data).then((res) => {
|
|
|
+ if (res.code == 1) {
|
|
|
+ schemeLists.arr = res.data.data
|
|
|
+ totalNumber.value = res.data.total
|
|
|
+ } else {
|
|
|
+ ElMessage.error(res.msg)
|
|
|
+ }
|
|
|
+ })
|
|
|
}
|
|
|
-const schemeList = userStore.schemeList
|
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
-.flex-s{
|
|
|
- display: flex;
|
|
|
- .goods-name{
|
|
|
- margin: 0 100px;
|
|
|
+/deep/ .el-dialog{
|
|
|
+ width:750px!important;
|
|
|
+}
|
|
|
+.scheme{
|
|
|
+ .examin-content{
|
|
|
+ height: 400px;
|
|
|
+ overflow-y: auto;
|
|
|
+ }
|
|
|
+ .examin-list{
|
|
|
+ border-bottom: 1px solid #EEEEEE;
|
|
|
+ padding: 10px 10px;
|
|
|
+ display: flex;
|
|
|
+ position: relative;
|
|
|
+ .check{
|
|
|
+ margin: 40px 10px 0 10px;
|
|
|
+ .boxs{
|
|
|
+ width: 14px;
|
|
|
+ height: 14px;
|
|
|
+ border: 1px solid #999999;
|
|
|
+ border-radius: 10px;
|
|
|
+ }
|
|
|
+ .check-icon{
|
|
|
+ img{
|
|
|
+ width: 20px;
|
|
|
+ height: 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .examin-goods{
|
|
|
+ img{
|
|
|
+ width: 100px;
|
|
|
+ height: 100px
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .examin-list-right{
|
|
|
+ margin-left: 10px;
|
|
|
+ .examin-name{
|
|
|
+ color: #333;
|
|
|
+ font-size: 14px;
|
|
|
+ margin: 10px 0 10px 0;
|
|
|
+ }
|
|
|
+ .examin-rule{
|
|
|
+ font-size: 12px;
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
+ .examin-money{
|
|
|
+ color: #EA2813;
|
|
|
+ font-size: 14px;
|
|
|
+ margin-top: 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .scheme-content{
|
|
|
+ height:400px;
|
|
|
+ overflow-y: auto;
|
|
|
+ .scheme-list{
|
|
|
+ .scheme-text{
|
|
|
+ width:180px;
|
|
|
+ }
|
|
|
+ height: 76px;
|
|
|
+ border-bottom: 1px solid #DDDDDD;
|
|
|
+ padding: 0 24px;
|
|
|
+ line-height: 76px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ .scheme-flex{
|
|
|
+ color: #4171B3;
|
|
|
+ font-size: 14px;
|
|
|
+ display: flex;
|
|
|
+ .line{
|
|
|
+ background: #EEEEEE;
|
|
|
+ width: 1px;
|
|
|
+ height: 14px;
|
|
|
+ margin: 30px 10px 0 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .scheme-time{
|
|
|
+ img{
|
|
|
+ width: 24px;
|
|
|
+ height: 24px;
|
|
|
+ margin:25px 0 0 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .scheme-tops{
|
|
|
+ display: flex;
|
|
|
+ height: 54px;
|
|
|
+ background: #FAFAFA;
|
|
|
+ border-radius: 4px 4px 0px 0px;
|
|
|
+ padding: 0 25px;
|
|
|
+ justify-content: space-between;
|
|
|
+ line-height: 54px;
|
|
|
+ border-bottom: 1px solid #DDDDDD;
|
|
|
+
|
|
|
+ .scheme-name{
|
|
|
+ color: #666;
|
|
|
+ font-size: 14px;
|
|
|
+ flex: 1;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ .scheme-time{
|
|
|
+ display: flex;
|
|
|
+ .sort-icon{
|
|
|
+ img{
|
|
|
+ width: 24px;
|
|
|
+ height: 24px;
|
|
|
+ margin: 15px 0 0 3px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
</style>
|
ncs_23818