Files
management/src/views/invoicing/consumable/information.vue
2024-07-17 18:28:18 +08:00

978 lines
30 KiB
Vue

<!-- eslint-disable no-empty -->
<template>
<div class="app-container">
<div class="head-container">
<div class="row_wrap">
<div class="row">
<!-- <el-input
v-model="query.conTypeId"
size="small"
clearable
placeholder="请输入类型id"
style="width: 150px"
@keyup.enter.native="getTableData"
/> -->
<div style="width: 150px">
<el-select
v-model="query.conTypeId"
placeholder="请选择耗材分类"
style="width: 100%"
>
<el-option
:label="item.conTypeName"
:value="item.id"
v-for="item in consTypeList"
:key="item.conTypeId"
/>
</el-select>
</div>
<el-input
v-model="query.conTypeName"
size="small"
clearable
placeholder="请输入类型名称"
style="width: 150px"
@keyup.enter.native="getTableData"
/>
<el-input
v-model="query.conCode"
size="small"
clearable
placeholder="请输入耗材代码"
style="width: 150px"
@keyup.enter.native="getTableData"
/>
<el-input
v-model="query.conName"
size="small"
clearable
placeholder="请输入耗材名称"
style="width: 150px"
@keyup.enter.native="getTableData"
/>
<div style="width: 150px">
<el-select
v-model="query.status"
placeholder="请选择商品规格"
style="width: 100%"
>
<el-option
:label="item.label"
:value="item.value"
v-for="item in typeEnums"
:key="item.label"
/>
</el-select>
</div>
<el-button type="primary" @click="getTableData">查询</el-button>
<el-button @click="resetHandle">重置</el-button>
</div>
<div class="row">
<el-button
icon="el-icon-download"
:loading="downloadLoading"
@click="protHandle"
>导出耗材</el-button
>
<el-button
icon="el-icon-upload2"
:loading="uploadLoading"
@click="dialogVisible = true"
>导入耗材</el-button
>
</div>
</div>
</div>
<div class="head-container">
<el-row>
<el-col>
<el-button
type="primary"
icon="el-icon-plus"
@click="clickdialogframe('add')"
>添加</el-button
>
</el-col>
</el-row>
</div>
<div class="head-container" id="table_drag">
<el-table
ref="table"
:data="tableData.data"
v-loading="tableData.loading"
row-key="id"
>
<el-table-column prop="id" label="ID" width="50px" />
<el-table-column label="耗材名称" prop="conName" />
<el-table-column label="耗材代码" prop="conCode" />
<!-- <el-table-column label="类型id" prop="conTypeId" /> -->
<el-table-column label="分类名称" prop="conTypeName" />
<el-table-column label="单位" prop="conUnit" />
<el-table-column label="创建时间" prop="createTime" width="200">
<template v-slot="scope">
{{ dayjs(scope.row.createTime).format("YYYY-MM-DD HH:mm:ss") }}
</template>
</el-table-column>
<!-- <el-table-column label="最近入库量" prop="lasterInStock" /> -->
<el-table-column label="库存数量" prop="stockNumber">
<template v-slot="scope">
{{ (scope.row.stockNumber - scope.row.stockConsume).toFixed(2) }}
</template>
</el-table-column>
<el-table-column label="预警值" prop="conWarning" />
<!-- <el-table-column label="单位耗材值" prop="surplusStock" /> -->
<!-- <el-table-column label="排序" prop="sort" sortable /> -->
<el-table-column label="更新时间" prop="updateTime" width="200">
<!-- <template v-slot="scope">
{{ dayjs(scope.row.createdAt).format('YYYY-MM-DD HH:mm:ss') }}
</template> -->
</el-table-column>
<el-table-column label="操作" width="180" fixed="right">
<template v-slot="scope">
<el-button type="text" @click="editorHandle(scope.row)"
>编辑</el-button
>
<el-button
type="text"
@click="clicksee(scope.row)"
style="margin-left: 10px !important"
>耗材记录</el-button
>
<el-button
type="text"
size="mini"
style="margin-left: 10px !important"
@click="$refs.AddConsTakin.show(scope.row)"
>耗材盘点</el-button
>
<!-- <el-button type="text" icon="el-icon-rank">排序</el-button> -->
<!-- <el-button type="text" @click="clickdialogfadd(scope.row)"
style="margin-left: 10px !important;">入库</el-button> -->
<!-- <el-button type="text" icon="el-icon-edit" @click="clickdialogframe('edit', scope.row)">编辑</el-button> -->
<!-- <el-popconfirm title="确定删除吗?" @confirm="delTableHandle([scope.row.id])">
<el-button type="text" icon="el-icon-delete" style="margin-left: 20px !important;"
slot="reference">删除</el-button>
</el-popconfirm> -->
</template>
</el-table-column>
</el-table>
</div>
<div class="head-container">
<el-pagination
:total="tableData.total"
:current-page="tableData.page + 1"
:page-size="tableData.size"
layout="total, sizes, prev, pager, next, jumper"
@current-change="paginationChange"
@size-change="
(e) => {
tableData.size = e;
tableData.page = 0;
getTableData();
}
"
/>
</div>
<!-- 耗材入库 -->
<el-dialog title="耗材入库" :visible.sync="libraryshow">
<el-form
:inline="true"
ref="reflibrary"
:model="libraryshowdata"
:rules="ruleslibrary"
class="demo-form-inline"
>
<el-form-item label="耗材入库数量" prop="stockNumber">
<el-input
v-model.number="libraryshowdata.stockNumber"
type="number"
placeholder="请输入单位"
></el-input>
</el-form-item>
<el-form-item style="display: flex; justify-content: flex-end">
<el-button @click="libraryshow = false">取 消</el-button>
<el-button
type="primary"
@click="clickdialoglibraryshow('reflibrary')"
>确 定</el-button
>
</el-form-item>
</el-form>
</el-dialog>
<!-- 修改和增加 -->
<el-dialog :title="dialogtitle" :visible.sync="dialogshow" width="80%">
<template v-if="dialogtitle != '编辑'">
<div v-for="(item, index) in ruleForms" :key="index">
<el-form
:inline="true"
:ref="'refruleForm'+index"
:model="item"
:rules="rules"
class="demo-form-inline"
>
<el-form-item label=" ">
<i
class="el-icon-remove-outline color-danger"
@click="ruleFormsReduce(index)"
></i>
</el-form-item>
<el-form-item label="单位" prop="conUnit">
<el-input
v-model="item.conUnit"
placeholder="请输入单位"
></el-input>
</el-form-item>
<el-form-item label="耗材类型" prop="conTypeId">
<el-select v-model="item.conTypeId" placeholder="请选择" @change="selectChange($event,'refruleForm'+index,'conTypeId')" >
<el-option
v-for="option in consTypeList"
:key="option.conTypeId"
:label="option.conTypeName"
:value="option.id"
>
</el-option>
</el-select>
</el-form-item>
<!-- <el-form-item
label="耗材类型"
prop="conNames"
v-if="dialogtitle == '添加'"
>
<el-input
v-model="ruleForm.conNames"
placeholder="请输耗材信息名称"
disabled
></el-input>
</el-form-item>-->
<!-- <el-form-item v-if="dialogtitle == '添加'">
<el-button type="primary" @click="typedialogshow = true"
>去选择</el-button
>
</el-form-item> -->
<el-form-item label="耗材信息名称" prop="conName">
<el-input
v-model="item.conName"
placeholder="请输入耗材信息名称"
></el-input>
</el-form-item>
<!-- <el-form-item label="耗材信息代码" prop="conCode">
<el-input
v-model="ruleForm.conCode"
placeholder="请输入耗材信息代码"
></el-input>
</el-form-item> -->
<el-form-item label="耗材价格">
<el-input
v-model="item.price"
placeholder="请输入耗材价格"
></el-input>
</el-form-item>
<el-form-item label="预警值">
<el-input
v-model="item.conWarning"
placeholder="请输入耗材预警值"
></el-input>
</el-form-item>
<el-form-item label=" ">
<i
class="el-icon-circle-plus-outline color-success"
@click="ruleFormsAdd(index)"
></i>
</el-form-item>
<!-- <el-form-item label="单位耗材值" prop="surplusStock">
<el-input v-model="ruleForm.surplusStock" placeholder="请输入单位耗材值"></el-input>
</el-form-item> -->
</el-form>
</div>
<div style="display: flex; justify-content: flex-end">
<el-button @click="dialogshow = false">取 消</el-button>
<el-button type="primary" @click="submitForms()">
确 定
</el-button>
</div>
</template>
<template v-else>
<el-form
:inline="true"
ref="refruleForm"
:model="ruleForm"
:rules="rules"
class="demo-form-inline"
>
<!-- <el-form-item label="单位" prop="conUnit" v-if="dialogtitle == '添加'">
<el-input v-model="ruleForm.conUnit" placeholder="请输入单位"></el-input>
</el-form-item>
<el-form-item label="耗材类型" prop="conTypeId" v-if="dialogtitle == '添加'">
<el-select v-model="ruleForm.conTypeId" placeholder="请选择">
<el-option v-for="item in consTypeList" :key="item.conTypeId" :label="item.conTypeName" :value="item.id">
</el-option>
</el-select>
</el-form-item> -->
<!-- <el-form-item
label="耗材类型"
prop="conNames"
v-if="dialogtitle == '添加'"
>
<el-input
v-model="ruleForm.conNames"
placeholder="请输耗材信息名称"
disabled
></el-input>
</el-form-item>-->
<!-- <el-form-item v-if="dialogtitle == '添加'">
<el-button type="primary" @click="typedialogshow = true"
>去选择</el-button
>
</el-form-item> -->
<el-form-item label="耗材信息名称" prop="conName">
<el-input
v-model="ruleForm.conName"
placeholder="请输入耗材信息名称"
></el-input>
</el-form-item>
<!-- <el-form-item label="耗材信息代码" prop="conCode">
<el-input
v-model="ruleForm.conCode"
placeholder="请输入耗材信息代码"
></el-input>
</el-form-item> -->
<el-form-item label="耗材价格">
<el-input
v-model="ruleForm.price"
placeholder="请输入耗材价格"
></el-input>
</el-form-item>
<el-form-item label="预警值">
<el-input
v-model="ruleForm.conWarning"
placeholder="请输入耗材预警值"
></el-input>
</el-form-item>
<el-form-item label="状态" v-if="dialogtitle == '编辑'">
<el-switch
v-model="ruleForm.status"
active-value="1"
inactive-value="0"
></el-switch>
</el-form-item>
<!-- <el-form-item label="单位耗材值" prop="surplusStock">
<el-input v-model="ruleForm.surplusStock" placeholder="请输入单位耗材值"></el-input>
</el-form-item> -->
<el-form-item style="display: flex; justify-content: flex-end">
<el-button @click="dialogshow = false">取 消</el-button>
<el-button type="primary" @click="submitForm('refruleForm')">
确 定
</el-button>
</el-form-item>
</el-form>
</template>
</el-dialog>
<el-dialog title="选择类型" :visible.sync="typedialogshow">
<div class="head-container">
<el-input
v-model="querytypedialogshowquery.conTypeName"
size="small"
clearable
placeholder="请输入耗材类型名称"
style="width: 100%"
class="filter-item"
@keyup.enter.native="getTableDatatype"
/>
<el-input
v-model="querytypedialogshowquery.conTypeCode"
size="small"
clearable
placeholder="请输入耗材类型代码"
style="width: 100%"
class="filter-item"
@keyup.enter.native="getTableDatatype"
/>
<el-select
v-model="querytypedialogshowquery.status"
placeholder="请选择商品规格"
style="width: 100%"
>
<el-option
:label="item.label"
:value="item.value"
v-for="item in typeEnums"
:key="item.label"
/>
</el-select>
<div style="margin-top: 10px">
<el-button type="primary" @click="getTableDatatype">查询</el-button>
<el-button @click="resetHandletype">重置</el-button>
</div>
</div>
<el-table
ref="table"
:data="tableDatatype.data"
v-loading="tableDatatype.loading"
row-key="id"
>
<el-table-column label="耗材类型名称" prop="conTypeName" />
<el-table-column label="耗材类型代码" prop="conTypeCode" />
<el-table-column label="店铺ID" prop="shopId" />
<el-table-column label="状态" prop="status">
<template v-slot="scope">
<el-tag type="primary" v-if="scope.row.status == '1'">正常</el-tag>
<el-tag type="danger" v-if="scope.row.status == '0'">禁用</el-tag>
</template>
</el-table-column>
<el-table-column label="" width="200">
<template v-slot="scope">
<el-button @click="tableDatatypetable(scope.row)">确定</el-button>
</template>
</el-table-column>
</el-table>
<div class="head-container">
<el-pagination
:total="tableDatatype.total"
:current-page="tableDatatype.page + 1"
:page-size="tableDatatype.size"
layout="total, sizes, prev, pager, next, jumper"
@current-change="paginationChangetype"
/>
</div>
</el-dialog>
<el-dialog title="耗材信息" :visible.sync="clickseetypedialogshow">
<div class="head-container">
<el-table
ref="table"
:data="clickseetableData.data"
v-loading="clickseetableData.loading"
row-key="id"
height="450"
>
<el-table-column label="耗材名称" prop="conName" />
<el-table-column label="变动库存" prop="amount">
<template v-slot="scope">
<span :class="{ red: scope.row.bizType == '-' }"
>{{ scope.row.bizType }}{{ scope.row.amount }}</span
>
</template>
</el-table-column>
<el-table-column label="现有库存" prop="balance" />
<!-- <el-table-column label="业务编码" prop="bizCode" /> -->
<el-table-column label="业务说明" prop="bizName" />
<!-- <el-table-column label="正负号标识" prop="bizType" /> -->
<!-- <el-table-column label="耗材id" prop="consId" /> -->
<el-table-column
label="商品信息"
prop="productName"
></el-table-column>
<el-table-column label="创建时间" prop="createTime"></el-table-column>
<!-- <el-table-column label="更新时间" prop="updateTime">
<template v-slot="scope">
{{ dayjs(scope.row.createdAt).format('YYYY-MM-DD HH:mm:ss') }}
</template>
</el-table-column> -->
</el-table>
</div>
<div class="head-container">
<el-pagination
:total="clickseetableData.total"
:current-page="clickseetableData.page + 1"
:page-size="clickseetableData.size"
layout="total, sizes, prev, pager, next, jumper"
@current-change="paginationChangetype"
@size-change="
(e) => {
clickseetableData.size = e;
clickseetableData.page = 0;
getConsRecord();
}
"
/>
</div>
</el-dialog>
<!-- 耗材盘点 -->
<AddConsTakin ref="AddConsTakin" @success="resetHandle" />
<!-- 导入耗材 -->
<el-dialog title="导入库存" :visible.sync="dialogVisible">
<UploadExcel :beforeUpload="excelSuccessUpload" />
</el-dialog>
</div>
</template>
<script>
import Sortable from "sortablejs";
import dayjs from "dayjs";
import settings from "@/settings";
import { upProSort } from "@/api/shop";
function returnPromise(index,prosise){
return new Promise((resolve,reject)=>{
prosise.then(res=>{
console.log(res);
resolve({sucees:true})
}).catch(err=>{
console.log(err);
resolve({sucees:false})
})
})
}
import {
gettbConsType,
gettbConsInfo,
posttbConsInfo,
gettbConsInfoFlow,
posttbConsInfostockIn,
postapitbConsInfo
} from "@/api/consumable";
import AddConsTakin from "../components/addConsTakin";
import { tbConsInfodownload, tbConsInfoinputStock } from '@/api/invoicing'
import { downloadFile } from "@/utils";
import UploadExcel from '@/components/UploadExcel'
export default {
components: { AddConsTakin, UploadExcel },
data() {
return {
dayjs,
consTypeList: [],
query: {
conTypeId: "",
conTypeName: "",
conCode: "",
conName: "",
status: ''
},
resetQuery: '',
libraryshow: false, //耗材入库显示
libraryshowdata: {
id: "",
stockNumber: ""
},
ruleslibrary: {
stockNumber: [
{ required: true, message: "请输入入库数量", trigger: "blur" }
]
},
categorys: [],
typeEnums: [
{
label: "正常",
value: "1"
},
{
label: "禁用",
value: "0"
}
],
dialogshow: false, //弹框显示
dialogtitle: "", //文字显示
typedialogshow: false,
tableData: {
data: [],
page: 0,
size: 30,
loading: false,
total: 0
},
querytypedialogshowquery: {
conTypeCode: "",
conTypeName: "",
status: ""
},
tableDatatype: {
data: [],
page: 0,
size: 30,
loading: false,
total: 0
},
clickseetypedialogshow: false,
clickseetableData: {
data: [],
page: 0,
size: 30,
loading: false,
total: 0
},
ruleFormLoading: false,
ruleForms:[],
ruleForm: {
conCode: "",
conName: "",
conTypeId: "",
price: "0",
conNames: "",
// surplusStock: '',
conUnit: "",
conWarning: "999",
shopId: localStorage.getItem("shopId"),
status: ''
},
rules: {
conCode: [
{ required: true, message: "请输入耗材信息代码", trigger: "blur" }
],
conName: [
{ required: true, message: "请输入耗材信息名称", trigger: "blur" }
],
conTypeId: [
{ required: true, message: "请选择耗材类型", trigger: "change" }
],
price: [{ required: true, message: "请输入耗材价格", trigger: "blur" }],
conWarning: [
{ required: true, message: "请输入耗材预警值", trigger: "blur" }
],
conTypeId: [
{ required: true, message: "请输入耗材类型id", trigger: "blur" }
],
conUnit: [{ required: true, message: "请输入单位", trigger: "blur" }],
conWarning: [
{
required: true,
message: "请输入单位",
trigger: "blur"
}
]
},
downloadLoading: false,
uploadLoading: false,
dialogVisible: false,
consRecordItem: ''
};
},
mounted() {
this.resetQuery = { ...this.query }
this.resetRuleForms()
this.getTableData();
this.getTableDatatype();
this.gettbConsType()
},
methods: {
//解决selectc值改变后未验证问题
selectChange($event,ref,type){
this.$refs[ref][0].validateField(type)
},
//重置添加耗材表单
resetRuleForms(){
this.ruleForms=[{...this.ruleForm}]
this.$refs['refruleForm0']&&this.$refs['refruleForm0'][0].resetFields()
},
//添加耗材弹窗删除
ruleFormsReduce(index){
if(this.ruleForms.length>1){
this.ruleForms.splice(index,1)
}else{
this.$message({ type: "error", message: "至少保留一种耗材" });
}
},
//添加耗材弹窗增加
ruleFormsAdd(){
console.log('add')
this.ruleForms.push({...this.ruleForm})
},
// 导入耗材
async excelSuccessUpload(file) {
try {
this.uploadLoading = true
this.dialogVisible = false
await tbConsInfoinputStock(file)
this.uploadLoading = false
this.$notify.success('导入成功')
this.resetHandle()
} catch (error) {
this.dialogVisible = false
this.uploadLoading = false
console.log(error);
}
},
// 耗材导出
async protHandle() {
try {
this.downloadLoading = true;
const file = await tbConsInfodownload(this.query)
downloadFile(file, "耗材", "xlsx");
this.downloadLoading = false;
} catch (error) {
this.downloadLoading = false;
console.log(error);
}
},
// 编辑
editorHandle(row) {
this.dialogtitle = "编辑";
for (let key in this.ruleForm) {
this.ruleForm[key] = row[key];
}
this.ruleForm.id = row.id;
this.dialogshow = true;
},
// 重置查询
resetHandle() {
this.query = { ...this.resetQuery }
this.tableData.page = 0;
this.getTableData();
},
// 分页回调
paginationChange(e) {
this.tableData.page = e - 1;
this.getTableData();
},
paginationChangetype(e) {
this.clickseetableData.page = e - 1;
this.getConsRecord();
},
// 获取信息
async getTableData() {
this.tableData.loading = true;
try {
const res = await gettbConsInfo({
...this.query,
page: this.tableData.page,
size: this.tableData.size,
shopId: localStorage.getItem("shopId")
});
this.tableData.loading = false;
this.tableData.data = res.content;
this.tableData.total = res.totalElements;
} catch (error) {
console.log(error);
}
},
// 获取类型
async gettbConsType() {
try {
const res = await gettbConsType({
page: 0,
size: 100,
shopId: localStorage.getItem("shopId")
})
this.consTypeList = res.content
} catch (error) {
console.log(error);
}
},
// 获取类型
async getTableDatatype() {
this.tableDatatype.loading = true;
try {
const res = await gettbConsType({
page: this.tableDatatype.page,
size: this.tableDatatype.size,
conTypeCode: this.querytypedialogshowquery.conTypeCode,
conTypeName: this.querytypedialogshowquery.conTypeName,
status: this.querytypedialogshowquery.status,
shopId: localStorage.getItem("shopId")
});
this.tableDatatype.loading = false;
this.tableDatatype.data = res.content;
this.tableDatatype.total = res.totalElements;
} catch (error) {
console.log(error);
}
},
// 重置查询
resetHandletype() {
this.querytypedialogshowquery.conTypeName = "";
this.querytypedialogshowquery.conTypeCode = "";
this.querytypedialogshowquery.status = "";
this.tableData.page = 0;
this.getTableDatatype();
},
// 选择的类型
tableDatatypetable(item) {
// this.ruleForm.conCode = item.conTypeCode
this.ruleForm.conNames = item.conTypeName;
this.ruleForm.conTypeId = item.id;
this.typedialogshow = false;
},
async clickdialogfadd(item) {
this.libraryshow = true;
this.libraryshowdata.id = item.id;
},
async clickdialoglibraryshow(formName) {
this.$refs[formName].validate(async valid => {
if (valid) {
await posttbConsInfostockIn({
id: this.libraryshowdata.id,
stockNumber: this.libraryshowdata.stockNumber
});
this.libraryshow = false;
this.$refs[formName].resetFields();
this.getTableData();
} else {
console.log("error submit!!");
return false;
}
});
},
// 弹框修改值 添加 编辑
clickdialogframe(type, item) {
if (type == "add") {
// 添加
this.dialogtitle = "添加";
this.gettbConsType()
this.$nextTick(() => {
// this.$refs.refruleForm.resetFields();
this.resetRuleForms()
});
} else {
this.dialogtitle = "编辑";
this.ruleForm.id = item.id;
this.ruleForm.conTypeId = item.conTypeId;
this.ruleForm.conCode = item.conCode;
this.ruleForm.conName = item.conName;
// this.ruleForm.surplusStock = item.surplusStock
this.ruleForm.conWarning = item.conWarning;
this.ruleForm.conUnit = item.conUnit;
}
this.dialogshow = true;
},
//添加
async submitForms() {
let isAllPassForm=0
for(let i in this.ruleForms){
const res=await returnPromise(i,this.$refs['refruleForm'+i][0].validate())
console.log(res)
isAllPassForm+=res.sucees?1:0
}
//判断验证是否通过
if(isAllPassForm===this.ruleForms.length){
await posttbConsInfo( this.ruleForms)
this.$message({ type: "success", message: "添加成功" });
// for(let i of this.ruleForms){
// const res=await posttbConsInfo(i)
// this.$message({ type: "success", message: "添加成功" });
// }
this.dialogshow = false;
this.resetRuleForms()
this.ruleFormLoading = false;
this.getTableData();
}
},
//编辑
submitForm(formName) {
this.$refs[formName].validate(async valid => {
if (valid) {
this.ruleFormLoading = true;
if (this.dialogtitle == "编辑") {
await postapitbConsInfo(this.ruleForm);
this.$message({ type: "success", message: "编辑成功" });
this.dialogshow = false;
} else {
// //添加
// console.log(this.ruleForm, '调试')
// for(let i of this.ruleForms){
// console.log(i)
// await posttbConsInfo({
// ...i
// });
// this.$message({ type: "success", message: "添加成功" });
// }
}
this.dialogshow = false;
this.$refs[formName].resetFields();
this.ruleFormLoading = false;
this.getTableData();
} else {
console.log("error submit!!");
return false;
}
});
},
resetForm(formName) {
this.$refs[formName].resetFields();
},
// 删除商品
async delTableHandle(ids) {
try {
await tbProductDelete(ids);
this.getTableData();
} catch (error) {
console.log(error);
}
},
// 显示耗材记录
async clicksee(item) {
this.consRecordItem = item
this.clickseetypedialogshow = true;
this.getConsRecord()
},
// 获取耗材记录
async getConsRecord() {
try {
this.clickseetableData.loading = true;
const res = await gettbConsInfoFlow({
page: this.clickseetableData.page,
size: this.clickseetableData.size,
consId: this.consRecordItem.id,
conName: this.consRecordItem.conName,
shopId: localStorage.getItem("shopId")
});
this.clickseetableData.loading = false;
this.clickseetableData.data = res.content;
this.clickseetableData.total = res.totalElements;
} catch (error) {
console.log(error);
}
}
}
};
</script>
<style scoped lang="scss">
.color-success {
color: #67c23a;
cursor: pointer;
font-weight: 700;
}
.color-danger {
color: #f56c6c;
font-weight: 700;
cursor: pointer;
}
.row_wrap {
display: flex;
justify-content: space-between;
.row {
display: flex;
align-items: center;
gap: 10px;
}
}
.handle {
font-size: 18px;
color: #999;
&:hover {
cursor: grab;
}
}
.shop_info {
display: flex;
.info {
flex: 1;
padding-left: 8px;
display: flex;
flex-direction: column;
.tag_wrap {
display: flex;
}
}
}
.red {
color: rgb(219, 32, 32);
}
</style>